diff --git a/components/layout/dynamic-content-manager/dynamic-content-manager.tsx b/components/layout/dynamic-content-manager/dynamic-content-manager.tsx index 78148f90c..ffa2edf3e 100644 --- a/components/layout/dynamic-content-manager/dynamic-content-manager.tsx +++ b/components/layout/dynamic-content-manager/dynamic-content-manager.tsx @@ -4,22 +4,18 @@ import { Info } from 'lucide-react'; import dynamic from 'next/dynamic'; import Hero from 'components/modules/hero'; -const USPSection = dynamic(() => import('components/ui/usp-section')); +const USPSection = dynamic(() => import('components/modules/usp-section')); const Slider = dynamic(() => import('components/modules/slider')); const BlurbSection = dynamic(() => import('components/modules/blurb-section')); const FilteredProductList = dynamic(() => import('components/modules/filtered-product-list')); - interface getContentComponentProps { _type: string; _key: number; disabled: boolean; } - - const getContentComponent = ({ _type, _key, disabled, ...rest }: getContentComponentProps) => { let Component: any; - console.log('type', _type) switch (_type) { case 'hero': Component = Hero; diff --git a/components/modules/reusable-section/index.tsx b/components/modules/reusable-section/index.tsx new file mode 100644 index 000000000..7c2c134f3 --- /dev/null +++ b/components/modules/reusable-section/index.tsx @@ -0,0 +1 @@ +export { default } from './reusable-section'; diff --git a/components/modules/reusable-section/reusable-section.tsx b/components/modules/reusable-section/reusable-section.tsx new file mode 100644 index 000000000..1709bbcfb --- /dev/null +++ b/components/modules/reusable-section/reusable-section.tsx @@ -0,0 +1,20 @@ +'use client' + +interface ReusableSectionProps { + section: any +} + +const ReusableSection = ({ section }: ReusableSectionProps) => { + console.log(section) + + return ( +
+
+ Reusable section +
+ +
+ ) +} + +export default ReusableSection \ No newline at end of file diff --git a/components/ui/usp-section/index.ts b/components/modules/usp-section/index.ts similarity index 100% rename from components/ui/usp-section/index.ts rename to components/modules/usp-section/index.ts diff --git a/components/modules/usp-section/usp-section.tsx b/components/modules/usp-section/usp-section.tsx new file mode 100644 index 000000000..28955c04a --- /dev/null +++ b/components/modules/usp-section/usp-section.tsx @@ -0,0 +1,46 @@ +'use client' + +import SanityImage from '../../ui/sanity-image'; + +interface USPSectionProps { + usps: [] | any +} + +const USPSection = ({ usps }: USPSectionProps) => { + const desktopGridLayout = usps.length === 4 ? 'lg:grid-cols-4' : 'lg:grid-cols-3'; + + return ( +
+
+ {usps.map((usp: any, index: number) => ( +
+
+ +
+

{usp.title}

+ {usp.text && ( +

+ {usp.text} +

+ )} +
+ ))} +
+ +
+ ) +} + +export default USPSection \ No newline at end of file diff --git a/components/ui/usp-section/usp-section.tsx b/components/ui/usp-section/usp-section.tsx deleted file mode 100644 index 3b05f41c4..000000000 --- a/components/ui/usp-section/usp-section.tsx +++ /dev/null @@ -1,44 +0,0 @@ -'use client' - -import SanityImage from '../sanity-image' - -interface USPSectionProps { - usps: any - title: string - mobileLayout: string - desktopLayout: string - imageFormat: 'square' | 'portrait' | 'landscape' -} - -const USPSection = ({ usps }: USPSectionProps) => { - const desktopGridLayout = `lg:grid-cols-${usps.length}` - return ( -
- {usps.map((usp: any, index: number) => ( -
-
- -
-

{usp.title}

-

- {usp.text} -

-
- ))} -
- ) -} - -export default USPSection \ No newline at end of file diff --git a/lib/sanity/queries.tsx b/lib/sanity/queries.tsx index 0effaac3e..269546a32 100644 --- a/lib/sanity/queries.tsx +++ b/lib/sanity/queries.tsx @@ -142,6 +142,14 @@ export const modules = ` }, } ` +export const reusableSection = ` + _type == 'reusableSection' => { + disabled, + _type, + _key, + title + } +` // Homepage query export const homePageQuery = `*[_type == "home" && slug.current == "/" && language == $locale][0] { @@ -155,7 +163,8 @@ export const homePageQuery = `*[_type == "home" && slug.current == "/" && langua "locale": language }, content[] { - ${modules} + ${modules}, + ${reusableSection} }, seo { ${seoFields}