add richtextfield to customer case type

src/app/(main)/[slug]/page.tsx

@@ -72,13 +72,17 @@ async function Page({ params }: Props) {
       { slug },
       { perspective },
     ),
-    loadStudioQuery<CompanyLocation[]>(COMPANY_LOCATIONS_QUERY, {}, { perspective }),
+    loadStudioQuery<CompanyLocation[]>(
+      COMPANY_LOCATIONS_QUERY,
+      {},
+      { perspective },
+    ),
     loadStudioQuery<CustomerCasePage>(
       CUSTOMER_CASES_PAGE_QUERY,
       { slug },
       { perspective },
     ),
-    loadSharedQuery<CustomerCase>(CUSTOMER_CASES_QUERY, {}, { perspective }),
+    loadSharedQuery<CustomerCase[]>(CUSTOMER_CASES_QUERY, {}, { perspective }),
   ]);
 
   if (initialPage.data) {

src/app/(main)/layout.tsx

@@ -36,8 +36,16 @@ export default async function Layout({
   ] = await Promise.all([
     loadStudioQuery<Navigation>(NAV_QUERY, {}, { perspective }),
     loadStudioQuery<CompanyInfo>(COMPANY_INFO_QUERY, {}, { perspective }),
-    loadStudioQuery<SocialMediaProfiles>(SOMEPROFILES_QUERY, {}, { perspective }),
-    loadStudioQuery<LegalDocument[]>(LEGAL_DOCUMENTS_QUERY, {}, { perspective }),
+    loadStudioQuery<SocialMediaProfiles>(
+      SOMEPROFILES_QUERY,
+      {},
+      { perspective },
+    ),
+    loadStudioQuery<LegalDocument[]>(
+      LEGAL_DOCUMENTS_QUERY,
+      {},
+      { perspective },
+    ),
     loadStudioQuery<BrandAssets>(BRAND_ASSETS_QUERY, {}, { perspective }),
   ]);
 

src/customerCases/CustomerCases.tsx

@@ -1,12 +1,12 @@
 import Text from "src/components/text/Text";
 import { CustomerCasePage } from "studio/lib/interfaces/specialPages";
 import { CustomerCase } from "studioShared/lib/interfaces/customerCases";
-
+import { RichText } from "src/components/richText/RichText";
 import styles from "./customerCases.module.css";
 
 interface CustomerCasesProps {
   customerCases: CustomerCasePage;
-  sharedCustomerCases: CustomerCase;
+  sharedCustomerCases: CustomerCase[];
 }
 
 const CustomerCases = async ({
@@ -16,6 +16,14 @@ const CustomerCases = async ({
   return (
     <div className={styles.wrapper}>
       <Text type="h1"> {customerCases.basicTitle} </Text>
+      {sharedCustomerCases.map((customerCase: CustomerCase) => (
+        <div>
+          <Text key={customerCase._id} type="h2">
+            {customerCase.basicTitle}
+          </Text>
+          {customerCase.richText && <RichText value={customerCase.richText} />}
+        </div>
+      ))}
     </div>
   );
 };

src/customerCases/CustomerCasesPreview.tsx

@@ -10,7 +10,7 @@ import CustomerCases from "./CustomerCases";
 
 interface CustomerCasesPreviewProps {
   initialCustomerCases: QueryResponseInitial<CustomerCasePage>;
-  initialSharedCustomerCases: QueryResponseInitial<CustomerCase>;
+  initialSharedCustomerCases: QueryResponseInitial<CustomerCase[]>;
 }
 
 const CustomerCasesPreview = ({
@@ -23,7 +23,7 @@ const CustomerCasesPreview = ({
     { initial: initialCustomerCases },
   );
 
-  const { data: sharedCustomerCases } = useQuery<CustomerCase>(
+  const { data: sharedCustomerCases } = useQuery<CustomerCase[]>(
     CUSTOMER_CASES_QUERY,
     {},
     { initial: initialSharedCustomerCases },

src/customerCases/customerCases.module.css

@@ -1,7 +1,6 @@
 .wrapper {
-    display: flex;
-    flex-direction: column;
-    padding: 10rem 5rem;
-    gap: 5rem;
-  }
-
+  display: flex;
+  flex-direction: column;
+  padding: 10rem 5rem;
+  gap: 5rem;
+}

studio/lib/store.ts

@@ -1,13 +1,13 @@
-import {createQueryStore} from "@sanity/react-loader";
+import { createQueryStore } from "@sanity/react-loader";
 
 import { client } from "./client";
 import { token } from "./token";
 
-const {
-    loadQuery: loadStudioQuery,
-    setServerClient,
-  } = createQueryStore({client: false, ssr: true})
+const { loadQuery: loadStudioQuery, setServerClient } = createQueryStore({
+  client: false,
+  ssr: true,
+});
 
-  setServerClient(client.withConfig({ token }));
+setServerClient(client.withConfig({ token }));
 
-export { loadStudioQuery }
+export { loadStudioQuery };

studioShared/lib/interfaces/customerCases.ts

@@ -1,3 +1,4 @@
+import { PortableTextBlock } from "src/components/richText/RichText";
 import { Slug } from "./global";
 
 export interface CustomerCase {
@@ -9,4 +10,5 @@ export interface CustomerCase {
   _createdAt: string;
   _rev: string;
   _type: string;
+  richText: PortableTextBlock[];
 }

studioShared/lib/store.ts

@@ -1,13 +1,13 @@
-import {createQueryStore} from "@sanity/react-loader";
+import { createQueryStore } from "@sanity/react-loader";
 
 import { sharedClient } from "./client";
 import { token } from "./token";
 
-const {
-    loadQuery: loadSharedQuery,
-    setServerClient,
-  } = createQueryStore({client: false, ssr: true})
+const { loadQuery: loadSharedQuery, setServerClient } = createQueryStore({
+  client: false,
+  ssr: true,
+});
 
 setServerClient(sharedClient.withConfig({ token }));
 
-export { loadSharedQuery }; 
+export { loadSharedQuery };