V3: quote block for customer cases

src/components/customerCases/customerCase/CustomerCase.tsx

@@ -67,9 +67,16 @@ export default function CustomerCase({ customerCase }: CustomerCaseProps) {
             <div key={section._key}>
               {section._type === "richTextBlock" ? (
                 <RichText value={section.richText} />
+              ) : section._type === "quoteBlock" ? (
+                section.quote && (
+                  <div>
+                    <Text>{section.quote}</Text>
+                    {section.author && <Text>- {section.author}</Text>}
+                  </div>
+                )
               ) : (
                 <div className={styles.imageBlockWrapper}>
-                  {section.images.map((image) => (
+                  {section.images?.map((image) => (
                     <div
                       key={image._key}
                       className={styles.imageBlockImageWrapper}

studioShared/lib/interfaces/customerCases.ts

@@ -1,6 +1,7 @@
 import { IImage } from "studio/lib/interfaces/media";
 
 import { ImageBlock } from "./imageBlock";
+import { QuoteBlock } from "./quoteBlock";
 import { RichTextBlock } from "./richTextBlock";
 
 export interface CustomerCaseProjectInfo {
@@ -21,7 +22,7 @@ export interface CustomerCaseBase {
   image: IImage;
 }
 
-export type CustomerCaseSections = (RichTextBlock | ImageBlock)[];
+export type CustomerCaseSections = (RichTextBlock | ImageBlock | QuoteBlock)[];
 
 export interface CustomerCase extends CustomerCaseBase {
   projectInfo: CustomerCaseProjectInfo;

studioShared/lib/interfaces/quoteBlock.ts

@@ -0,0 +1,6 @@
+export interface QuoteBlock {
+  _key: string;
+  _type: "quoteBlock";
+  quote?: string;
+  author?: string;
+}

studioShared/lib/queries/customerCases.ts

@@ -55,7 +55,11 @@ export const CUSTOMER_CASE_QUERY = groq`
         "list": list[] {
           "text": ${translatedFieldFragment("text")},
         },
-      }
+      }, 
+      _type == "quoteBlock" => {
+        "quote": ${translatedFieldFragment("quote")},
+        "author": ${translatedFieldFragment("author")},
+      },
     }
   }
 `;

studioShared/schemas/documents/customerCase.ts

@@ -8,6 +8,7 @@ import { firstTranslation } from "studio/utils/i18n";
 import { customerCaseProjectInfo } from "studioShared/schemas/fields/customerCaseProjectInfo";
 import imageBlock from "studioShared/schemas/objects/imageBlock";
 import listBlock from "studioShared/schemas/objects/listBlock";
+import quoteBlock from "studioShared/schemas/objects/quoteBlock";
 import richTextBlock from "studioShared/schemas/objects/richTextBlock";
 
 export const customerCaseID = "customerCase";
@@ -49,7 +50,7 @@ const customerCase = defineType({
       title: "Sections",
       description: "Add sections here",
       type: "array",
-      of: [richTextBlock, imageBlock, listBlock],
+      of: [richTextBlock, imageBlock, listBlock, quoteBlock],
     }),
   ],
   preview: {

studioShared/schemas/objects/quoteBlock.ts

@@ -0,0 +1,30 @@
+import { defineField } from "sanity";
+
+import { firstTranslation } from "studio/utils/i18n";
+
+const quoteBlock = defineField({
+  name: "quoteBlock",
+  type: "object",
+  title: "Quote Block",
+  fields: [
+    {
+      name: "quote",
+      type: "internationalizedArrayText",
+      title: "Quote",
+    },
+    {
+      name: "author",
+      type: "internationalizedArrayString",
+      title: "Author of the quote",
+    },
+  ],
+  preview: {
+    select: {
+      title: "quote",
+    },
+    prepare({ title }) {
+      return { title: firstTranslation(title) ?? undefined };
+    },
+  },
+});
+export default quoteBlock;