From 177ab898842cbb3756c63acb8706f9feb7646166 Mon Sep 17 00:00:00 2001 From: paolosantarsiero Date: Wed, 15 Jan 2025 16:29:46 +0100 Subject: [PATCH] fix: order layout --- app/collection/[name]/page.tsx | 16 --------- app/collection/[slug]/page.tsx | 25 ++++++++++++++ app/page.tsx | 3 -- app/product/[name]/page.tsx | 23 +++++++------ app/profile/@user/orders/page.tsx | 55 ++++++++++++------------------ components/layout/footer.tsx | 2 +- components/layout/navbar/index.tsx | 2 +- lib/utils.ts | 6 ++++ 8 files changed, 67 insertions(+), 65 deletions(-) delete mode 100644 app/collection/[name]/page.tsx create mode 100644 app/collection/[slug]/page.tsx diff --git a/app/collection/[name]/page.tsx b/app/collection/[name]/page.tsx deleted file mode 100644 index b36a4ffe9..000000000 --- a/app/collection/[name]/page.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { ThreeItemGridItem } from 'components/grid/three-items'; -import { Product } from 'lib/woocomerce/models/product'; -import { woocommerce } from 'lib/woocomerce/woocommerce'; - -export default async function ProductPage(props: { params: Promise<{ name: string }> }) { - const params = await props.params; - const products: Product[] = await woocommerce.get('products', { category: params.name }); - - return ( -
- {products.map((product, index) => ( - - ))} -
- ); -} diff --git a/app/collection/[slug]/page.tsx b/app/collection/[slug]/page.tsx new file mode 100644 index 000000000..9f4540ddc --- /dev/null +++ b/app/collection/[slug]/page.tsx @@ -0,0 +1,25 @@ +import { ProductCard } from 'components/product/product-card'; +import { Product } from 'lib/woocomerce/models/product'; +import { woocommerce } from 'lib/woocomerce/woocommerce'; + +export default async function ProductPage(props: { params: Promise<{ slug: string }> }) { + const slug = (await props.params).slug; + const category = (await woocommerce.get('products/categories', { slug }))?.[0]; + const products: Product[] = await woocommerce.get('products', { category: category.id.toString() }); + + return ( +
+
+ {category.name} +
+
+ {category.description} +
+
+ {products.map((product) => ( + + ))} +
+
+ ); +} diff --git a/app/page.tsx b/app/page.tsx index 232d3bfa4..d80bab4f8 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -32,9 +32,6 @@ async function ProductsByCategory() {
{category.name}
-
- {category.description} -
diff --git a/app/product/[name]/page.tsx b/app/product/[name]/page.tsx index 91e84fdc8..25002ec5f 100644 --- a/app/product/[name]/page.tsx +++ b/app/product/[name]/page.tsx @@ -8,6 +8,7 @@ import { ProductDescription } from 'components/product/product-description'; import { VariantSelector } from 'components/product/variant-selector'; import Prose from 'components/prose'; import { HIDDEN_PRODUCT_TAG } from 'lib/constants'; +import { isStrinInteger } from 'lib/utils'; import { Image } from 'lib/woocomerce/models/base'; import { Product, ProductVariations } from 'lib/woocomerce/models/product'; import { woocommerce } from 'lib/woocomerce/woocommerce'; @@ -18,9 +19,12 @@ export async function generateMetadata(props: { params: Promise<{ name: string }>; }): Promise { const params = await props.params; - const product: Product | undefined = ( - await woocommerce.get('products', { slug: params.name }) - )?.[0]; + let product: Product | undefined = undefined; + if (isStrinInteger(params.name)) { + product = await woocommerce.get(`products/${params.name}`); + } else { + product = (await woocommerce.get('products', { slug: params.name }))?.[0]; + } if (!product) return notFound(); @@ -79,9 +83,12 @@ async function RelatedProducts({ product }: { product: Product }) { export default async function ProductPage(props: { params: Promise<{ name: string }> }) { const params = await props.params; - const product: Product | undefined = ( - await woocommerce.get('products', { slug: params.name }) - )?.[0]; + let product: Product | undefined = undefined; + if (isStrinInteger(params.name)) { + product = await woocommerce.get(`products/${params.name}`); + } else { + product = (await woocommerce.get('products', { slug: params.name }))?.[0]; + } let variations: ProductVariations[] = []; if (product?.variations?.length) { variations = await woocommerce.get(`products/${product?.id}/variations`); @@ -89,10 +96,6 @@ export default async function ProductPage(props: { params: Promise<{ name: strin if (!product) return notFound(); - const relatedProducts = await Promise.all( - product.related_ids?.map(async (id) => woocommerce.get(`products/${id}`)) || [] - ); - const productJsonLd = { '@context': 'https://schema.org', '@type': 'Product', diff --git a/app/profile/@user/orders/page.tsx b/app/profile/@user/orders/page.tsx index ef11d4b2d..a58edd0aa 100644 --- a/app/profile/@user/orders/page.tsx +++ b/app/profile/@user/orders/page.tsx @@ -13,28 +13,27 @@ export default async function OrdersPage() {

Orders

{orders.map((order) => ( - -
- - +
+
+
+ ID ORDINE: + {order.id} +
+
+ EFFETTUATO IL: + {new Date(order.date_created).toLocaleDateString()} +
+
+ TOTALE: + {order.total} {order.currency} +
{order.line_items.map((item, i) => (
  • -
    +
    -
    +
    {item.name}
    @@ -56,25 +55,13 @@ export default async function OrdersPage() { currencyCode={order.currency} />
    -
    +
    • ))} -
    - - +
    + Vedi dettagli
    - +
    ))}
    ); diff --git a/components/layout/footer.tsx b/components/layout/footer.tsx index 4de321827..d4090fed0 100644 --- a/components/layout/footer.tsx +++ b/components/layout/footer.tsx @@ -26,7 +26,7 @@ export default async function Footer() { }, ...categories.map((category) => ({ title: category.name, - path: path.join('/collection', category.id.toString()) + path: path.join('/collection', category.slug.toString()) })) ] as Menu[]; const currentYear = new Date().getFullYear(); diff --git a/components/layout/navbar/index.tsx b/components/layout/navbar/index.tsx index 92e187697..2243a6a36 100644 --- a/components/layout/navbar/index.tsx +++ b/components/layout/navbar/index.tsx @@ -25,7 +25,7 @@ export async function Navbar() { }, ...categories.map((category) => ({ title: category.name, - path: path.join('/collection', category.id.toString()) + path: path.join('/collection', category.slug) })) ] as Menu[]; diff --git a/lib/utils.ts b/lib/utils.ts index 33b7cc8f6..35a6d4b63 100644 --- a/lib/utils.ts +++ b/lib/utils.ts @@ -16,3 +16,9 @@ export const getCountries = (): { name: string; icon: string }[] => name: country, icon: flag_base64 })); + +export const isStrinInteger = (value: string) => { + const parsed = parseInt(value, 10); + + return !isNaN(parsed) && parsed.toString() === value.trim(); +}