WIP

frontend/components/footer.js

@@ -1,4 +1,5 @@
-import { Box, Flex, Link, Stack, useColorMode, useColorModeValue } from '@chakra-ui/react'
+import { Link } from '@chakra-ui/next-js'
+import { Box, Flex, Stack, useColorModeValue } from '@chakra-ui/react'
 
 export default function Footer({ siteName }) {
   return (

frontend/package.json

@@ -16,7 +16,6 @@
     "@directus/sdk": "10.3.3",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "framer-motion": "10.12.16",
     "next": "13.4.5",
     "react": "18.2.0",
     "react-dom": "18.2.0"

frontend/pages/[slug]/index.js

@@ -1,17 +1,17 @@
 import directus from '~/lib/directus'
 
-export const getServerSideProps = async () => {
-  const { data: pages } = await directus.items('pages').readByQuery({
-    limit: 1,
-  })
+// export const getServerSideProps = async () => {
+//   const { data: pages } = await directus.items('pages').readByQuery({
+//     limit: 1,
+//   })
 
-  return {
-    paths: pages.map((p) => ({ params: { slug: p.slug } })),
-    fallback: false, // false or "blocking"
-  }
-}
+//   return {
+//     paths: pages.map((p) => ({ params: { slug: p.slug } })),
+//     fallback: false, // false or "blocking"
+//   }
+// }
 
-export const getStaticProps = async ({ params }) => {
+export const getServerSideProps = async ({ params }) => {
   const { slug } = params
 
   const {
@@ -24,6 +24,9 @@ export const getStaticProps = async ({ params }) => {
       },
     },
   })
+
+  if (!page) return { notFound: true }
+
   return { props: { page } }
 }
 

frontend/pages/import/index.js

@@ -151,7 +151,7 @@ async function importVendors() {
   )
 }
 
-export default async function Home() {
+export default function Home() {
   // importCategories()
   // importSubcategories()
   // importCategoryStructure()

frontend/pages/vendors/[slug]/index.js

@@ -1,4 +1,3 @@
-import { notFound } from 'next/navigation'
 import directus from '~/lib/directus'
 
 export const getServerSideProps = async ({ params }) => {
@@ -20,7 +19,7 @@ export const getServerSideProps = async ({ params }) => {
     filter: { slug: { _eq: slug } },
   })
 
-  if (!vendor) return notFound()
+  if (!vendor) return { notFound: true }
 
   return { props: { vendor } }
 }
@@ -79,7 +78,7 @@ export default function VendorPage({ vendor }) {
           <h2>Categories</h2>
           <ul>
             {vendor.categories.map((cat) => (
-              <li>{cat.categories_id.name}</li>
+              <li key={cat.id}>{cat.categories_id.name}</li>
             ))}
           </ul>
         </>