From e921a8ed5e5f5fc5052cdc404c862c5d0eb7ab82 Mon Sep 17 00:00:00 2001 From: ChrisLaRocque Date: Wed, 13 Mar 2024 14:10:21 -0400 Subject: [PATCH] Yank out self-fetching portable text components --- next/app/story/[slug]/page.tsx | 6 ++++ next/components/bynder-block/index.tsx | 19 +++++++------ next/components/data-table/index.tsx | 12 ++++---- next/components/dynamic-cta/index.tsx | 12 ++++---- .../story/custom-portable-text/components.tsx | 6 +++- next/components/pages/story/index.tsx | 28 ++++++++++++++++++- next/components/pages/story/preview.tsx | 7 ++++- next/next.config.js | 12 ++++++++ sanity/schemas/documents/index.ts | 2 ++ sanity/schemas/documents/redirect.ts | 25 +++++++++++++++++ 10 files changed, 106 insertions(+), 23 deletions(-) create mode 100644 sanity/schemas/documents/redirect.ts diff --git a/next/app/story/[slug]/page.tsx b/next/app/story/[slug]/page.tsx index f692cb3..6bc99bc 100644 --- a/next/app/story/[slug]/page.tsx +++ b/next/app/story/[slug]/page.tsx @@ -29,6 +29,12 @@ export async function generateMetadata({ export default async function StoryPage({ params }: PageParams) { const { slug } = params; const initial = await pageData(slug); + initial.data.content = initial.data.content.map((item) => { + if (item && item.refData && item.refData.length) { + item = item.refData[0]; + } + return item; + }); if (draftMode().isEnabled) { return ; diff --git a/next/components/bynder-block/index.tsx b/next/components/bynder-block/index.tsx index 88e91d5..2a12e80 100644 --- a/next/components/bynder-block/index.tsx +++ b/next/components/bynder-block/index.tsx @@ -1,6 +1,8 @@ import RenderBynderBlock from "./component"; -import { loadQuery } from "@/lib/sanity/store"; -import query from "./query"; + +// import { loadQuery } from "@/lib/sanity/loader/loadQuery"; +// import query from "./query"; + import { ISanityDocument } from "@/lib/sanity/types"; /** * Maps to the 'dynamicCta' object type in Sanity. @@ -17,12 +19,13 @@ export interface ISanityBynderBlockDocument extends ISanityDocument { caption: any[]; bynderAsset: any; } -const componentData = async (params: TParams) => - await loadQuery(query, params); +// const componentData = async (params: TParams) => +// await loadQuery(query, params); + +export default async function BynderBlock(props) { + // const params = { _id: _ref }; -export default async function DynamicCTA({ _ref }: { _ref: string }) { - const params = { _id: _ref }; - const initial = await componentData(params); + // const initial = await componentData(params); - return ; + return ; } diff --git a/next/components/data-table/index.tsx b/next/components/data-table/index.tsx index 26a1da9..a0664ea 100644 --- a/next/components/data-table/index.tsx +++ b/next/components/data-table/index.tsx @@ -15,12 +15,12 @@ export interface ISanityDataTableDocument extends ISanityDocument { tickers: string[]; columnHeaders: string[]; } -const componentData = async (params: TParams) => - await loadQuery(query, params); +// const componentData = async (params: TParams) => +// await loadQuery(query, params); -export default async function DataTable({ _ref }: { _ref: string }) { - const params = { _id: _ref }; - const initial = await componentData(params); +export default async function DataTable(props) { + // const params = { _id: _ref }; + // const initial = await componentData(params); - return ; + return ; } diff --git a/next/components/dynamic-cta/index.tsx b/next/components/dynamic-cta/index.tsx index c3024bc..f6fa11f 100644 --- a/next/components/dynamic-cta/index.tsx +++ b/next/components/dynamic-cta/index.tsx @@ -17,12 +17,12 @@ interface ISanityDynamicCTADocument extends ISanityDocument { heading: string; button: TButtonProps; } -const componentData = async (params: TParams) => - await loadQuery(query, params); +// const componentData = async (params: TParams) => +// await loadQuery(query, params); -export default async function DynamicCTA({ _ref }: { _ref: string }) { - const params = { _id: _ref }; - const initial = await componentData(params); +export default async function DynamicCTA(props) { + // const params = { _id: _ref }; + // const initial = await componentData(params); - return ; + return ; } diff --git a/next/components/pages/story/custom-portable-text/components.tsx b/next/components/pages/story/custom-portable-text/components.tsx index 2ee9923..2f7f757 100644 --- a/next/components/pages/story/custom-portable-text/components.tsx +++ b/next/components/pages/story/custom-portable-text/components.tsx @@ -3,6 +3,8 @@ import BynderBlock from "@/components/bynder-block"; import StoryImage from "../story-image"; import ReferenceResolver from "../reference-resolver"; import { ReactNode } from "react"; +import DynamicCTA from "@/components/dynamic-cta"; +import DataTable from "@/components/data-table"; export const components = { // Custom block types require their own custom components @@ -10,7 +12,9 @@ export const components = { image: StoryImage, table: PortableTable, bynderBlock: BynderBlock, - reference: ReferenceResolver, + dynamicCta: DynamicCTA, + dataTable: DataTable, + // reference: ReferenceResolver, }, // Wrap normal elements with Tailwind classes for styling block: { diff --git a/next/components/pages/story/index.tsx b/next/components/pages/story/index.tsx index 0690283..f364f7b 100644 --- a/next/components/pages/story/index.tsx +++ b/next/components/pages/story/index.tsx @@ -18,7 +18,32 @@ type TStoryProps = { }; export const query = (slug: string) => - groq`*[_type == "story" && slug.current == '${slug}'][0]{slug, title, summary, displayDate, _id, _type, featuredImage{...}, content[]{..., button{..., "to":to->{slug, _type}}, "refType":*[_id==^._ref]._type}, seoData{...,}, taxonomy[]{...,taxonomyAttribute->{name}, terms[]->{name, _id}}}`; + groq`*[_type == "story" && slug.current == '${slug}'][0]{ + slug, + title, + summary, + displayDate, + _id, + _type, + featuredImage{...}, + content[]{ + ..., + button { + ..., + "to":to->{slug, _type} + }, + "refType":*[_id==^._ref]._type, + "refData":*[_id==^._ref]{ + ..., + }, + }, + seoData {...,}, + taxonomy[]{ + ..., + taxonomyAttribute->{name}, + terms[]->{name, _id} + } + }`; export default function Story({ data, @@ -31,6 +56,7 @@ export default function Story({ timeZone: "UTC", }) : null; + return (
diff --git a/next/components/pages/story/preview.tsx b/next/components/pages/story/preview.tsx index 152b2bc..788da08 100644 --- a/next/components/pages/story/preview.tsx +++ b/next/components/pages/story/preview.tsx @@ -14,7 +14,12 @@ export default function StoryPreview({ params, initial }: StoryPreview) { const { data } = useQuery(query(slug), params, { initial, }); - + data.content = data.content.map((item) => { + if (item && item.refData && item.refData.length) { + item = item.refData[0]; + } + return item; + }); return ( diff --git a/next/next.config.js b/next/next.config.js index a25a0e6..cc2985b 100644 --- a/next/next.config.js +++ b/next/next.config.js @@ -1,4 +1,13 @@ +// const { createClient } = require("@sanity/client"); + /** @type {import('next').NextConfig} */ +// const client = createClient({ +// projectId: "your-project-id", +// dataset: "production", +// useCdn: false, +// apiVersion: "2023-05-03", // use current date (YYYY-MM-DD) to target the latest API version +// // token: process.env.SANITY_SECRET_TOKEN // Only if you want to update content with the client +// }); const nextConfig = { eslint: { // Warning: This allows production builds to successfully complete even if @@ -8,6 +17,9 @@ const nextConfig = { typescript: { ignoreBuildErrors: true, }, + experimental: { + taint: true, + }, }; module.exports = nextConfig; diff --git a/sanity/schemas/documents/index.ts b/sanity/schemas/documents/index.ts index 639b205..e98cf8c 100644 --- a/sanity/schemas/documents/index.ts +++ b/sanity/schemas/documents/index.ts @@ -7,6 +7,7 @@ import querySet from './query-set' import dynamicCta from './dynamic-cta' import bynderBlock from './bynder-block' import dataTable from './data-table' +import redirect from './redirect' export default [ story, @@ -18,4 +19,5 @@ export default [ dynamicCta, bynderBlock, dataTable, + redirect, ] diff --git a/sanity/schemas/documents/redirect.ts b/sanity/schemas/documents/redirect.ts new file mode 100644 index 0000000..eac99b9 --- /dev/null +++ b/sanity/schemas/documents/redirect.ts @@ -0,0 +1,25 @@ +import { defineType, defineField } from 'sanity' + +export default defineType({ + name: 'redirect', + title: 'Redirect', + type: 'document', + description: 'Redirect for next.config.js', + fields: [ + defineField({ + name: 'source', + title: 'Source', + type: 'slug', + }), + defineField({ + name: 'destination', + title: 'Destination', + type: 'slug', + }), + defineField({ + name: 'permanent', + title: 'Permanent', + type: 'boolean', + }), + ], +})