@akinon/projectzero 1.34.0-rc.8 → 1.34.0

package/CHANGELOG.md

@@ -1,10 +1,11 @@
 # @akinon/projectzero
 
-## 1.34.0-rc.8
+## 1.34.0
 
-## 1.34.0-rc.7
+### Minor Changes
 
-## 1.34.0-rc.6
+- cd78ddc: ZERO-2661: rename .npmignore to .gitignore during project creation
+- 735f4f0: ZERO-2661: create .npmignore in app-template
 
 ## 1.33.2
 

package/app-template/.eslintrc.js

@@ -0,0 +1,31 @@
+module.exports = {
+  env: {
+    browser: true,
+    es6: true,
+    node: true,
+    jest: true
+  },
+  extends: [
+    'next/core-web-vitals',
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'prettier',
+    'plugin:@akinon/projectzero/core', // DO NOT remove this config for stability
+    'plugin:@akinon/projectzero/recommended' // Optional
+  ],
+  plugins: ['@typescript-eslint', '@akinon/projectzero'],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 2021,
+    sourceType: 'module'
+  },
+  settings: {
+    next: {
+      rootDir: ['src/*/']
+    }
+  },
+  rules: {
+    '@typescript-eslint/no-unused-vars': 'warn',
+    '@typescript-eslint/no-explicit-any': 'warn'
+  }
+};

package/app-template/.gitignore

@@ -0,0 +1,64 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+.next/
+out/
+
+# production
+**/build/**
+**/dist/**
+
+# misc
+.DS_Store
+*.pem
+*.tsbuildinfo
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+.env
+
+# vercel
+.vercel
+
+.idea
+
+# do not track .vscode folder except some files
+.vscode/*
+!.vscode/extensions.json
+!.vscode/launch.json
+
+# turbo
+.turbo
+
+# cypress artifacts
+cypress/videos/*
+cypress/screenshots/*
+
+# pwa
+public/sw.js
+public/workbox-*.js
+public/worker-*.js
+public/sw.js.map
+public/workbox-*.js.map
+public/worker-*.js.map
+
+# Sentry
+.sentryclirc
+next.config.original.js
+next.config.wizardcopy.js

package/app-template/CHANGELOG.md

@@ -1,77 +1,16 @@
 # projectzeronext
 
-## 1.34.0-rc.8
-
-### Minor Changes
-
-- 91265bb: ZERO-2551: Improve pretty url and caching performance
-
-### Patch Changes
-
-- Updated dependencies [91265bb]
-  - @akinon/next@1.34.0-rc.8
-  - @akinon/pz-b2b@1.34.0-rc.8
-  - @akinon/pz-gpay@1.34.0-rc.8
-  - @akinon/pz-masterpass@1.34.0-rc.8
-  - @akinon/pz-one-click-checkout@1.34.0-rc.8
-  - @akinon/pz-otp@1.34.0-rc.8
-  - @akinon/pz-pay-on-delivery@1.34.0-rc.8
-
-## 1.34.0-rc.7
-
-### Minor Changes
-
-- 0d0f36c: ZERO-2598: Fix eslint warnings and update dependencies
+## 1.34.0
 
 ### Patch Changes
 
-- @akinon/next@1.34.0-rc.7
-- @akinon/pz-b2b@1.34.0-rc.7
-- @akinon/pz-gpay@1.34.0-rc.7
-- @akinon/pz-masterpass@1.34.0-rc.7
-- @akinon/pz-one-click-checkout@1.34.0-rc.7
-- @akinon/pz-otp@1.34.0-rc.7
-- @akinon/pz-pay-on-delivery@1.34.0-rc.7
-
-## 1.34.0-rc.6
-
-### Minor Changes
-
-- 567e4c1: ZERO-2580:Add checked attribute from props to checkbox
-- d09b677: ZERO-2577: Fix pagination bug and update usePagination hook and ensure pagination controls rendering correctly
-- 27a5296: ZERO-2631:Fix Checkbox Click
-- ebb63ce: ZERO-2525: Fix category facet removal bug and add close icon to active filters
-- f0c23bc: ZERO-2135: add custom not found page
-- 3420416: ZERO-2533: extend eslint config from @akinon/next
-- 6c18543: ZERO-2542:Refactor and show error in OneClickCheckoutButtons
-- 202f84e: ZERO-2569: Fix static keys
-- f046f8e: ZERO-2575: update version for react-number-format
-- 12c10a4: ZERO-2570: Category filters routes to absolute url
-
-### Patch Changes
-
-- Updated dependencies [d09b677]
-- Updated dependencies [6d4aadb]
-- Updated dependencies [ebb63ce]
-- Updated dependencies [7cebe87]
-- Updated dependencies [f3b595e]
-- Updated dependencies [59fb7c3]
-- Updated dependencies [f0c23bc]
-- Updated dependencies [3420416]
-- Updated dependencies [495d155]
-- Updated dependencies [6c18543]
-- Updated dependencies [40ad73e]
-- Updated dependencies [495d155]
-- Updated dependencies [f046f8e]
-- Updated dependencies [6b2972b]
-- Updated dependencies [3e68768]
-  - @akinon/next@1.34.0-rc.6
-  - @akinon/pz-masterpass@1.34.0-rc.6
-  - @akinon/pz-one-click-checkout@1.34.0-rc.6
-  - @akinon/pz-b2b@1.34.0-rc.6
-  - @akinon/pz-gpay@1.34.0-rc.6
-  - @akinon/pz-otp@1.34.0-rc.6
-  - @akinon/pz-pay-on-delivery@1.34.0-rc.6
+- @akinon/next@1.34.0
+- @akinon/pz-b2b@1.34.0
+- @akinon/pz-gpay@1.34.0
+- @akinon/pz-masterpass@1.34.0
+- @akinon/pz-one-click-checkout@1.34.0
+- @akinon/pz-otp@1.34.0
+- @akinon/pz-pay-on-delivery@1.34.0
 
 ## 1.33.2
 

package/app-template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "projectzeronext",
-  "version": "1.34.0-rc.8",
+  "version": "1.34.0",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -22,13 +22,13 @@
     "prestart": "pz-prestart"
   },
   "dependencies": {
-    "@akinon/next": "1.34.0-rc.8",
-    "@akinon/pz-b2b": "1.34.0-rc.8",
-    "@akinon/pz-gpay": "1.34.0-rc.8",
-    "@akinon/pz-masterpass": "1.34.0-rc.8",
-    "@akinon/pz-one-click-checkout": "1.34.0-rc.8",
-    "@akinon/pz-otp": "1.34.0-rc.8",
-    "@akinon/pz-pay-on-delivery": "1.34.0-rc.8",
+    "@akinon/next": "1.34.0",
+    "@akinon/pz-b2b": "1.34.0",
+    "@akinon/pz-gpay": "1.34.0",
+    "@akinon/pz-masterpass": "1.34.0",
+    "@akinon/pz-one-click-checkout": "1.34.0",
+    "@akinon/pz-otp": "1.34.0",
+    "@akinon/pz-pay-on-delivery": "1.34.0",
     "@hookform/resolvers": "2.9.0",
     "@next/third-parties": "14.1.0",
     "@react-google-maps/api": "2.17.1",
@@ -52,7 +52,7 @@
     "yup": "0.32.11"
   },
   "devDependencies": {
-    "@akinon/eslint-plugin-projectzero": "1.34.0-rc.8",
+    "@akinon/eslint-plugin-projectzero": "1.34.0",
     "@semantic-release/changelog": "6.0.2",
     "@semantic-release/exec": "6.0.3",
     "@semantic-release/git": "10.0.1",
@@ -79,7 +79,7 @@
     "jest-css-modules-transform": "4.3.0",
     "lint-staged": "13.1.0",
     "prettier": "2.6.2",
-    "react-number-format": "5.3.4",
+    "react-number-format": "4.9.3",
     "sass": "1.49.9",
     "semantic-release": "19.0.5",
     "server-only": "0.0.1",

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

@@ -1,5 +1,6 @@
 'use client';
 
+import { useSession } from 'next-auth/react';
 import { useForm, SubmitHandler } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import * as yup from 'yup';
@@ -33,6 +34,7 @@ const accountChangeEmailSchema = (t) =>
   });
 
 export default function Page() {
+  const { data } = useSession();
   const { data: profileInfo } = useGetProfileInfoQuery();
 
   const { t } = useLocalization();

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

@@ -247,7 +247,6 @@ export default function Page() {
             className="mb-5"
             required
           />
-
           <div className="mb-5">
             <Input
               label={t('account.my_profile.form.phone.placeholder')}

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

@@ -60,7 +60,7 @@ export default function Stores() {
       return options;
     }
     return [];
-  }, [country]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [country]);
 
   const cityOptions = useMemo(() => {
     if (city) {
@@ -73,7 +73,7 @@ export default function Stores() {
       return options;
     }
     return [];
-  }, [city]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [city]);
 
   const handleBackButtonClick = () => {
     setSelectedCityPk(null);

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

@@ -33,7 +33,7 @@ export default function Auth() {
     if (session?.user) {
       router.push(searchParams.get('callbackUrl') ?? '/');
     }
-  }, [session?.user]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [session?.user]);
 
   return (
     <section className="container px-4 my-7 md:mt-20 lg:px-0 lg:mx-auto">

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

@@ -1,6 +1,8 @@
 import { getLandingPageData } from '@akinon/next/data/server';
 import { withSegmentDefaults } from '@akinon/next/hocs/server';
 import { PageProps } from '@akinon/next/types';
+import logger from '@akinon/next/utils/log';
+import * as console from 'console';
 
 async function Page({ params }: PageProps<{ pk: number }>) {
   const data = await getLandingPageData({ pk: params.pk });

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

@@ -51,7 +51,7 @@ const Checkout = () => {
       dispatch(setCurrentStep(CheckoutStep.Payment));
       initialStepChanged.current = true;
     }
-  }, [steps.shipping.completed]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [steps.shipping.completed]);
 
   useEffect(() => {
     if (preOrder && !preOrder.shipping_option) {
@@ -63,7 +63,7 @@ const Checkout = () => {
     return () => {
       dispatch(resetCheckoutState());
     };
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, []);
 
   useEffect(() => {
     if (isSuccess) {

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

@@ -40,7 +40,7 @@ const CheckoutCompleted = ({
     return () => {
       dispatch(setCurrentStep(CheckoutStep.Shipping));
     };
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, []);
 
   useEffect(() => {
     if (data?.order) {

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

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

package/app-template/src/components/carousel-core.tsx

@@ -28,7 +28,7 @@ const CarouselCore = forwardRef<Carousel, CarouselProps>((props, ref) => {
     } else {
       setAspectRatio(containerAspectRatio.mobile);
     }
-  }, [matches, containerAspectRatio]);
+  }, [matches]);
 
   return (
     <div className="w-full" style={{ aspectRatio }}>

package/app-template/src/components/checkbox.tsx

@@ -3,7 +3,7 @@ import { CheckboxProps } from '@theme/components/types';
 import { twMerge } from 'tailwind-merge';
 
 const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
-  const { children, checked = false, error, ...rest } = props;
+  const { children, error, ...rest } = props;
 
   return (
     <label className={twMerge('flex flex-col text-xs', props.className)}>
@@ -12,7 +12,6 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
           type="checkbox"
           {...rest}
           ref={ref}
-          defaultChecked={checked}
           className="w-4 h-4 shrink-0"
         />
         {children && <span className="ml-2">{children}</span>}

package/app-template/src/components/input.tsx

@@ -1,28 +1,17 @@
 import clsx from 'clsx';
-import { forwardRef, FocusEvent, useState, Ref } from 'react';
+import { forwardRef, FocusEvent, useState } from 'react';
 import { Controller } from 'react-hook-form';
-import { PatternFormat, PatternFormatProps } from 'react-number-format';
+import NumberFormat, { NumberFormatProps } from 'react-number-format';
 import { InputProps } from '@theme/components/types';
 import { twMerge } from 'tailwind-merge';
 
-const PatternFormatWithRef = forwardRef(
-  (props: PatternFormatProps, ref: Ref<HTMLInputElement>) => {
-    return <PatternFormat {...props} getInputRef={ref} />;
-  }
-);
-PatternFormatWithRef.displayName = 'PatternFormatWithRef';
-
 export const Input = forwardRef<
   HTMLInputElement,
   InputProps &
     Pick<
-      PatternFormatProps,
-      'mask' | 'allowEmptyFormatting' | 'onValueChange'
-    > & {
-      format?: string;
-      defaultValue?: string;
-      type?: string;
-    }
+      NumberFormatProps,
+      'format' | 'mask' | 'allowEmptyFormatting' | 'onValueChange'
+    >
 >((props, ref) => {
   const [focused, setFocused] = useState(false);
   const [hasValue, setHasValue] = useState(false);
@@ -48,7 +37,6 @@ export const Input = forwardRef<
     ),
     props.className
   );
-
   const inputProps: any = {
     id,
     ref,
@@ -91,14 +79,14 @@ export const Input = forwardRef<
             <Controller
               name={props.name ?? ''}
               control={props.control}
+              defaultValue={false}
               render={({ field }) => (
-                <PatternFormatWithRef
+                <NumberFormat
                   format={format}
                   mask={mask ?? ''}
                   {...rest}
                   {...field}
                   {...inputProps}
-                  type={props.type as 'text' | 'password' | 'tel'}
                 />
               )}
             />

package/app-template/src/components/pagination.tsx

@@ -123,13 +123,13 @@ export const Pagination = (props: PaginationProps) => {
     if (inView) {
       handlePageChange();
     }
-  }, [inView]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [inView]);
 
   useEffect(() => {
     if (type === 'list') {
       createListItems();
     }
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, []);
 
   useEffect(() => {
     if (total && total !== paginationTotal) {
@@ -198,7 +198,7 @@ export const Pagination = (props: PaginationProps) => {
             containerClassName
           )}
         >
-          {prev && currentPage !== 1 && (
+          {prev && (
             <li>
               <Link
                 onClick={(e) => handleClick(e, prev)}

package/app-template/src/components/price.tsx

@@ -1,10 +1,10 @@
 import { useMemo } from 'react';
-import { NumericFormat, NumericFormatProps } from 'react-number-format';
+import NumberFormat, { NumberFormatProps } from 'react-number-format';
 import { getCurrency } from '@akinon/next/utils';
 import { PriceProps } from '@theme/types';
 import { useLocalization } from '@akinon/next/hooks';
 
-export const Price = (props: NumericFormatProps & PriceProps) => {
+export const Price = (props: NumberFormatProps & PriceProps) => {
   const {
     value,
     currencyCode,
@@ -38,7 +38,7 @@ export const Price = (props: NumericFormatProps & PriceProps) => {
   );
 
   return (
-    <NumericFormat
+    <NumberFormat
       value={useNegative ? `-${useNegativeSpace}${_value}` : _value}
       {...{
         [useCurrencyAfterPrice ? 'suffix' : 'prefix']: currency

package/app-template/src/middleware.ts

@@ -1,5 +1,5 @@
-import { withPzDefault } from '@akinon/next/middlewares';
-import { NextMiddleware, NextResponse } from 'next/server';
+import { PzNextRequest, withPzDefault } from '@akinon/next/middlewares';
+import { NextFetchEvent, NextMiddleware, NextResponse } from 'next/server';
 
 /**
  * !IMPORTANT
@@ -16,18 +16,18 @@ export const config = {
   ]
 };
 
-const middleware: NextMiddleware = () =>
-  // req: PzNextRequest,
-  // event: NextFetchEvent
-  {
-    // If you use a custom response such as NextResponse.json(),
-    // you should set pz-override-response header to true as shown below.
-    // Otherwise, you'll get a 404 error.
+const middleware: NextMiddleware = (
+  req: PzNextRequest,
+  event: NextFetchEvent
+) => {
+  // If you use a custom response such as NextResponse.json(),
+  // you should set pz-override-response header to true as shown below.
+  // Otherwise, you'll get a 404 error.
 
-    // Example:
-    // return NextResponse.json({ status: 'ok' }, { headers: { 'pz-override-response': 'true' } });
+  // Example:
+  // return NextResponse.json({ status: 'ok' }, { headers: { 'pz-override-response': 'true' } });
 
-    return NextResponse.next();
-  };
+  return NextResponse.next();
+};
 
 export default withPzDefault(middleware);

package/app-template/src/redux/reducers/category.ts

@@ -31,10 +31,7 @@ const categorySlice = createSlice({
         if (facet.key === action.payload.facet.key) {
           facet.data.choices = facet.data.choices
             .map((choice) => {
-              if (
-                action.payload.facet.widget_type === WIDGET_TYPE.category &&
-                choice.is_selected
-              ) {
+              if (action.payload.facet.widget_type === WIDGET_TYPE.category) {
                 choice.is_selected = false;
               }
               return choice;
@@ -51,24 +48,6 @@ const categorySlice = createSlice({
         return facet;
       });
     },
-    removeCategoryFacet(state, action) {
-      state.selectedFacets = state.selectedFacets.map((facet) => {
-        if (facet.key === action.payload.facet.key) {
-          facet.data.choices = facet.data.choices.map((choice) => {
-            if (choice.value === action.payload.choice.value) {
-              choice.is_selected = false;
-            }
-            return choice;
-          });
-        }
-
-        return facet;
-      });
-
-      state.selectedFacets = state.selectedFacets.filter(
-        (facet) => facet.key !== action.payload.facet.key
-      );
-    },
     resetSelectedFacets(state) {
       return {
         ...state,
@@ -82,7 +61,6 @@ export const {
   setFacets,
   setSelectedFacets,
   toggleFacet,
-  removeCategoryFacet,
   resetSelectedFacets
 } = categorySlice.actions;
 

package/app-template/src/redux/store.ts

@@ -33,7 +33,7 @@ export type AppStore = ReturnType<typeof makeStore>;
 
 export type RootState = ReturnType<AppStore['getState']>;
 
-export type TypedDispatch = ThunkDispatch<RootState, void, AnyAction>;
+export type TypedDispatch = ThunkDispatch<RootState, any, AnyAction>;
 
 export type AppDispatch = AppStore['dispatch'];
 

package/app-template/src/settings.js

@@ -58,6 +58,5 @@ module.exports = {
   ],
   redis: {
     defaultExpirationTime: 900 // 15 min
-  },
-  customNotFoundEnabled: false
+  }
 };

package/app-template/src/types/next-auth.d.ts

@@ -1,4 +1,3 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 import NextAuth from 'next-auth';
 
 declare module 'next-auth' {

package/app-template/src/views/account/account-menu.tsx

@@ -63,6 +63,7 @@ export default function AccountMenu() {
   const [logout] = useLogoutMutation();
   const pathname = usePathname();
   const accountMenuRegex = new RegExp(`^${ROUTES.ACCOUNT}/?$`).test(pathname);
+
   const handleLogout = async () => {
     logout()
       .unwrap()

package/app-template/src/views/account/address-form.tsx

@@ -121,7 +121,7 @@ export const AddressForm = (props: Props) => {
       return options;
     }
     return [];
-  }, [country]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [country]);
 
   const cityOptions = useMemo(() => {
     if (city) {
@@ -137,7 +137,7 @@ export const AddressForm = (props: Props) => {
       return options;
     }
     return [];
-  }, [city]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [city]);
 
   const townshipOptions = useMemo(() => {
     if (township) {
@@ -156,7 +156,7 @@ export const AddressForm = (props: Props) => {
       return options;
     }
     return [];
-  }, [township]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [township]);
 
   const districtOptions = useMemo(() => {
     if (district) {
@@ -175,7 +175,7 @@ export const AddressForm = (props: Props) => {
       return options;
     }
     return [];
-  }, [district]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [district]);
 
   useEffect(() => {
     if (data && country) {

package/app-template/src/views/account/orders/order-detail-header.tsx

@@ -14,6 +14,13 @@ export interface Props {
 export const OrderDetailHeader = ({ title, order, children }: Props) => {
   const { t } = useLocalization();
 
+  const orderDate = new Date(order.created_date)
+    .toJSON()
+    .slice(0, 10)
+    .split('-')
+    .reverse()
+    .join(' ');
+
   return (
     <div className="bg-gray-150 flex flex-col items-center justify-center p-6 w-full mb-8 md:flex-row">
       <div className="flex flex-col items-center text-center gap-2">

package/app-template/src/views/category/category-active-filters.tsx

@@ -1,15 +1,11 @@
 import { useAppDispatch, useAppSelector } from '@akinon/next/redux/hooks';
 import React, { useEffect, useMemo } from 'react';
-import {
-  removeCategoryFacet,
-  toggleFacet
-} from '@theme/redux/reducers/category';
+import { toggleFacet } from '@theme/redux/reducers/category';
 import { useRouter } from '@akinon/next/hooks';
 import convertFacetSearchParams from '@theme/utils/convert-facet-search-params';
 import { usePathname } from 'next/navigation';
 import { WIDGET_TYPE } from '@theme/types';
 import { useSearchParams } from 'next/dist/client/components/navigation';
-import { Icon } from '@theme/components';
 
 const CategoryActiveFilters = () => {
   const dispatch = useAppDispatch();
@@ -20,11 +16,6 @@ const CategoryActiveFilters = () => {
   const { facets, selectedFacets } = useAppSelector((state) => state.category);
 
   const handleRemoveFilter = ({ facet, choice }) => {
-    if (facet.widget_type === WIDGET_TYPE.category) {
-      dispatch(removeCategoryFacet({ facet, choice }));
-      return;
-    }
-
     dispatch(toggleFacet({ facet, choice }));
   };
 
@@ -62,23 +53,43 @@ const CategoryActiveFilters = () => {
       {facets.map((facet) =>
         facet.data.choices
           .filter((choice) => choice.is_selected)
-          .map(
-            (choice) =>
-              Number(choice.real_depth) !== 2 && (
+          .map((choice) => (
+            <div
+              className="flex justify-between text-xs text-black-800 py-3.5 px-4 border border-gray-400 hover:bg-gray-300 cursor-default items-center"
+              key={`${facet.key}-${choice.label}`}
+            >
+              <div>
+                {facet.widget_type !== WIDGET_TYPE.category && (
+                  <span>{facet.name}: </span>
+                )}
+                <span>{choice.label}</span>
+              </div>
+              {facet.widget_type !== WIDGET_TYPE.category && (
                 <div
-                  className="flex justify-between text-xs text-black-800 py-3.5 px-4 border border-gray-400 hover:bg-gray-300 cursor-default items-center"
-                  key={`${facet.key}-${choice.label}`}
+                  className="cursor-pointer ml-4"
+                  onClick={() => handleRemoveFilter({ facet, choice })}
                 >
-                  <span>{choice.label}</span>
-                  <Icon
-                    className="cursor-pointer"
-                    name="close"
-                    size={12}
-                    onClick={() => handleRemoveFilter({ facet, choice })}
-                  />
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    viewBox="0 0 13.5 13.5"
+                    width="1em"
+                    height="1em"
+                  >
+                    <path
+                      d="m.75 12.75 12-12m-12 0 12 12"
+                      style={{
+                        fill: 'none',
+                        stroke: '#000',
+                        strokeLinecap: 'round',
+                        strokeLinejoin: 'round',
+                        strokeWidth: '1.5px'
+                      }}
+                    />
+                  </svg>
                 </div>
-              )
-          )
+              )}
+            </div>
+          ))
       )}
     </div>
   );

package/app-template/src/views/category/category-info.tsx

@@ -44,7 +44,7 @@ export default function ListPage(props: ListPageProps) {
       newUrl.searchParams.delete('page');
       router.push(newUrl.pathname + newUrl.search, undefined);
     }
-  }, [searchParams, data.products, page]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [searchParams, data.products, page]);
 
   const dispatch = useAppDispatch();
   const { t } = useLocalization();
@@ -70,7 +70,7 @@ export default function ListPage(props: ListPageProps) {
           ></div>
           <div className="flex flex-col items-center lg:items-stretch col-span-2 lg:col-span-1">
             <CategoryHeader
-              totalCount={data.pagination?.total_count}
+              totalCount={data.pagination.total_count}
               setMenuStatus={() => setIsMenuOpen(true)}
               sortOptions={data.sorters}
             />
@@ -78,7 +78,7 @@ export default function ListPage(props: ListPageProps) {
               <CategoryActiveFilters />
             </div>
 
-            {data.products?.length === 0 && page === 1 && (
+            {data.products.length === 0 && page === 1 && (
               <div className="text-center bg-gray-200 px-5 py-20">
                 <p className="pb-4">{t('category.search.not_found')}</p>
                 <Link className="underline" href={ROUTES.HOME}>

package/app-template/src/views/category/filters/index.tsx

@@ -6,7 +6,7 @@ import clsx from 'clsx';
 import { Accordion, Button, Checkbox, Icon, Radio } from '@theme/components';
 import { SizeFilter } from './size-filter';
 
-import { useLocalization, useRouter } from '@akinon/next/hooks';
+import { useLocalization } from '@akinon/next/hooks';
 import { Facet, FacetChoice } from '@akinon/next/types';
 import { useAppDispatch, useAppSelector } from '@akinon/next/redux/hooks';
 import {
@@ -14,8 +14,7 @@ import {
   toggleFacet
 } from '@theme/redux/reducers/category';
 import CategoryActiveFilters from '@theme/views/category/category-active-filters';
-import { useEffect, useMemo } from 'react';
-import { commonProductAttributes } from '@theme/settings';
+import { useMemo } from 'react';
 
 const COMPONENT_TYPES = {
   [WIDGET_TYPE.category]: Radio,
@@ -28,7 +27,6 @@ interface Props {
 }
 
 export const Filters = (props: Props) => {
-  const router = useRouter();
   const facets = useAppSelector((state) => state.category.facets);
   const dispatch = useAppDispatch();
   const { t } = useLocalization();
@@ -41,16 +39,12 @@ export const Filters = (props: Props) => {
     facet: Facet;
     choice: FacetChoice;
   }) => {
-    if (facet.key === 'category_ids') {
-      router.push(choice.url);
-    } else {
-      dispatch(
-        toggleFacet({
-          facet,
-          choice
-        })
-      );
-    }
+    dispatch(
+      toggleFacet({
+        facet,
+        choice
+      })
+    );
   };
 
   const haveFilter = useMemo(() => {
@@ -66,19 +60,6 @@ export const Filters = (props: Props) => {
     dispatch(resetSelectedFacets());
   };
 
-  useEffect(() => {
-    const url = new URL(window.location.href);
-    if (url.searchParams.has('category_ids')) {
-      url.searchParams.delete('category_ids');
-      const newHref = url.pathname + url.search;
-      window.history.replaceState({}, '', newHref);
-    }
-  }, [router]);
-
-  const sizeKey = commonProductAttributes.find(
-    (item) => item.translationKey === 'size'
-  ).key;
-
   return (
     <div
       className={clsx(
@@ -100,7 +81,7 @@ export const Filters = (props: Props) => {
         let Component = null;
         const choices = [...facet.data.choices];
 
-        if (facet.key === sizeKey) {
+        if (facet.key === 'integration_SizeId') {
           // If it's a size facet, use the custom size filter component
           Component = SizeFilter;
 
@@ -126,8 +107,8 @@ export const Filters = (props: Props) => {
           >
             <div
               className={clsx(
-                'flex gap-4 flex-wrap',
-                facet.key === sizeKey ? 'flex-row' : 'flex-col' // TODO: This condition must be refactor to a better way
+                'flex gap-4',
+                facet.key === 'integration_SizeId' ? 'flex-row' : 'flex-col' // TODO: This condition must be refactor to a better way
               )}
             >
               {choices.map((choice, index) => (
@@ -136,13 +117,13 @@ export const Filters = (props: Props) => {
                   data={choice}
                   name={facet.key}
                   onChange={() => {
-                    if (facet.key !== sizeKey) {
+                    if (facet.key !== 'integration_SizeId') {
                       // TODO: This condition must be refactor to a better way
                       handleSelectFilter({ facet, choice });
                     }
                   }}
                   onClick={() => {
-                    if (facet.key === sizeKey) {
+                    if (facet.key === 'integration_SizeId') {
                       // TODO: This condition must be refactor to a better way
                       handleSelectFilter({ facet, choice });
                     }

package/app-template/src/views/checkout/auth.tsx

@@ -20,7 +20,7 @@ const CheckoutAuth = () => {
     } else if (status === 'unauthenticated') {
       router.replace(ROUTES.CHECKOUT + `?callbackUrl=${ROUTES.CHECKOUT}`);
     }
-  }, [status]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [status]);
 
   return (
     <div className="flex flex-col w-full my-5 lg:flex-row">

package/app-template/src/views/checkout/steps/payment/options/credit-card/index.tsx

@@ -151,7 +151,7 @@ const CheckoutCreditCard = () => {
 
     setMonths(months);
     setYears(years);
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, []);
 
   useEffect(() => {
     if (installment?.pk) {

package/app-template/src/views/checkout/steps/payment/options/funds-transfer.tsx

@@ -13,9 +13,10 @@ import CheckoutAgreements from '../agreements';
 import PaymentHeader from '../payment-header';
 import { useLocalization } from '@akinon/next/hooks';
 import { Image } from '@akinon/next/components/image';
+import PaymentOptionButtons from '../payment-option-buttons';
 import { Trans } from '@akinon/next/components/trans';
 
-const fundsTransferFormSchema = () =>
+const fundsTransferFormSchema = (t) =>
   yup.object().shape({
     agreement: yup.boolean().oneOf([true], 'This field is required.')
   });
@@ -27,7 +28,7 @@ const CheckoutFundsTransfer = () => {
     control,
     formState: { errors }
   } = useForm({
-    resolver: yupResolver(fundsTransferFormSchema())
+    resolver: yupResolver(fundsTransferFormSchema(t))
   });
   const [formError, setFormError] = useState(null);
   const { bankAccounts, selectedBankAccountPk, preOrder } = useAppSelector(

package/app-template/src/views/checkout/steps/payment/options/redirection.tsx

@@ -1,12 +1,14 @@
 'use client';
 
 import { useCompleteRedirectionPaymentMutation } from '@akinon/next/data/client/checkout';
+import { useLocalization } from '@akinon/next/hooks';
 import { useAppSelector } from '@akinon/next/redux/hooks';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { Button, Checkbox } from '@theme/components';
 import { useForm } from 'react-hook-form';
 import { twMerge } from 'tailwind-merge';
 import * as yup from 'yup';
+import PaymentOptionButtons from '../payment-option-buttons';
 import { useEffect, useState } from 'react';
 import { getPosError } from '@akinon/next/utils';
 
@@ -14,7 +16,7 @@ interface FormValues {
   agreement: boolean;
 }
 
-const formSchema = () =>
+const formSchema = (t) =>
   yup.object().shape({
     agreement: yup
       .boolean()
@@ -26,12 +28,13 @@ export default function RedirectionPayment() {
   const { payment_option } = useAppSelector((state) => state.checkout.preOrder);
   const [formError, setFormError] = useState(null);
 
+  const { t } = useLocalization();
   const {
     register,
     handleSubmit,
     formState: { errors }
   } = useForm<FormValues>({
-    resolver: yupResolver(formSchema())
+    resolver: yupResolver(formSchema(t))
   });
   const [completeRedirectionPayment] = useCompleteRedirectionPaymentMutation();
 

package/app-template/src/views/find-in-store/index.tsx

@@ -63,7 +63,7 @@ export const FindInStore = ({ productPk, productName, variants }) => {
       return options;
     }
     return [];
-  }, [retailStore]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [retailStore]);
 
   const sizeOptions = useMemo(() => {
     if (variants) {
@@ -80,7 +80,7 @@ export const FindInStore = ({ productPk, productName, variants }) => {
       return options;
     }
     return [];
-  }, [variants, sizeKey]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [variants]);
 
   const createStockStatus = (stock) => {
     const status = {

package/app-template/src/views/header/mini-basket.tsx

@@ -46,7 +46,7 @@ function MiniBasketItem(props: MiniBasketItemProps) {
         miniBasketList.scrollTop = 0;
       }
     }
-  }, [highlightedItem, basketItem.product.pk, miniBasketListRef]);
+  }, [highlightedItem, basketItem.product.pk]);
 
   const removeItem = () => {
     updateQuantityMutation({
@@ -183,7 +183,7 @@ export default function MiniBasket() {
         setSortedBasket(basket.basketitem_set);
       }
     }
-  }, [isSuccess, highlightedItem, basket, highlightedItemPk]);
+  }, [isSuccess, highlightedItem, basket]);
 
   return (
     <>

package/app-template/src/views/product/product-info.tsx

@@ -36,7 +36,7 @@ export default function ProductInfo({ data }: ProductPageProps) {
 
   useEffect(() => {
     pushProductViewed(data?.product);
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, []);
 
   const addProductToCart = async () => {
     if (!variantsSelectionCheck()) {
@@ -206,14 +206,7 @@ export default function ProductInfo({ data }: ProductPageProps) {
             'after:bg-[#d02c2f]',
             'after:rounded-xl',
             'after:left-1'
-          ]),
-          onError: (error) =>
-            setProductError(
-              error?.data?.non_field_errors ||
-                Object.keys(error?.data).map(
-                  (key) => `${key}: ${error?.data[key].join(', ')}`
-                )
-            )
+          ])
         }}
       />
 

package/app-template/src/views/product-item/index.tsx

@@ -36,7 +36,7 @@ export const ProductItem = (props: Props) => {
       setViewed(true);
       pushProductListProductViewed(product);
     }
-  }, [inView, viewed, product]);
+  }, [inView]);
 
   return (
     <div

package/app-template/src/widgets/footer-subscription/footer-subscription-form.tsx

@@ -10,7 +10,7 @@ import { useGetWidgetQuery } from '@akinon/next/data/client/misc';
 import { Input, Button, Checkbox, Modal } from '@theme/components';
 import { useLocalization } from '@akinon/next/hooks';
 
-const subscriptionFormSchema = (t: (key: string) => string) =>
+const subscriptionFormSchema = (t: any) =>
   yup.object().shape({
     email: yup
       .string()

package/app-template/tsconfig.json

@@ -3,10 +3,7 @@
   "display": "Default",
   "compilerOptions": {
     "baseUrl": "./src",
-    "paths": {
-      "@theme/*": ["./*"],
-      "@root/*": ["./app/[commerce]/[locale]/[currency]/*"]
-    },
+    "paths": { "@theme/*": ["./*"] },
     "allowSyntheticDefaultImports": true,
     "composite": false,
     "declaration": true,
@@ -43,5 +40,7 @@
     ".next/types/**/*.ts",
     "../../packages/**/*"
   ],
-  "exclude": ["node_modules", "../../packages/projectzero/app-template"]
+  "exclude": ["node_modules",
+    "../../packages/projectzero/app-template"
+  ]
 }

package/commands/create.ts

@@ -108,6 +108,17 @@ function createEnvironmentFile(projectDir: string) {
   fs.copyFileSync(`${projectDir}/.env.example`, `${projectDir}/.env`);
 }
 
+function checkGitignore(projectDir: string) {
+  const gitignorePath = path.join(projectDir, '.gitignore');
+  const npmignorePath = path.join(projectDir, '.npmignore');
+
+  if (!fs.existsSync(gitignorePath)) {
+    fs.renameSync(npmignorePath, gitignorePath);
+  } else if (fs.existsSync(npmignorePath)) {
+    fs.rmSync(npmignorePath);
+  }
+}
+
 export default async (): Promise<void> => {
   const minNodeVersion = 18;
   const currentNodeVersion = parseInt(
@@ -143,6 +154,7 @@ export default async (): Promise<void> => {
 
   updatePluginsFile(projectDir);
   createEnvironmentFile(projectDir);
+  checkGitignore(projectDir);
 
   if (answers.projectDescription) {
     updateFileContents(path.join(projectDir, 'akinon.json'), {

package/dist/commands/create.js

@@ -112,6 +112,13 @@ function updatePluginsFile(projectDir) {
 function createEnvironmentFile(projectDir) {
     fs.copyFileSync(`${projectDir}/.env.example`, `${projectDir}/.env`);
 }
+function checkGitignore(projectDir) {
+    const gitignorePath = path_1.default.join(projectDir, '.gitignore');
+    const npmignorePath = path_1.default.join(projectDir, '.npmignore');
+    if (!fs.existsSync(gitignorePath)) {
+        fs.renameSync(npmignorePath, gitignorePath);
+    }
+}
 exports.default = () => __awaiter(void 0, void 0, void 0, function* () {
     const minNodeVersion = 18;
     const currentNodeVersion = parseInt(process.version.replace('v', '').split('.')[0]);
@@ -129,6 +136,7 @@ exports.default = () => __awaiter(void 0, void 0, void 0, function* () {
     fs.cpSync(templatesDir, projectDir, { recursive: true });
     updatePluginsFile(projectDir);
     createEnvironmentFile(projectDir);
+    checkGitignore(projectDir);
     if (answers.projectDescription) {
         updateFileContents(path_1.default.join(projectDir, 'akinon.json'), {
             description: answers.projectDescription

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akinon/projectzero",
-  "version": "1.34.0-rc.8",
+  "version": "1.34.0",
   "private": false,
   "description": "CLI tool to manage your Project Zero Next project",
   "bin": {

package/app-template/eslint.config.js

@@ -1,10 +0,0 @@
-const baseConfig = require('@akinon/next/eslint.config')
-
-module.exports = {
-  ...baseConfig,
-  settings: {
-    next: {
-      rootDir: ['src/*/']
-    }
-  },
-};

package/app-template/public/locales/en/not_found.json

@@ -1,5 +0,0 @@
-{
-  "title": "Page Not Found",
-  "sub_title": "It looks like the page you're looking for doesn't exist.",
-  "button": "Return to Home Page"
-}

package/app-template/public/locales/tr/not_found.json

@@ -1,5 +0,0 @@
-{
-  "title": "Sayfa Bulunamadı",
-  "sub_title": "Aradığınız sayfa bulunamadı gibi görünüyor.",
-  "button": "Ana Sayfaya Dön"
-}

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

@@ -1,8 +0,0 @@
-import Page, {
-  dynamic,
-  revalidate,
-  generateMetadata
-} from '@akinon/next/routes/pretty-url';
-
-export { dynamic, revalidate, generateMetadata };
-export default Page;

package/app-template/src/app/[commerce]/[locale]/[currency]/pz-not-found/page.tsx

@@ -1,24 +0,0 @@
-'use client';
-
-import React from 'react';
-import { Button, Link } from '@theme/components';
-import { useLocalization } from '@akinon/next/hooks';
-
-const NotFound = () => {
-  const { t } = useLocalization();
-
-  return (
-    <div className="py-6 flex flex-col items-center justify-center">
-      <div className="text-8xl font-bold">404</div>
-      <h1 className="text-4xl font-bold mb-4">{t('not_found.title')}</h1>
-      <p className="text-lg mb-6">{t('not_found.sub_title')}</p>
-      <Link href={'/'}>
-        <Button className="h-auto mt-4 text-base py-3 px-6">
-          {t('not_found.button')}
-        </Button>
-      </Link>
-    </div>
-  );
-};
-
-export default NotFound;