V3-fetch-legal-document-by-language

src/app/(main)/layout.tsx

@@ -11,7 +11,7 @@ import { Navigation } from "studio/lib/interfaces/navigation";
 import { SocialMediaProfiles } from "studio/lib/interfaces/socialMedia";
 import { BRAND_ASSETS_QUERY } from "studio/lib/queries/brandAssets";
 import { COMPANY_INFO_QUERY } from "studio/lib/queries/companyDetails";
-import { LEGAL_DOCUMENTS_QUERY } from "studio/lib/queries/legalDocuments";
+import { LEGAL_DOCUMENTS_BY_LANG_QUERY } from "studio/lib/queries/legalDocuments";
 import { NAV_QUERY } from "studio/lib/queries/navigation";
 import { SOMEPROFILES_QUERY } from "studio/lib/queries/socialMediaProfiles";
 import { loadStudioQuery } from "studio/lib/store";
@@ -42,8 +42,8 @@ export default async function Layout({
       { perspective },
     ),
     loadStudioQuery<LegalDocument[]>(
-      LEGAL_DOCUMENTS_QUERY,
-      {},
+      LEGAL_DOCUMENTS_BY_LANG_QUERY,
+      { language: "en" }, //TODO: replace this with selected language for the page
       { perspective },
     ),
     loadStudioQuery<BrandAssets>(BRAND_ASSETS_QUERY, {}, { perspective }),

src/app/(main)/legal/[id]/page.tsx

@@ -2,7 +2,7 @@ import Legal from "src/blog/components/legal/Legal";
 import LegalPreview from "src/blog/components/legal/LegalPreview";
 import { getDraftModeInfo } from "src/utils/draftmode";
 import { LegalDocument } from "studio/lib/interfaces/legalDocuments";
-import { LEGAL_DOCUMENT_SLUG_QUERY } from "studio/lib/queries/legalDocuments";
+import { LEGAL_DOCUMENTS_BY_SLUG_AND_LANG_QUERY } from "studio/lib/queries/legalDocuments";
 import { loadStudioQuery } from "studio/lib/store";
 
 export const dynamic = "force-dynamic";
@@ -20,8 +20,8 @@ async function Page({ params }: Props) {
   const { perspective, isDraftMode } = getDraftModeInfo();
 
   const initialDocument = await loadStudioQuery<LegalDocument>(
-    LEGAL_DOCUMENT_SLUG_QUERY,
-    { slug: id },
+    LEGAL_DOCUMENTS_BY_SLUG_AND_LANG_QUERY,
+    { slug: id, language: "en" }, //TODO: replace this with selected language for the page
     { perspective },
   );
 
@@ -32,6 +32,7 @@ async function Page({ params }: Props) {
   if (isDraftMode) {
     return <LegalPreview initialDocument={initialDocument} />;
   }
+
   if (initialDocument) {
     return <Legal document={initialDocument.data} />;
   }

src/components/navigation/footer/Footer.tsx

@@ -54,7 +54,7 @@ const Footer = ({
         {legalData?.map((legal) => {
           const path = `legal/${legal.slug.current}`;
           const link = {
-            _key: legal._key,
+            _key: legal._id,
             _type: legal._type,
             linkTitle: legal.basicTitle,
             linkType: LinkType.Internal,
@@ -63,7 +63,7 @@ const Footer = ({
             },
           };
           return (
-            <li key={legal.slug.current}>
+            <li key={legal._id}>
               <CustomLink link={link} type="footerLink" />
             </li>
           );

studio/lib/interfaces/legalDocuments.ts

@@ -3,9 +3,17 @@ import { PortableTextBlock } from "sanity";
 import { Slug } from "./global";
 
 export interface LegalDocument {
-  _key: string;
+  _id: string;
   _type: string;
-  basicTitle: string;
   slug: Slug;
+  basicTitle: string;
   richText: PortableTextBlock[];
+  _translations: Translations[];
+}
+
+interface Translations {
+  basicTitle: string;
+  language: string;
+  richText: PortableTextBlock[];
+  slug: Slug;
 }

studio/lib/queries/legalDocuments.ts

@@ -1,9 +1,5 @@
 import { groq } from "next-sanity";
 
-export const LEGAL_DOCUMENTS_QUERY = groq`
-  *[_type == "legalDocuments"]
-`;
+export const LEGAL_DOCUMENTS_BY_LANG_QUERY = groq`*[_type == "legalDocument" && language == $language]`;
 
-export const LEGAL_DOCUMENT_SLUG_QUERY = groq`
-  *[_type == "legalDocuments" && slug.current == $slug][0]
-`;
+export const LEGAL_DOCUMENTS_BY_SLUG_AND_LANG_QUERY = groq`*[_type == "legalDocument" && language == $language && slug.current == $slug][0]`;