WIP ideas for Studio preview pane

Author: andybywire

studio/sanity.config.tsx

@@ -6,6 +6,9 @@ import type {StructureBuilder} from 'sanity/structure'
 import {visionTool} from '@sanity/vision'
 import {taxonomyManager} from 'sanity-plugin-taxonomy-manager'
 import {schemaTypes} from './schemaTypes'
+// import parse from 'html-react-parser' // Import html-react-parser
+// npm install html-react-parser
+
 // import {disciplineTemplate} from '../web/_src/discipline_js.11ty.js'
 
 const hiddenDocTypes = (listItem: any) =>
@@ -22,6 +25,26 @@ export function defaultDocumentNode(S: StructureBuilder, {schemaType}: {schemaTy
 const WebPreview = ({document}: any) => {
   const {displayed: discipline} = document
   // return disciplineTemplate(discipline) // once I sort out how to transform the export
+  // below is how I would do this if I want to reuse templates from 11ty.
+  // this would work better for simple, self-contained templates. For what I'm doing
+  // with UX Methods, where there are several sections mixed in with other data, this 
+  // may not be the best approach.
+
+//   const templateString =   `<main>
+//   <h1>${discipline.title}</h1>
+//   <p>${discipline.metaDescription}</p>
+//   <p>
+//     <a href="/">back to index</a>
+//   </p>
+// </main>`
+
+  // return templateString
+
+// return templateString
+// return <div>{parse(templateString)}</div> // Use html-react-parser to safely parse and render the HTML string
+
+  // return <div dangerouslySetInnerHTML={{__html: templateString}} />
+
   return (
     <main>
       <h1>{discipline.title}</h1>