@akinon/projectzero 2.0.0-beta.0 → 2.0.0-beta.10

package/app-template/src/__tests__/middleware-matcher.test.ts

@@ -0,0 +1,135 @@
+import * as fs from 'fs';
+import * as path from 'path';
+
+describe('Middleware matcher regex tests', () => {
+  const middlewareFilePath = path.resolve(__dirname, '../middleware.ts');
+  const middlewareContent = fs.readFileSync(middlewareFilePath, 'utf8');
+
+  let actualMatcherStrings: string[] = [];
+  let matcherPatterns: RegExp[] = [];
+
+  const matcherBlockRegex = middlewareContent.match(/matcher:\s*\[([\s\S]*?)\](?=\s*[,}])/);
+
+  if (matcherBlockRegex && matcherBlockRegex[1]) {
+    const matcherContentInsideBrackets = matcherBlockRegex[1];
+
+    actualMatcherStrings = matcherContentInsideBrackets
+      .split(',')
+      .map(line => {
+        const uncommentedLine = line.replace(/\/\/.*$/, '').trim();
+        const quoteMatch = uncommentedLine.match(/^(['"])(.*)\1$/);
+        return quoteMatch ? quoteMatch[2] : null;
+      })
+      .filter((pattern): pattern is string => pattern !== null && pattern !== '');
+
+    matcherPatterns = matcherContentInsideBrackets
+      .split(',')
+      .map((pattern) => pattern.trim())
+      .filter(Boolean)
+      .map((pattern) => {
+        let cleanPattern = pattern
+          .replace(/^['"]|['"]$/g, '');
+
+        try {
+          if (cleanPattern.includes('(?!') && cleanPattern.includes('api') && cleanPattern.includes('_next')) {
+            cleanPattern = '^(?!/(?:api|_next)/)(?!.*\\.\\w+$).*$';
+          }
+
+          return new RegExp(cleanPattern);
+        } catch (error) {
+          console.error(`Invalid simplified regex: ${cleanPattern}`, error);
+          return null;
+        }
+      })
+      .filter(Boolean) as RegExp[];
+  }
+
+  const testPath = (path: string): boolean => {
+    return matcherPatterns.some((pattern) => {
+      try {
+        const result = pattern.test(path);
+        return result;
+      } catch (error) {
+        console.error(
+          `Error testing path: ${path} | Pattern: ${pattern.toString()}`,
+          error
+        );
+        return false;
+      }
+    });
+  };
+
+  it('should NOT match api routes', () => {
+    const apiPaths = ['/api/products', '/api/auth/login', '/api/v1/users'];
+    apiPaths.forEach((path) => {
+      expect(testPath(path)).toBe(false);
+    });
+  });
+
+  it('should NOT match _next routes', () => {
+    const nextPaths = [
+      '/_next/static/chunks/main.js',
+      '/_next/image',
+      '/_next/data/build-id/products.json'
+    ];
+    nextPaths.forEach((path) => {
+      expect(testPath(path)).toBe(false);
+    });
+  });
+
+  it('should NOT match static files with extensions', () => {
+    const staticFiles = [
+      '/images/logo.png',
+      '/styles/main.css',
+      '/fonts/roboto.woff2',
+      '/favicon.ico',
+      '/manifest.json'
+    ];
+    staticFiles.forEach((path) => {
+      expect(testPath(path)).toBe(false);
+    });
+  });
+
+  it('should match dynamic routes and specific patterns', () => {
+    const validPaths = [
+      '/profile/settings',
+      '/dashboard/stats',
+      '/products/123'
+    ];
+    validPaths.forEach((path) => {
+      expect(testPath(path)).toBe(true);
+    });
+  });
+
+  it('should match checkout-with-token routes', () => {
+    const expectedRegexString = '\'/(.*orders\\\\/checkout-with-token.*)\'';
+    expect(middlewareContent.includes(expectedRegexString)).toBe(true);
+
+    const checkoutPaths = [
+      '/orders/checkout-with-token/123',
+      '/orders/checkout-with-token/abc-xyz',
+      '/orders/checkout-with-token'
+    ];
+    checkoutPaths.forEach((path) => {
+      expect(testPath(path)).toBe(true);
+    });
+  });
+
+  it('should contain the exact specific extensions regex string in the file content', () => {
+    const expectedRegexString = '\'/(.+\\\\.)(html|htm|aspx|asp|php)\'';
+    expect(middlewareContent.includes(expectedRegexString)).toBe(true);
+  });
+
+  it('should include the sitemap pattern specifically within the matcher array', () => {
+    const sitemapPattern = '/(.*sitemap\\\\.xml)';
+    expect(actualMatcherStrings).toContain(sitemapPattern);
+  });
+
+  it('should verify that api pattern is excluded in the matcher configuration', () => {
+    expect(/api/.test(middlewareContent)).toBe(true);
+  });
+
+  it('should verify that _next pattern is excluded in the matcher configuration', () => {
+    expect(/_next/.test(middlewareContent)).toBe(true);
+  });
+});

package/app-template/src/app/[commerce]/[locale]/[currency]/[...prettyurl]/page.tsx

@@ -56,7 +56,8 @@ const resolvePrettyUrlHandler =
     return prettyUrlResult;
   };
 
-export async function generateMetadata({ params }: PageProps) {
+export async function generateMetadata(props: PageProps) {
+  const params = await props.params;
   let result: Metadata = {};
   const { prettyurl } = params;
   const pageSlug = prettyurl
@@ -81,7 +82,7 @@ export async function generateMetadata({ params }: PageProps) {
       ...params,
       pk: prettyUrlResult.pk
     },
-    searchParams
+    searchParams: Promise.resolve(searchParams)
   };
 
   try {
@@ -123,7 +124,8 @@ export async function generateMetadata({ params }: PageProps) {
 export const dynamic = 'force-static';
 export const revalidate = 300;
 
-export default async function Page({ params }) {
+export default async function Page(props) {
+  const params = await props.params;
   const { prettyurl } = params;
   const pageSlug = prettyurl
     .filter((x) => !x.startsWith('searchparams'))
@@ -159,7 +161,7 @@ export default async function Page({ params }) {
       ...params,
       pk: result.pk
     },
-    searchParams: urlSearchParams
+    searchParams: Promise.resolve(urlSearchParams)
   };
 
   if (result.path.startsWith('/category/')) {

package/app-template/src/app/[commerce]/[locale]/[currency]/account/orders/[id]/cancellation/page.tsx

@@ -8,16 +8,17 @@ import {
   useGetOrderQuery,
   useGetCancellationReasonsQuery
 } from '@akinon/next/data/client/account';
-import { AccountOrderCancellation } from '@akinon/next/types';
+import type { AccountOrderCancellation } from '@akinon/next/types';
 import {
   Button,
   Checkbox,
   Select,
   Modal,
   LoaderSpinner,
-  Link
+  Link,
+  FileInput
 } from '@theme/components';
-import { useState } from 'react';
+import { useState, use } from 'react';
 import { OrderDetailHeader } from '@theme/views/account/orders/order-detail-header';
 import { OrderCancellationItem } from '@theme/views/account/orders/order-cancellation-item';
 import { useLocalization } from '@akinon/next/hooks';
@@ -27,6 +28,8 @@ const accountOrderCancellationSchema = yup.object().shape({
 });
 
 const AccountOrderCancellation = ({ params }) => {
+  const pageParams = use(params) as { id: string };
+
   const { t } = useLocalization();
   const {
     register,
@@ -39,6 +42,7 @@ const AccountOrderCancellation = ({ params }) => {
   } = useForm<AccountOrderCancellation>({
     resolver: yupResolver(accountOrderCancellationSchema)
   });
+
   const { data: cancellationReasons, isSuccess: cancellationReasonsSuccess } =
     useGetCancellationReasonsQuery();
 
@@ -46,7 +50,7 @@ const AccountOrderCancellation = ({ params }) => {
     data: order,
     isLoading,
     isSuccess: orderSuccess
-  } = useGetOrderQuery(params.id);
+  } = useGetOrderQuery(pageParams.id);
 
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [responseMessage, setResponseMessage] = useState({
@@ -56,6 +60,9 @@ const AccountOrderCancellation = ({ params }) => {
   const watchAllFields = watch();
   const cancelItemsLength = watchAllFields?.cancel_order_items?.length;
   const [cancelOrder] = useCancelOrderMutation();
+  const [files, setFiles] = useState<
+    { itemId: string; image: string; description: string }[]
+  >([]);
 
   const modalHandleClick = () => {
     setIsModalOpen(false);
@@ -112,8 +119,68 @@ const AccountOrderCancellation = ({ params }) => {
     ]);
   };
 
+  const handleFileChange = async (
+    e: React.ChangeEvent<HTMLInputElement>,
+    itemId: string,
+    description: string
+  ) => {
+    const selectedFiles = Array.from(e.target.files || []);
+
+    const base64Files = await Promise.all(
+      selectedFiles.map((file) => {
+        return new Promise<string>((resolve, reject) => {
+          const reader = new FileReader();
+          reader.onload = () => resolve(reader.result as string);
+          reader.onerror = reject;
+          reader.readAsDataURL(file);
+        });
+      })
+    );
+
+    const validFiles = base64Files.filter((file) =>
+      /^data:image\/(jpeg|png|jpg);base64,.+/.test(file)
+    );
+
+    const formattedFiles = validFiles.map((file) => ({
+      itemId,
+      image: file,
+      description
+    }));
+
+    setFiles((prevFiles) => [
+      ...prevFiles.filter((f) => f.itemId !== itemId),
+      ...formattedFiles
+    ]);
+  };
+
+  const fileInputCondition = (item, description: string) => {
+    if (item.is_refundable && !item.active_cancellation_request) {
+      return (
+        <FileInput
+          name="files"
+          title="files"
+          multiple
+          onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+            handleFileChange(e, item.id, description)
+          }
+        />
+      );
+    }
+  };
+
   const onSubmit: SubmitHandler<AccountOrderCancellation> = (orderItems) => {
-    cancelOrder({ id: order.number, ...orderItems })
+    const mergedData = {
+      ...orderItems,
+      cancel_order_items: orderItems.cancel_order_items.map((orderItem) => ({
+        ...orderItem,
+        ...(files.length > 0 && {
+          cancellation_request_image_set: files.filter(
+            (file) => file.itemId === orderItem.order_item
+          )
+        })
+      }))
+    };
+    cancelOrder({ id: order.number, ...mergedData })
       .unwrap()
       .then(() => {
         setResponseMessage({
@@ -122,10 +189,33 @@ const AccountOrderCancellation = ({ params }) => {
         });
         setIsModalOpen(true);
       })
-      .catch(() => {
+      .catch((err) => {
+        console.error('Err', err);
+
+        const errorMessages = new Set();
+
+        if (err?.data?.cancel_order_items) {
+          err.data.cancel_order_items.forEach((item) => {
+            if (item.cancellation_request_image_set) {
+              item.cancellation_request_image_set.forEach((error) => {
+                if (typeof error === 'string') {
+                  errorMessages.add(error);
+                } else if (typeof error === 'object' && error?.image) {
+                  error.image.forEach((msg) => errorMessages.add(msg));
+                }
+              });
+            }
+          });
+        }
+
+        const errorContent =
+          errorMessages.size > 0
+            ? Array.from(errorMessages).join('\n')
+            : t('account.my_orders.return.error.description').toString();
+
         setResponseMessage({
           title: t('account.my_orders.return.error.title').toString(),
-          content: t('account.my_orders.return.error.description').toString()
+          content: errorContent
         });
         setIsModalOpen(true);
       });
@@ -180,6 +270,7 @@ const AccountOrderCancellation = ({ params }) => {
                         onChange={onChange}
                         value={value}
                         selectOption={selectOption}
+                        fileInput={fileInputCondition(item, item.product.name)}
                       />
                     );
                   }}

package/app-template/src/app/[commerce]/[locale]/[currency]/account/orders/[id]/page.tsx

@@ -5,7 +5,7 @@ import { Image } from '@akinon/next/components/image';
 import clsx from 'clsx';
 import { SalesContractModal } from '@theme/views/sales-contract-modal';
 import { useGetOrderQuery } from '@akinon/next/data/client/account';
-import { useEffect, useState } from 'react';
+import { useEffect, useState, use } from 'react';
 
 import { OrderDetailHeader } from '@theme/views/account/orders/order-detail-header';
 import { ROUTES } from '@theme/routes';
@@ -13,7 +13,9 @@ import { useLocalization } from '@akinon/next/hooks';
 import settings from 'settings';
 import { getOrderStatus } from 'utils';
 
-const AccountOrderDetail = ({ params: { id } }) => {
+const AccountOrderDetail = ({ params }) => {
+  const pageParams = use(params) as { id: string };
+
   const { locale, t } = useLocalization();
 
   const localeValue = settings.localization.locales.find(
@@ -25,7 +27,7 @@ const AccountOrderDetail = ({ params: { id } }) => {
     isLoading,
     isSuccess,
     isFetching
-  } = useGetOrderQuery(id);
+  } = useGetOrderQuery(pageParams.id);
   const [orderDate, setOrderDate] = useState('');
 
   const groupedOrder = [];
@@ -142,7 +144,7 @@ const AccountOrderDetail = ({ params: { id } }) => {
                       key={index}
                     >
                       <div className="flex gap-3 mb-5 lg:mb-0">
-                        <div className="flex-shrink-0">
+                        <div className="shrink-0">
                           <Link
                             className="block"
                             href={item.product.absolute_url}
@@ -206,8 +208,7 @@ const AccountOrderDetail = ({ params: { id } }) => {
                           </div>
 
                           {(item.is_cancellable || item.is_refundable) &&
-                            order.is_cancellable &&
-                            item.status.value == '400' && (
+                            order.is_cancellable && (
                               <div className="lg:ml-24">
                                 <Link
                                   href={`${ROUTES.ACCOUNT_ORDERS}/${order.id}/cancellation`}
@@ -225,7 +226,6 @@ const AccountOrderDetail = ({ params: { id } }) => {
                               </div>
                             )}
                         </div>
-
                         <div className="flex flex-col justify-center items-end lg:ml-6 lg:min-w-[7rem]">
                           {parseFloat(item.retail_price) >
                             parseFloat(item.price) && (
@@ -249,6 +249,70 @@ const AccountOrderDetail = ({ params: { id } }) => {
                   );
                 })}
               </div>
+
+              {group.map((item) =>
+                item.cancellationrequest_set?.map((cancellationItem) => {
+                  const status = cancellationItem.status?.value;
+                  const isRejected = status === 'rejected';
+                  const isCompleted = status === 'completed';
+
+                  const filteredImages =
+                    cancellationItem.cancellation_request_image_set?.filter(
+                      (img) =>
+                        isRejected
+                          ? !img.is_uploaded_by_user
+                          : isCompleted
+                          ? img.is_uploaded_by_user
+                          : false
+                    ) || [];
+
+                  const statusText = isRejected
+                    ? t('account.my_orders.return.rejected')
+                    : isCompleted
+                    ? t('account.my_orders.return.completed')
+                    : null;
+
+                  if (!statusText || filteredImages.length === 0) return null;
+
+                  return (
+                    <div
+                      className="w-full px-4 lg:px-7"
+                      key={cancellationItem.id}
+                    >
+                      <div className="flex flex-col py-2 gap-4 border-t border-gray">
+                        <div className="flex flex-col">
+                          <div className="text-sm font-semibold">
+                            {t('account.my_orders.return.return_status')}
+                            <span className="font-normal"> {statusText}</span>
+                          </div>
+
+                          <div className="flex gap-2 mt-2 flex-wrap">
+                            {filteredImages.map((img) => (
+                              <div className="flex flex-col gap-2" key={img.id}>
+                                <Link href={img.image} target="_blank">
+                                  <Image
+                                    src={img.image}
+                                    width={112}
+                                    height={150}
+                                    alt={img.description}
+                                  />
+                                </Link>
+
+                                {img.description && (
+                                  <p className="text-xs">
+                                    {t('account.my_orders.return.explanation')}:
+                                    {img.description}
+                                  </p>
+                                )}
+                              </div>
+                            ))}
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  );
+                })
+              )}
             </div>
           );
         })}

package/app-template/src/app/[commerce]/[locale]/[currency]/account/page.tsx

@@ -53,7 +53,7 @@ export default function Page() {
     <div className="hidden lg:block">
       <div className="bg-gray-150">
         {orderLoading && (
-          <SkeletonWrapper className="w-full px-6 mb-12 h-28 items-center justify-center !flex-row xl:h-[5.5rem]">
+          <SkeletonWrapper className="w-full px-6 mb-12 h-28 items-center justify-center flex-row! xl:h-[5.5rem]">
             <Skeleton className="w-[11.375rem] h-16 mr-4 xl:w-[16rem] xl:h-10" />
             <Skeleton className="w-56 h-10 mr-4" />
             <Skeleton className="w-[12.75rem] h-10 xl:w-56" />

package/app-template/src/app/[commerce]/[locale]/[currency]/account/profile/page.tsx

@@ -252,7 +252,7 @@ export default function Page() {
             <Input
               label={t('account.my_profile.form.phone.placeholder')}
               type="tel"
-              format={user_phone_format.replace(/\9/g, '#')}
+              format={user_phone_format.replace(/9/g, '#')}
               mask="_"
               allowEmptyFormatting={true}
               control={control}

package/app-template/src/app/[commerce]/[locale]/[currency]/address/stores/page.tsx

@@ -122,7 +122,7 @@ export default function Stores() {
 
       <div className="flex gap-6 mt-4 flex-col md:flex-row">
         {city && (
-          <div className="w-full flex-shrink-0 md:w-60 overflow-y-scroll max-h-[36rem]">
+          <div className="w-full shrink-0 md:w-60 overflow-y-scroll max-h-[36rem]">
             {cityLoading && (
               <SkeletonWrapper>
                 <Skeleton className="w-full h-20" />
@@ -174,7 +174,7 @@ export default function Stores() {
                           title={store.name}
                           titleClassName="text-xs font-bold"
                           iconSize={12}
-                          className="relative py-3 border-b justify-center mb-0"
+                          className="relative py-3 border-b border-gray-200 justify-center mb-0"
                         >
                           <div className="text-xs">
                             {store.address && (

package/app-template/src/app/[commerce]/[locale]/[currency]/auth/page.tsx

@@ -51,7 +51,7 @@ export default function Auth() {
           {t('auth.register.mobile_title')}
         </Button>
       </div>
-      <div className="w-full flex flex-wrap border md:border-0">
+      <div className="w-full flex flex-wrap border border-gray-200 md:border-0">
         <div
           className={twMerge(
             clsx('w-full md:block md:w-1/2', {

package/app-template/src/app/[commerce]/[locale]/[currency]/basket/page.tsx

@@ -25,7 +25,7 @@ export default function Page() {
   }, [basket, isSuccess]);
 
   return (
-    <div className="max-w-screen-xl p-4 flex flex-col text-primary-800 lg:p-8 xl:flex-row xl:mx-auto">
+    <div className="max-w-(--breakpoint-xl) p-4 flex flex-col text-primary-800 lg:p-8 xl:flex-row xl:mx-auto">
       {isLoading && (
         <div className="flex justify-center w-full">
           <LoaderSpinner />
@@ -62,7 +62,7 @@ export default function Page() {
             <Summary basket={basket} />
           </>
         ) : (
-          <div className="flex flex-col items-center container max-w-screen-sm py-4 px-4 xs:py-6 xs:px-6 sm:py-8 sm:px-8 lg:max-w-screen-xl">
+          <div className="flex flex-col items-center container max-w-(--breakpoint-sm) py-4 px-4 xs:py-6 xs:px-6 sm:py-8 sm:px-8 lg:max-w-(--breakpoint-xl)">
             <h1
               className="w-full text-xl font-light text-secondary text-center sm:text-2xl"
               data-testid="basket-empty"

package/app-template/src/app/[commerce]/[locale]/[currency]/category/[pk]/page.tsx

@@ -3,7 +3,10 @@ import { withSegmentDefaults } from '@akinon/next/hocs/server';
 import { PageProps } from '@akinon/next/types';
 import CategoryLayout from '@theme/views/category/layout';
 
-async function Page({ params, searchParams }: PageProps<{ pk: number }>) {
+async function Page(props: PageProps<{ pk: number }>) {
+  const params = await props.params;
+  const searchParams = await props.searchParams;
+
   const { data, breadcrumbData } = await getCategoryData({
     pk: params.pk,
     searchParams

package/app-template/src/app/[commerce]/[locale]/[currency]/error.tsx

@@ -1,20 +1,17 @@
 'use client';
 
-import { useLocalization } from '@akinon/next/hooks';
-import { Link } from '@theme/components';
-import { ROUTES } from '@theme/routes';
+import { useSentryUncaughtErrors } from '@akinon/next/hooks';
+import PzErrorPage from '@akinon/next/views/error-page';
 
-export default function Error() {
-  const { t } = useLocalization();
+export default function ErrorPage({
+  error,
+  reset
+}: {
+  error: Error & { digest?: string; isServerError?: boolean };
+  reset: () => void;
+}) {
+  // DO NOT REMOVE THIS LINE TO REPORT UNCAUGHT ERRORS TO SENTRY
+  useSentryUncaughtErrors(error);
 
-  return (
-    <section className="text-center px-6 my-14 md:px-0 md:m-14">
-      <div className="text-7xl font-bold md:text-8xl">500</div>
-      <h1 className="text-lg md:text-xl"> {t('common.page_500.title')} </h1>
-      <p className="text-lg md:text-xl"> {t('common.page_500.description')} </p>
-      <Link href={ROUTES.HOME} className="text-lg underline">
-        {t('common.page_500.link_text')}
-      </Link>
-    </section>
-  );
+  return <PzErrorPage error={error} reset={reset} />;
 }

package/app-template/src/app/[commerce]/[locale]/[currency]/flat-page/[pk]/page.tsx

@@ -2,7 +2,9 @@ import { getFlatPageData } from '@akinon/next/data/server';
 import { withSegmentDefaults } from '@akinon/next/hocs/server';
 import { PageProps } from '@akinon/next/types';
 
-async function Page({ params }: PageProps<{ pk: number }>) {
+async function Page(props: PageProps<{ pk: number }>) {
+  const params = await props.params;
+
   const data = await getFlatPageData({ pk: params.pk });
 
   return (

package/app-template/src/app/[commerce]/[locale]/[currency]/forms/[pk]/generate/page.tsx

@@ -2,7 +2,9 @@ import { getFormData } from '@akinon/next/data/server';
 import { t } from '@akinon/next/utils/server-translation';
 import { GenerateFormFields } from '@theme/components/generate-form-fields';
 
-export default async function Page({ params }) {
+export default async function Page(props) {
+  const params = await props.params;
+
   const data = await getFormData({ pk: params.pk });
   const { schema, is_active, name, pk } = data;
 
@@ -19,7 +21,7 @@ export default async function Page({ params }) {
         schema={schema}
         allFieldClasses={{
           className:
-            'border border-[#d4d4d4] text-[#4a4f54] mt-1.5 h-[38px] p-2.5 text-xs outline-none focus:border-black',
+            'border border-[#d4d4d4] text-[#4a4f54] mt-1.5 h-[38px] p-2.5 text-xs outline-hidden focus:border-black',
           labelClassName: 'text-[#4a4f54] text-xs',
           wrapperClassName: 'flex flex-col mb-6'
         }}
@@ -39,7 +41,7 @@ export default async function Page({ params }) {
         formProperties={{
           actionUrl: `/api/form/${pk}/`,
           className:
-            'w-[calc(100%-36px)] md:w-[570px] px-[18px] py-[60px] md:p-[100px] border border-[#cbc8c8] border-t-[3px] border-t-[#e95151] mx-auto -mt-[100px] bg-white mb-14',
+            'w-[calc(100%-36px)] md:w-[570px] px-[18px] py-[60px] md:p-[100px] border border-[#cbc8c8] border-t-[3px] border-t-[#e95151] mx-auto -mt-[100px] bg-white mb-14'
         }}
         submitButtonText={t('form.form_page.submit_button_text')}
       />

package/app-template/src/app/[commerce]/[locale]/[currency]/group-product/[pk]/page.tsx

@@ -5,11 +5,10 @@ import { withSegmentDefaults } from '@akinon/next/hocs/server';
 import { PageProps, Metadata } from '@akinon/next/types';
 import { generateJsonLd } from '@theme/utils/generate-jsonld';
 
-export async function generateMetadata({
-  params,
-  searchParams
-}: PageProps<{ pk: number }>) {
+export async function generateMetadata(props: PageProps): Promise<Metadata> {
   let result: Metadata = {};
+  const searchParams = await props.searchParams;
+  const params = await props.params;
 
   try {
     const {
@@ -41,7 +40,10 @@ export async function generateMetadata({
   return result;
 }
 
-async function Page({ params, searchParams }: PageProps<{ pk: number }>) {
+async function Page(props: PageProps<{ pk: number }>) {
+  const params = await props.params;
+  const searchParams = await props.searchParams;
+
   const [{ data, breadcrumbData }, deliveryReturn] = await Promise.all([
     getProductData({
       pk: params.pk,

package/app-template/src/app/[commerce]/[locale]/[currency]/landing-page/[pk]/page.tsx

@@ -2,7 +2,9 @@ import { getLandingPageData } from '@akinon/next/data/server';
 import { withSegmentDefaults } from '@akinon/next/hocs/server';
 import { PageProps } from '@akinon/next/types';
 
-async function Page({ params }: PageProps<{ pk: number }>) {
+async function Page(props: PageProps<{ pk: number }>) {
+  const params = await props.params;
+
   const data = await getLandingPageData({ pk: params.pk });
 
   const content = data.landing_page;