categories

FormidableLabs · Dec 12, 2023 · 133cc62 · 133cc62
1 parent b38f223
commit 133cc62
Show file tree

Hide file tree

Showing 8 changed files with 23 additions and 43 deletions.
diff --git a/packages/nextjs/app/about/page.tsx b/packages/nextjs/app/about/page.tsx
@@ -12,7 +12,7 @@ const DIAGRAM_HEIGHT = DIAGRAM_WIDTH / 1.86;
 const FASTLY_WIDTH = 700.0;
 const FASTLY_HEIGHT = FASTLY_WIDTH / 2.93;
 
-export const metaData: Metadata = {
+export const metadata: Metadata = {
   title: "About",
   description: "About the Formidable Boulangerie project.",
 };

diff --git a/packages/nextjs/app/categories/page.tsx b/packages/nextjs/app/categories/page.tsx
@@ -1,5 +1,7 @@
-import CategoriesPage from "app/migration/categories";
+import { Breadcrumbs } from "components/Breadcrumbs";
+import { CategoryList } from "components/CategoryList";
 import { Metadata } from "next";
+import { WeDontSellBreadBanner } from "../ui/shared-ui";
 import { getAllCategories } from "utils/getAllCategoriesQuery";
 import { isString, pluralize } from "utils/pluralize";
 
@@ -25,5 +27,16 @@ export async function generateMetadata(): Promise<Metadata> {
 export default async function Page() {
   const data = await getData();
 
-  return <CategoriesPage {...data} />;
+  return (
+    <div>
+      <WeDontSellBreadBanner />
+      <div className="container py-9 text-primary flex flex-col gap-9">
+        <h1 className="text-h1">Categories</h1>
+        <div className="my-2">
+          <Breadcrumbs />
+        </div>
+        <CategoryList items={data.categories} />
+      </div>
+    </div>
+  );
 }
diff --git a/packages/nextjs/components/Card.tsx → packages/nextjs/app/components/Card.tsx b/packages/nextjs/components/Card.tsx → packages/nextjs/app/components/Card.tsx
@@ -1,8 +1,8 @@
 import * as React from "react";
 import { SanityImageSource } from "@sanity/image-url/lib/types/types";
 import Link, { LinkProps } from "next/link";
-import { Image } from "./Image";
-import { Card as BaseCard } from "shared-ui";
+import { Image } from "../../components/Image";
+import { Card as BaseCard } from "../ui/shared-ui";
 
 export interface CardProps {
   title: string;

diff --git a/packages/nextjs/app/migration/categories.tsx b/packages/nextjs/app/migration/categories.tsx
diff --git a/packages/nextjs/app/migration/products/[slug].tsx b/packages/nextjs/app/migration/products/[slug].tsx
@@ -9,7 +9,6 @@ import { H6, FadeInOut, BlockContent, Price, QuantityInput, useCart } from "shar
 import { getRecommendations } from "utils/getRecommendationsQuery";
 
 import { ImageCarousel } from "components/ImageCarousel";
-import { PageHead } from "components/PageHead";
 import { StyleOptions } from "components/ProductPage/StyleOptions";
 import { ProductVariantSelector } from "components/ProductPage/ProductVariantSelector";
 import { Product } from "components/Product";
@@ -34,7 +33,6 @@ const ProductPage: NextPage<PageProps> = ({ data }) => {
 
   return (
     <React.Fragment>
-      <PageHead title={product?.name || "Product details"} description={`Product details page for ${product?.name}.`} />
       <div className="container my-4">
         <Breadcrumbs />
       </div>
@@ -110,9 +108,7 @@ const PageBody = ({ variant, product }: { product?: ProductDetail; variant?: Pro
     <div className="container">
       <div className="grid md:grid-cols-2 gap-6">
         <div className="md:row-span-2 order-2 md:order-1">
-          {variant?.images && (
-            <ImageCarousel sizes="(max-width: 768px) 100vw, 50vw" imagePriority productImages={variant?.images} />
-          )}
+          {variant?.images && <ImageCarousel sizes="(max-width: 768px) 100vw, 50vw" productImages={variant?.images} />}
         </div>
         <div className="text-primary order-1 md:order-2 self-end">
           <h4 className="text-h4 font-medium mb-2">{product?.name}</h4>

diff --git a/packages/nextjs/components/CategoryList.tsx b/packages/nextjs/components/CategoryList.tsx
@@ -1,5 +1,5 @@
 import type { GetCategoriesQuery, GetProductsAndCategoriesQuery } from "utils/groqTypes/ProductList";
-import { Card } from "components/Card";
+import { Card } from "app/components/Card";
 
 type CategoryListProps = {
   items?: GetCategoriesQuery["categories"] | GetProductsAndCategoriesQuery["categories"];

diff --git a/packages/nextjs/components/FeaturedList.tsx b/packages/nextjs/components/FeaturedList.tsx
@@ -1,7 +1,7 @@
 import type { Categories, Products } from "utils/groqTypes/ProductList";
 import * as React from "react";
 import classNames from "classnames";
-import { Card, CardProps } from "components/Card";
+import { Card, CardProps } from "app/components/Card";
 
 type Props = {
   items?: Products | Categories;

diff --git a/packages/nextjs/components/Image.tsx b/packages/nextjs/components/Image.tsx
@@ -1,3 +1,5 @@
+"use client";
+
 import type { ImageProps, ImageLoaderProps } from "next/image";
 import * as React from "react";
 import { SanityImageSource } from "@sanity/image-url/lib/types/types";