Refactor handling and styling in project gallery page

app/(personal)/projects/[slug]/gallery/page.tsx

@@ -13,12 +13,11 @@ import Bridge from "../../../../../components/Icons/Bridge"
 
 type Props = {
   params: { slug: string },
-  SeoData: SeoType
 }
 
-const GalleryPage: NextPage = async ({ params , SeoData}: Props,) => {
-  console.log(params)
+const GalleryPage: NextPage = async ({ params }: Props,) => {
   const initial = await loadProject(params.slug)
+  // console.log(initial)
   const currentURL = `https://ece21.vercel.app/projects/${params.slug}/gallery`
   const handleSocialShare = (socialPlatform: any) => {
     // Replace this with your custom share functionality
@@ -29,7 +28,7 @@ const GalleryPage: NextPage = async ({ params , SeoData}: Props,) => {
   }
 
   return (
-    <CustomNextSeo seo={SeoData} slug={params?.slug}>
+    <CustomNextSeo seo={initial?.data?.seo ?? null} slug={params?.slug}>
       <main className="mx-auto max-w-[1960px] p-4">
         <div className="columns-1 gap-4 sm:columns-2 xl:columns-3 2xl:columns-4">
           <div className="after:content border-spacing-2 border relative mb-5 flex h-[540px] md:[h-600px] lg:h-[650px] flex-col items-center justify-end gap-4 overflow-hidden rounded-lg bg-white/90 px-6 pb-16 pt-64 text-center shadow-highlight after:pointer-events-none after:absolute after:inset-0 after:rounded-lg after:shadow-highlight lg:pt-0">
@@ -81,7 +80,7 @@ const GalleryPage: NextPage = async ({ params , SeoData}: Props,) => {
           <Gallery data={initial?.data} />
         </div>
       </main>
-      <footer className="p-6 text-center text-white/80 sm:p-12">
+      {/* <footer className="p-6 text-center text-white/80 sm:p-12">
         Thank you to{' '}
         <a
           href="https://edelsonphotography.com/"
@@ -110,7 +109,7 @@ const GalleryPage: NextPage = async ({ params , SeoData}: Props,) => {
           Gary Sexton
         </a>{' '}
         for the pictures.
-      </footer>
+      </footer> */}
     </CustomNextSeo>
   )
 }

components/shared/CustomPortableText.tsx

@@ -8,6 +8,13 @@ import type { Image } from 'sanity'
 import ImageBox from '@/components/shared/ImageBox'
 import { TimelineSection } from '@/components/shared/TimelineSection'
 
+const mathInlineIcon = () => (
+  <span>
+    <span style={{ fontWeight: 'bold' }}>∑</span>b
+  </span>
+)
+const mathIcon = () => <span style={{ fontWeight: 'bold' }}>∑</span>
+
 export function CustomPortableText({
   paragraphClasses,
   value,

package.json

@@ -62,6 +62,7 @@
     "sanity": "^3.61.0",
     "sanity-plugin-asset-source-unsplash": "3.0.1",
     "sanity-plugin-cloudinary": "^1.1.3",
+    "sanity-plugin-latex-input": "^2.0.4",
     "sanity-plugin-seo": "^1.2.5",
     "server-only": "0.0.1",
     "simplex-noise": "^4.0.3",

sanity.config.ts

@@ -8,8 +8,9 @@ import { defineConfig } from 'sanity'
 import { presentationTool } from 'sanity/presentation'
 import { structureTool } from 'sanity/structure'
 import { unsplashImageAsset } from 'sanity-plugin-asset-source-unsplash'
-import { cloudinaryAssetSourcePlugin } from 'sanity-plugin-cloudinary'
+import { cloudinaryAssetSourcePlugin, cloudinaryImageSource } from 'sanity-plugin-cloudinary'
 import { cloudinarySchemaPlugin } from 'sanity-plugin-cloudinary'
+import { latexInput } from 'sanity-plugin-latex-input'
 import { seoMetaFields } from 'sanity-plugin-seo'
 
 import { apiVersion, dataset, projectId, studioUrl } from '@/sanity/lib/api'
@@ -18,6 +19,7 @@ import { pageStructure, singletonPlugin } from '@/sanity/plugins/settings'
 import page from '@/sanity/schemas/documents/page'
 import project from '@/sanity/schemas/documents/project'
 import duration from '@/sanity/schemas/objects/duration'
+import latexEquation from '@/sanity/schemas/objects/latexEquation'
 import milestone from '@/sanity/schemas/objects/milestone'
 import timeline from '@/sanity/schemas/objects/timeline'
 import home from '@/sanity/schemas/singletons/home'
@@ -48,11 +50,13 @@ export default defineConfig({
       // Objects
       milestone,
       timeline,
+      latexEquation
     ],
   },
   plugins: [
     cloudinaryAssetSourcePlugin(),
     seoMetaFields(),
+    latexInput(),
     cloudinarySchemaPlugin(),
     structureTool({
       structure: pageStructure([home, ladder, settings]),

sanity/schemas/documents/page.ts

@@ -84,6 +84,10 @@ export default defineType({
           name: 'timeline',
           type: 'timeline',
         }),
+        defineField({
+          name: 'latexEquation',
+          type: 'latexEquation',
+        }),
         defineField({
           type: 'image',
           icon: ImageIcon,

sanity/schemas/objects/latexEquation.ts

@@ -0,0 +1,30 @@
+import { Calculator, CalculatorIcon } from 'lucide-react'
+import { defineField, defineType } from 'sanity'
+
+export default defineType({
+  name: 'latexEquation',
+  title: 'LatexEquation',
+  type: 'object',
+  fields: [
+    defineField({
+      name: 'equation',
+      title: 'Equation',
+      type: 'array',
+      description:
+        'Use LaTeX to write mathematical equations. For inline math, use the inline math block. For block math, use the math block.',
+      of: [
+        {
+          type: 'block',
+          title: 'Block',
+          of: [{ type: 'latex', icon: CalculatorIcon, title: 'Inline math' }],
+        },
+        { type: 'latex', icon: CalculatorIcon, title: 'Math block' },
+      ],
+      options: {
+        layout: 'tags',
+      },
+    }),
+  ],
+})
+
+

types/index.ts

@@ -35,6 +35,7 @@ export interface ShowcaseProject {
 // Page payloads
 
 export interface HomePagePayload {
+  seo?: SeoType
   footer?: PortableTextBlock[]
   overview?: PortableTextBlock[]
   showcaseProjects?: ShowcaseProject[]
@@ -49,6 +50,7 @@ export interface LadderPayload {
 
 export interface PagePayload {
   body?: PortableTextBlock[]
+  seo?: SeoType
   name?: string
   overview?: PortableTextBlock[]
   title?: string
@@ -57,6 +59,7 @@ export interface PagePayload {
 
 export interface ProjectPayload {
   client?: string
+  seo?: SeoType
   coverImage?: Image
   description?: PortableTextBlock[]
   cloudinaryList?: any