@akinon/projectzero 2.0.0-beta.2 → 2.0.0-beta.20

package/app-template/src/app/{[commerce]/[locale]/[currency] → [pz]}/orders/checkout/page.tsx

@@ -11,7 +11,7 @@ import {
 } from '@akinon/next/redux/reducers/checkout';
 import { RootState } from '@theme/redux/store';
 import { ROUTES } from '@theme/routes';
-import { useFetchCheckoutQuery } from '@akinon/next/data/client/checkout';
+import { useFetchCheckoutQuery, useResetCheckoutStateQuery } from '@akinon/next/data/client/checkout';
 import { Button, LoaderSpinner } from '@theme/components';
 import { pushAddPaymentInfo, pushAddShippingInfo } from '@theme/utils/gtm';
 import { CheckoutStep } from '@akinon/next/types';
@@ -25,6 +25,8 @@ const Checkout = () => {
     (state: RootState) => state.checkout
   );
 
+  const { data: indexData, isLoading: isResetStateLoading } = useResetCheckoutStateQuery(null);
+
   const {
     data: checkoutData,
     isFetching,
@@ -32,7 +34,8 @@ const Checkout = () => {
     isSuccess,
     refetch: refetchCheckout
   } = useFetchCheckoutQuery(null, {
-    refetchOnMountOrArgChange: true
+    refetchOnMountOrArgChange: true,
+    skip: isResetStateLoading || !indexData
   });
   const initialStepChanged = useRef<boolean>(false);
   const router = useRouter();
@@ -94,10 +97,10 @@ const Checkout = () => {
     );
   }
 
-  if (isFetching || isError) {
+  if (isResetStateLoading || isFetching || isError) {
     return (
       <div className="flex flex-col items-center justify-center h-80">
-        {isFetching ? (
+        {isResetStateLoading || isFetching ? (
           <LoaderSpinner />
         ) : (
           <>

package/app-template/src/app/{[commerce]/[locale]/[currency] → [pz]}/orders/completed/[token]/page.tsx

@@ -1,11 +1,12 @@
 'use client';
 
-import { useEffect, useRef, use } from 'react';
+import { useEffect, useRef } from 'react';
+import { useParams } from 'next/navigation';
 import { useAppDispatch } from '@akinon/next/redux/hooks';
 import { setCurrentStep } from '@akinon/next/redux/reducers/checkout';
 import { ROUTES } from '@theme/routes';
 import { useFetchCheckoutResultQuery } from '@akinon/next/data/client/checkout';
-import { CheckoutStep, PageProps } from '@akinon/next/types';
+import { CheckoutStep } from '@akinon/next/types';
 import { CarouselCore } from '@theme/components/carousel-core';
 import { Price, Button, Icon, LoaderSpinner, Link } from '@theme/components';
 import { CheckoutStepList } from '@theme/views/checkout';
@@ -14,10 +15,11 @@ import { Image } from '@akinon/next/components/image';
 import { Trans } from '@akinon/next/components/trans';
 import { pushPurchaseEvent } from '@theme/utils/gtm';
 
-const CheckoutCompleted = (props) => {
+const CheckoutCompleted = () => {
+  const params = useParams<{ token: string }>();
   const { t } = useLocalization();
   const dispatch = useAppDispatch();
-  const params = use(props.params) as { token: string };
+
   const { data, isLoading } = useFetchCheckoutResultQuery(String(params.token));
 
   const carouselRef = useRef(null);

package/app-template/src/app/[pz]/product/[pk]/page.tsx

@@ -0,0 +1,102 @@
+import { getProductData, getWidgetData } from '@akinon/next/data/server';
+import { withSegmentDefaults } from '@akinon/next/hocs/server';
+import { PageProps, ResolvedPageProps, Metadata } from '@akinon/next/types';
+import { generateJsonLd } from '@theme/utils/generate-jsonld';
+import { AccordionWrapper, ProductInfo } from '@theme/views/product';
+import ProductLayout from '@theme/views/product/layout';
+import { notFound } from 'next/navigation';
+
+export async function generateMetadata(
+  props: PageProps<{ pk: number }>
+) {
+  const params = await props.params;
+  const searchParams = await props.searchParams;
+  let result: Metadata = {};
+
+  try {
+    const { data } = await getProductData({
+      pk: params.pk,
+      searchParams
+    });
+
+    const product = data?.product;
+
+    if (!product) {
+      return {};
+    }
+
+    result = {
+      title: product.name,
+      description: String(product.attributes?.description),
+      twitter: {
+        title: product.name,
+        description: String(product.attributes?.description)
+      },
+      openGraph: {
+        title: product.name,
+        description: String(product.attributes?.description),
+        images: product.productimage_set?.map((item) => ({
+          url: item.image
+        }))
+      }
+    };
+  } catch (error: unknown) {
+    if ((error as Error & { status?: number })?.status === 404) {
+      notFound();
+    }
+    throw error;
+  }
+
+  return result;
+}
+
+async function Page({ params, searchParams }: ResolvedPageProps<{ pk: number }>) {
+  if (params.pk === undefined || isNaN(Number(params.pk))) {
+    notFound();
+  }
+
+  try {
+    const [{ data, breadcrumbData }, deliveryReturn] = await Promise.all([
+      getProductData({
+        pk: params.pk,
+        searchParams
+      }),
+      getWidgetData({ slug: 'product-delivery-returns' })
+    ]);
+
+    const jsonLd = generateJsonLd(data.product);
+
+    return (
+      <>
+        <ProductLayout data={data} breadcrumbData={breadcrumbData}>
+          <div className="flex flex-col items-center">
+            <h1
+              className="mt-4 text-2xl text-center md:mt-0"
+              data-testid="product-name"
+            >
+              {data.product.name}
+            </h1>
+
+            <ProductInfo data={data} />
+
+            <AccordionWrapper
+              data={data}
+              deliveryReturn={deliveryReturn?.attributes}
+            />
+          </div>
+        </ProductLayout>
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
+        />
+      </>
+    );
+  } catch (error: unknown) {
+    if ((error as Error & { status?: number })?.status === 404) {
+      notFound();
+    }
+    throw error;
+  }
+}
+
+export default withSegmentDefaults(Page, { segmentType: 'page' });

package/app-template/src/app/[pz]/special-page/[pk]/page.tsx

@@ -0,0 +1,35 @@
+import { getSpecialPageData } from '@akinon/next/data/server';
+import { withSegmentDefaults } from '@akinon/next/hocs/server';
+import { ResolvedPageProps } from '@akinon/next/types';
+import CategoryLayout from '@theme/views/category/layout';
+import SpecialPageBanner from '@theme/widgets/special-page-banner';
+import SpecialPageCarousel from '@theme/widgets/special-page-carousel';
+import { notFound } from 'next/navigation';
+
+async function Page({ params, searchParams }: ResolvedPageProps<{ pk: number }>) {
+  try {
+    const data = await getSpecialPageData({ pk: params.pk, searchParams });
+
+    return (
+      <>
+        <CategoryLayout data={data}>
+          {data.special_page && (
+            <>
+              <SpecialPageBanner data={data.special_page} />
+              <SpecialPageCarousel
+                slug={data.special_page.video_embedded_code}
+              />
+            </>
+          )}
+        </CategoryLayout>
+      </>
+    );
+  } catch (error: unknown) {
+    if ((error as Error & { status?: number })?.status === 404) {
+      notFound();
+    }
+    throw error;
+  }
+}
+
+export default withSegmentDefaults(Page, { segmentType: 'page' });

package/app-template/src/app/{[commerce]/[locale]/[currency] → [pz]}/users/email-set-primary/[[...id]]/page.tsx

@@ -2,11 +2,10 @@
 import { Icon, Link, LoaderSpinner } from '@theme/components';
 import { useLocalization } from '@akinon/next/hooks';
 import { useChangeEmailVerificationQuery } from '@akinon/next/data/client/user';
-import { use } from 'react';
-
-export default function Page(props) {
-  const { id } = use(props.params) as { id: string[] };
+import { useParams } from 'next/navigation';
 
+export default function Page() {
+  const { id } = useParams<{ id: string[] }>();
   const { t } = useLocalization();
   const { isSuccess, isLoading } = useChangeEmailVerificationQuery(
     id.join('/')

package/app-template/src/app/{[commerce]/[locale]/[currency] → [pz]}/users/registration/account-confirm-email/[[...id]]/page.tsx

@@ -2,10 +2,10 @@
 import { Icon, Link, LoaderSpinner } from '@theme/components';
 import { useLocalization } from '@akinon/next/hooks';
 import { useConfirmEmailVerificationQuery } from '@akinon/next/data/client/user';
-import { use } from 'react';
+import { useParams } from 'next/navigation';
 
-export default function Page(props) {
-  const { id } = use(props.params) as { id: string[] };
+export default function Page() {
+  const { id } = useParams<{ id: string[] }>();
   const { t } = useLocalization();
   const { isSuccess, isLoading } = useConfirmEmailVerificationQuery(
     id.join('/')

package/app-template/src/app/{[commerce]/[locale]/[currency] → [pz]}/users/reset/[[...id]]/page.tsx

@@ -1,22 +1,33 @@
 'use client';
 
-import { Button, Input, Link } from '@theme/components';
+import { Button, Input, Link, LoaderSpinner } from '@theme/components';
 import { useForm, SubmitHandler } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import * as yup from 'yup';
 import {
   usePasswordResetMutation,
+  useGetValidatePasswordResetTokenQuery,
   PasswordResetType
 } from '@akinon/next/data/client/account';
 import { useLocalization } from '@akinon/next/hooks';
+import { useParams } from 'next/navigation';
 import PasswordRulesFeedback from '@theme/components/password-rules-feedback';
-import { use } from 'react';
 
-export default function NewPassword(props) {
-  const { id } = use(props.params) as { id: string };
+export default function NewPassword() {
+  const { id } = useParams<{ id: string[] }>();
   const { t } = useLocalization();
   const [newPassword, { isSuccess: formSuccess }] = usePasswordResetMutation();
 
+  const token = id?.join('/');
+
+  const {
+    data: validationData,
+    isLoading: isValidating,
+    error: validationError
+  } = useGetValidatePasswordResetTokenQuery(token, {
+    skip: !token
+  });
+
   const newPasswordFormSchema = (t) =>
     yup.object().shape({
       password: yup
@@ -46,10 +57,35 @@ export default function NewPassword(props) {
   const passwordValue = watch('password', '');
 
   const onSubmit: SubmitHandler<PasswordResetType> = (data) => {
-    data.slug = id;
+    data.slug = id?.join('/') ?? '';
     newPassword(data);
   };
 
+  if (isValidating) {
+    return (
+      <div className="container my-12 flex flex-col items-center px-4">
+        <div className="w-full xl:w-5/12 text-center">
+          <LoaderSpinner />
+        </div>
+      </div>
+    );
+  }
+
+  if (validationError || !validationData?.validlink) {
+    return (
+      <div className="container my-12 flex flex-col items-center px-4">
+        <div className="w-full xl:w-5/12 text-center">
+          <div className="text-2xl mb-4 text-error">
+            {t('account.password_reset.expired_link_message')}
+          </div>
+          <Link href="/users/password/reset" className="underline text-primary">
+            {t('account.password_reset.continue_password_reset')}
+          </Link>
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className="container my-12 flex flex-col items-center px-4">
       <div className="w-full xl:w-5/12 text-center">

package/app-template/src/app/[pz]/xml-sitemap/[node]/route.ts

@@ -0,0 +1,73 @@
+import { urlLocaleMatcherRegex } from '@akinon/next/utils';
+
+/**
+ * XML Sitemap Route
+ *
+ * This route serves XML sitemaps from an S3 bucket.
+ *
+ * Required environment variables:
+ * - SITEMAP_S3_BUCKET_NAME: The name of the S3 bucket containing the sitemaps
+ *   Example: "0fb534"
+ *
+ * If the environment variable is not set, the route will return a 503 Service Unavailable
+ * response with a JSON error message.
+ */
+
+export const dynamic = 'force-dynamic';
+
+export async function GET(request: Request, context: { params: Promise<{ node: string }> }) {
+  const { node } = await context.params;
+  const url = new URL(request.url);
+  const matchedLocale = url.pathname.match(urlLocaleMatcherRegex);
+
+  const s3BucketName = process.env.SITEMAP_S3_BUCKET_NAME;
+
+  if (!s3BucketName) {
+    return new Response(
+      JSON.stringify({
+        error: 'Configuration error',
+        message: 'Please set the SITEMAP_S3_BUCKET_NAME environment variable'
+      }),
+      {
+        status: 503,
+        headers: {
+          'Content-Type': 'application/json'
+        }
+      }
+    );
+  }
+
+  const sitemap = await fetch(
+    `https://s3.eu-central-1.amazonaws.com/${s3BucketName}/sitemaps/sitemaps/sitemap-${node}.xml.gz`
+  );
+
+  if (!sitemap.ok) {
+    return new Response(
+      JSON.stringify({
+        error: 'Sitemap not found',
+        message: `Failed to fetch sitemap for node: ${node}`
+      }),
+      {
+        status: 503,
+        headers: {
+          'Content-Type': 'application/json'
+        }
+      }
+    );
+  }
+
+  let sitemapContent = await sitemap.text();
+
+  if (matchedLocale?.[0]) {
+    const localeSuffix = matchedLocale[0];
+    const domainRegex = /(?<=<loc>\s*)https?:\/\/[^/<\s]+/g;
+
+    sitemapContent = sitemapContent.replace(domainRegex, `$&${localeSuffix}`);
+  }
+
+  return new Response(sitemapContent, {
+    headers: {
+      'Content-Type': 'application/xml'
+    }
+  });
+}

package/app-template/src/app/api/auth/[...nextauth]/route.ts

@@ -0,0 +1,3 @@
+import { handlers } from 'auth';
+
+export const { GET, POST } = handlers;

package/app-template/src/app/api/barcode-search/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/barcode-search';

package/app-template/src/app/api/form/[...id]/route.ts

@@ -1,7 +1 @@
-import { NextResponse } from 'next/server';
-
-export async function POST() {
-  // TODO: Handle Form Data
-
-  return NextResponse.json({ message: 'ok' });
-}
+export * from '@akinon/next/api/form';

package/app-template/src/app/api/image-proxy/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/image-proxy';

package/app-template/src/app/api/product-categories/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/product-categories';

package/app-template/src/app/api/similar-product-list/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/similar-product-list';

package/app-template/src/app/api/similar-products/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/similar-products';

package/app-template/src/app/api/theme-settings/route.ts

@@ -0,0 +1,12 @@
+import { NextResponse } from 'next/server';
+import { getThemeSettings } from '@theme/data/server/theme';
+
+export async function GET() {
+  try {
+    const settings = await getThemeSettings();
+    return NextResponse.json(settings);
+  } catch (error) {
+    console.error('Error in theme-settings API:', error);
+    return NextResponse.json({}, { status: 500 });
+  }
+}

package/app-template/src/app/api/virtual-try-on/limited-categories/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/virtual-try-on';

package/app-template/src/app/api/virtual-try-on/route.ts

@@ -0,0 +1 @@
+export * from '@akinon/next/api/virtual-try-on';