@akinon/next 1.0.0

package/.prettierrc

@@ -0,0 +1,13 @@
+{
+  "bracketSameLine": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "jsxSingleQuote": false,
+  "bracketSpacing": true,
+  "semi": true,
+  "useTabs": false,
+  "arrowParens": "always",
+  "endOfLine": "lf",
+  "proseWrap": "never",
+  "trailingComma": "none"
+}

package/api/auth.ts

@@ -0,0 +1,217 @@
+import { NextApiRequest, NextApiResponse } from 'next';
+import NextAuth, { Session } from 'next-auth';
+import CredentialProvider from 'next-auth/providers/credentials';
+import { ROUTES } from 'routes';
+import { URLS, user } from '../data/urls';
+import Settings from 'settings';
+import { urlLocaleMatcherRegex } from '../utils';
+import logger from '@akinon/next/utils/log';
+import { AuthError } from '../types';
+
+async function getCurrentUser(sessionId: string) {
+  const currentUser = await (
+    await fetch(URLS.user.currentUser, {
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: `osessionid=${sessionId}`
+      }
+    })
+  ).json();
+
+  logger.debug('Successfully fetched current user data', { currentUser });
+
+  return {
+    pk: currentUser.pk,
+    firstName: currentUser.first_name,
+    lastName: currentUser.last_name,
+    email: currentUser.email,
+    phone: currentUser.phone,
+    emailAllowed: currentUser.email_allowed,
+    smsAllowed: currentUser.sms_allowed,
+    dateJoined: currentUser.date_joined,
+    lastLogin: currentUser.last_login,
+    dateOfBirth: currentUser.date_of_birth,
+    hashedEmail: currentUser.hashed_email,
+    gender: currentUser.gender,
+    token: ''
+  };
+}
+
+const nextAuthOptions = (req: NextApiRequest, res: NextApiResponse) => {
+  return {
+    providers: [
+      CredentialProvider({
+        id: 'oauth',
+        name: 'credentials',
+        credentials: {},
+        authorize: async (credentials) => {
+          const sessionId = req.cookies['osessionid'];
+
+          if (!sessionId) {
+            return null;
+          }
+
+          const currentUser = await getCurrentUser(sessionId);
+          return currentUser;
+        }
+      }),
+      CredentialProvider({
+        id: 'default',
+        name: 'credentials',
+        credentials: {
+          email: { label: 'Email', type: 'email', placeholder: 'Email' },
+          password: {
+            label: 'Password',
+            type: 'password',
+            placeholder: 'Password'
+          },
+          formType: {},
+          locale: {},
+          captchaValidated: {}
+        },
+        authorize: async (credentials) => {
+          const headers: HeadersInit = new Headers();
+          const language = Settings.localization.locales.find(
+            (item) => item.value === credentials.locale
+          ).apiValue;
+
+          headers.set('Content-Type', 'application/json');
+          headers.set('cookie', `${req.headers.cookie}`);
+          headers.set('Accept-Language', `${language}`);
+
+          logger.debug('Trying to login/register', {
+            formType: credentials.formType
+          });
+
+          const apiRequest = await fetch(
+            `${Settings.commerceUrl}${user[credentials.formType]}`,
+            {
+              method: 'POST',
+              headers,
+              body: JSON.stringify(credentials)
+            }
+          );
+
+          logger.info(`Login/Register request result: ${apiRequest.status}`);
+
+          const response = (await apiRequest.json()) as {
+            key: string;
+            non_field_errors: string[];
+            redirect_url: string;
+          };
+
+          logger.debug(`Login/Register response: ${JSON.stringify(response)}`);
+
+          let sessionId = '';
+          const setCookieHeader = apiRequest.headers.get('set-cookie');
+          if (setCookieHeader) {
+            sessionId =
+              setCookieHeader
+                .match(/osessionid=\w+/)?.[0]
+                .replace(/osessionid=/, '') || '';
+
+            logger.debug(`Login/Register session id: ${sessionId}`);
+          } else {
+            logger.warn('No set-cookie header found in response');
+          }
+
+          if (sessionId) {
+            res.setHeader('Set-Cookie', [
+              `osessionid=${sessionId}; Path=/; HttpOnly; Secure;`,
+              `sessionid=${sessionId}; Path=/; HttpOnly; Secure;` // required to get 3D redirection form
+            ]);
+          }
+
+          if (!response.key) {
+            let errors = [] as AuthError[];
+
+            const fieldErrors = Object.keys(response ?? {})
+              .filter((key) => key !== 'non_field_errors')
+              .map((key) => {
+                return {
+                  name: key,
+                  value: response[key]
+                };
+              });
+
+            if (response.redirect_url?.includes('captcha')) {
+              errors.push({
+                type: 'captcha'
+              });
+
+              logger.debug('Captcha required', {
+                email: credentials.email,
+                formType: credentials.formType
+              });
+            } else if (fieldErrors.length) {
+              errors.push({
+                type: 'field_errors',
+                data: fieldErrors
+              });
+            } else if (response.non_field_errors) {
+              errors.push({
+                type: 'non_field_errors',
+                data: response.non_field_errors
+              });
+            }
+
+            if (errors.length) {
+              throw new Error(JSON.stringify(errors));
+            }
+          }
+
+          const currentUser = await getCurrentUser(sessionId);
+          return currentUser;
+        }
+      })
+    ],
+    callbacks: {
+      jwt: async ({ token, user }) => {
+        if (user) {
+          token.user = user;
+        }
+
+        return token;
+      },
+      async session({ session, user, token }) {
+        session.user = token.user as Session['user'];
+        return session;
+      },
+      async redirect({ url, baseUrl }: { url: string; baseUrl: string }) {
+        const pathname = url.startsWith('/') ? url : url.replace(baseUrl, '');
+        const pathnameWithoutLocale = pathname.replace(
+          urlLocaleMatcherRegex,
+          ''
+        );
+
+        const localeResults = req.headers.referer
+          .replace(baseUrl, '')
+          .match(urlLocaleMatcherRegex);
+
+        return `${baseUrl}${localeResults?.[0] || ''}${pathnameWithoutLocale}`;
+      }
+    },
+    events: {
+      signIn: () => {
+        logger.debug('Successfully signed in');
+      },
+      signOut: () => {
+        res.setHeader('Set-Cookie', [
+          `osessionid=; Path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT`,
+          `sessionid=; Path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT`
+        ]);
+        logger.debug('Successfully signed out');
+      }
+    },
+    pages: {
+      signIn: ROUTES.AUTH,
+      error: ROUTES.AUTH
+    }
+  };
+};
+
+const Auth = (req, res) => {
+  return NextAuth(req, res, nextAuthOptions(req, res));
+};
+
+export default Auth;

package/api/cache.ts

@@ -0,0 +1,44 @@
+import { Cache } from '../lib/cache';
+import { NextResponse } from 'next/server';
+import logger from '@akinon/next/utils/log';
+
+export async function POST(...args) {
+  return handleRequest(...args);
+}
+
+export async function PUT(...args) {
+  return handleRequest(...args);
+}
+
+async function handleRequest(...args) {
+  const [req] = args as [req: Request];
+
+  if (
+    !req.headers.get('authorization') ||
+    req.headers.get('authorization') !== process.env.CACHE_SECRET
+  ) {
+    return NextResponse.next({ status: 403 });
+  }
+
+  const formData = await req.formData();
+  const body = {} as { key: string; value?: string; expire?: number };
+
+  formData.forEach((value, key) => {
+    body[key] = value;
+  });
+
+  const { key, value, expire } = body;
+  let response: string | boolean;
+
+  try {
+    if (req.method === 'POST') {
+      response = await Cache.get(key);
+    } else if (req.method === 'PUT') {
+      response = await Cache.set(key, value, expire);
+    }
+  } catch (error) {
+    logger.error(error);
+  }
+
+  return NextResponse.json(response);
+}

package/api/client.ts

@@ -0,0 +1,157 @@
+import { ClientRequestOptions } from '../types';
+import { NextResponse } from 'next/server';
+import settings from 'settings';
+import logger from '../utils/log';
+
+interface RouteParams {
+  params: {
+    slug: string[];
+  };
+}
+
+async function proxyRequest(...args) {
+  const [req, { params }] = args as [req: Request, params: RouteParams];
+  const { searchParams } = new URL(req.url);
+  const commerceUrl = settings.commerceUrl;
+
+  if (commerceUrl === 'default') {
+    return NextResponse.json(
+      { error: 'Commerce URL not found' },
+      { status: 404 }
+    );
+  }
+
+  const options: ClientRequestOptions = {
+    useTrailingSlash: true,
+    useFormData: false,
+    contentType: null,
+    accept: 'application/json',
+    responseType: 'json'
+  };
+
+  const slug = params.slug.join('/');
+  const options_ = JSON.parse(
+    decodeURIComponent((searchParams.get('options') as string) ?? '{}')
+  );
+  const urlSearchParams = new URLSearchParams();
+
+  Object.assign(options, options_);
+
+  Array.from(searchParams.keys()).forEach((key) => {
+    if (key !== 'slug' && key !== 'options') {
+      urlSearchParams.append(key, `${searchParams.get(key)}`);
+    }
+  });
+
+  const fetchOptions = {
+    method: req.method,
+    headers: {
+      'X-Requested-With': 'XMLHttpRequest',
+      'X-CSRFToken': `${req.headers.get('x-csrftoken')}`,
+      'x-currency': `${req.headers.get('x-currency')}`,
+      'Accept-Language': `${req.headers.get('Accept-Language')}`,
+      'User-Agent': `${req.headers.get('User-Agent')}`,
+      Referer: commerceUrl,
+      Accept: options.accept,
+      Cookie: `${req.headers.get('cookie')}`
+    }
+  } as RequestInit;
+
+  if (options.contentType) {
+    fetchOptions.headers['Content-Type'] = options.contentType;
+  }
+
+  if (req.method !== 'GET') {
+    const formData = new URLSearchParams();
+    let body = {};
+
+    try {
+      body = await req.json();
+    } catch (error) {
+      console.log(error);
+    }
+
+    Object.keys(body ?? {}).forEach((key) => {
+      if (body[key]) {
+        formData.append(key, body[key]);
+      }
+    });
+
+    fetchOptions.body = !options.useFormData ? JSON.stringify(body) : formData;
+  }
+
+  let url = `${commerceUrl}/${slug.replace(/,/g, '/')}`;
+
+  if (options.useTrailingSlash) {
+    url += '/';
+  }
+
+  if (urlSearchParams.toString().length) {
+    url += `?${urlSearchParams.toString()}`;
+  }
+
+  try {
+    const request = await fetch(url, fetchOptions);
+    let response = {} as any;
+
+    try {
+      response = await (options.responseType === 'text'
+        ? request.text()
+        : request.json());
+    } catch (error) {
+      logger.error(
+        `Client Proxy Request - Error while parsing response body to ${options.responseType}`,
+        {
+          url,
+          status: request.status,
+          fetchOptions: JSON.stringify(fetchOptions),
+          error
+        }
+      );
+    }
+
+    const setCookieHeader = request.headers.get('set-cookie');
+    const responseHeaders: any = {};
+
+    if (setCookieHeader) {
+      responseHeaders['set-cookie'] = setCookieHeader;
+    }
+
+    const statusCode = new RegExp(/^20./).test(request.status.toString())
+      ? 200
+      : request.status;
+
+    return NextResponse.json(
+      options.responseType === 'text' ? { result: response } : response,
+      { status: statusCode, headers: responseHeaders }
+    );
+  } catch (error) {
+    logger.error('Client proxy request failed', error);
+
+    return NextResponse.json({ error }, { status: 500 });
+  }
+}
+
+export async function GET(...args) {
+  return proxyRequest(...args);
+}
+
+export async function POST(...args) {
+  return proxyRequest(...args);
+}
+
+export async function PUT(...args) {
+  return proxyRequest(...args);
+}
+
+export async function PATCH(...args) {
+  return proxyRequest(...args);
+}
+
+export async function DELETE(...args) {
+  return proxyRequest(...args);
+}
+
+export async function HEAD(...args) {
+  return proxyRequest(...args);
+}

package/api/logout.ts

@@ -0,0 +1,42 @@
+import { URLS } from '../data/urls';
+import { NextResponse } from 'next/server';
+
+export async function POST(req: Request) {
+  const regexText1 = /name=['|"]csrfmiddlewaretoken['|"] value=['|"]\w+/gi;
+  const regexText2 = /name=['|"]csrfmiddlewaretoken['|"] value=['|"]/gi;
+  let sessionCookie;
+
+  if (req.headers.get('osessionid')) {
+    sessionCookie = `osessionid=${req.headers.get('osessionid')}`;
+  }
+
+  const requestLogoutStep1 = await fetch(URLS.user.logout, {
+    method: 'POST',
+    headers: {
+      Cookie: `${sessionCookie}`
+    }
+  });
+
+  const responseHtml = await requestLogoutStep1.text();
+  const csrfTokenMatch = responseHtml.match(regexText1);
+  const csrfToken = csrfTokenMatch?.[0].replace(regexText2, '') || '';
+  const formData = new URLSearchParams();
+
+  formData.append('csrfmiddlewaretoken', csrfToken);
+
+  try {
+    const requestLogoutStep2 = await fetch(URLS.user.logout, {
+      method: 'POST',
+      headers: {
+        Cookie: `csrftoken=${csrfToken}; ${sessionCookie}`
+      },
+      body: formData
+    });
+
+    return NextResponse.json(requestLogoutStep2, {
+      status: requestLogoutStep2.status
+    });
+  } catch (error) {
+    return NextResponse.json(error, { status: 500 });
+  }
+}

package/assets/styles/index.scss

@@ -0,0 +1,24 @@
+.checkout-payment-iframe-wrapper {
+	iframe {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		border: none;
+		z-index: 1000;
+		background-color: white;
+	}
+
+	.close-button {
+		position: fixed;
+		top: 16px;
+		right: 16px;
+		width: 32px;
+		height: 32px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		z-index: 1001;
+	}
+}

package/bin/pz-install-plugins.js

@@ -0,0 +1,33 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+const rootDir = path.resolve(process.cwd());
+const spawn = require('cross-spawn');
+const availablePlugins = require('../plugins');
+
+let plugins;
+
+try {
+  plugins = require(path.resolve(rootDir, './src/plugins.js'));
+} catch (error) {}
+
+let installCmd = [];
+
+availablePlugins
+  .filter((p) => plugins.includes(p))
+  .forEach((name) => {
+    installCmd.push(`git+https://bitbucket.org/akinonteam/${name}`);
+  });
+
+spawn.sync('yarn', ['cache clean']);
+spawn.sync('yarn', ['remove', ...availablePlugins]);
+
+if (
+  installCmd.length > 0 &&
+  !fs.existsSync(path.resolve(rootDir, '../../turbo.json'))
+) {
+  spawn.sync('yarn', ['add', ...installCmd, '--ignore-scripts'], {
+    stdio: 'inherit'
+  });
+}

package/components/client-root.tsx

@@ -0,0 +1,69 @@
+'use client';
+
+import { usePathname } from 'next/navigation';
+import { useEffect } from 'react';
+import { api } from '../data/client/api';
+import {
+  useClearBasketMutation,
+  useGetBasketQuery
+} from '../data/client/basket';
+import { useAppDispatch, useAppSelector } from '../redux/hooks';
+import { getCookie, removeCookie } from '../utils';
+import { useRouter } from '../hooks';
+
+export default function ClientRoot({
+  children,
+  sessionId
+}: {
+  children: React.ReactNode;
+  sessionId?: string;
+}) {
+  const dispatch = useAppDispatch();
+  const pathname = usePathname();
+  const router = useRouter();
+  const { isMobileApp } = useAppSelector((state) => state.root);
+  const { data: basketData } = useGetBasketQuery();
+  const [clearBasket] = useClearBasketMutation();
+  const resetClientCache = getCookie('pz-reset-client-cache') === 'true';
+  const resetBasket = getCookie('pz-reset-basket') === 'true';
+
+  useEffect(() => {
+    if (basketData?.basketitem_set.length) {
+      dispatch(
+        api.util.invalidateTags([
+          'Checkout',
+          'Product',
+          'Addresses',
+          'Favorite',
+          'Basket'
+        ])
+      );
+
+      if (resetBasket) {
+        clearBasket();
+      }
+    }
+
+    removeCookie('pz-reset-basket');
+  }, [resetBasket]);
+
+  useEffect(() => {
+    if (resetClientCache) {
+      removeCookie('pz-reset-client-cache');
+      location.reload();
+    }
+  }, [resetClientCache]);
+
+  if (isMobileApp && pathname.includes('/orders/completed')) {
+    ((window.parent || window) as any)?.ReactNativeWebView?.postMessage?.(
+      JSON.stringify({
+        url: pathname,
+        sessionId
+      })
+    );
+
+    return null;
+  }
+
+  return <>{children}</>;
+}