treefarmstudio / astro-sanity

This is a helper package to integrate Astro and Sanity
https://www.npmjs.com/package/astro-sanity
MIT License
102 stars 10 forks source link

An Astro native portable text solution #27

Open runeb opened 1 year ago

runeb commented 1 year ago

Thank you for this project! I have one request regarding the portable text handling in this project. The way it is currently handled is by rendering to html via @portabletext/to-html@1.0.4 and setting the html string directly on a fragment.

There is an Astro native way to do this which lets you emit Astro components instead: https://github.com/theisel/astro-portabletext. Would you consider updating your project to leverage this module instead?

It then becomes

---
import { PortableText } from "astro-portabletext";
import Code from "./Code.astro";
const {portableText} = Astro.props;

const components = {
  type: {
    code: Code
  },
}
---

<PortableText
  value={portableText}
  components={components}
/>

And you can write proper Astro components for your custom types

---
import { Prism } from '@astrojs/prism';
const {node} = Astro.props;
const {code, language} = node;
---

<Prism lang={language} code={code}></Prism>

Thanks again for the work on this!