@akinon/pz-tabby-extension 1.66.0 → 1.68.0

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @akinon/pz-tabby-extension
 
+## 1.68.0
+
+### Minor Changes
+
+- 907813c: ZERO-2934: add payment-gateway/<gateway> redirect in middleware
+- 82cf1e5: ZERO-2934: return empty when sessionId or currency null
+- fa4c716: ZERO-2934: add accept-language headers
+- 2eba2a8: ZERO-2934: fix zip code
+
+## 1.67.0
+
 ## 1.66.0
 
 ## 1.65.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akinon/pz-tabby-extension",
-  "version": "1.66.0",
+  "version": "1.68.0",
   "license": "MIT",
   "main": "src/index.tsx",
   "peerDependencies": {

package/readme.md

@@ -31,20 +31,23 @@ Once the extension is installed, you can easily integrate the Tabby payment gate
 ```jsx
 import { TabbyPaymentGateway } from '@akinon/pz-tabby-extension';
 
-const TabbyGateway = ({
+const TabbyGateway = async ({
   searchParams: { sessionId },
-  params: { currency }
+  params: { currency, locale }
 }: {
   searchParams: Record<string, string>;
-  params: { currency: string };
-}) => (
-  <TabbyPaymentGateway
-    currency={currency}
-    extensionUrl={process.env.TABBY_EXTENSION_URL}
-    hashKey={process.env.TABBY_HASH_KEY}
-    sessionId={sessionId}
-  />
-);
+  params: { currency: string; locale: string };
+}) => {
+  return (
+    <TabbyPaymentGateway
+      sessionId={sessionId}
+      currency={currency}
+      locale={locale}
+      extensionUrl={process.env.TABBY_EXTENSION_URL}
+      hashKey={process.env.TABBY_HASH_KEY}
+    />
+  );
+};
 
 export default TabbyGateway;
 ```

package/src/components/FormComponent.tsx

@@ -4,16 +4,12 @@ import { cookies } from 'next/headers';
 type FormComponentProps = {
   extensionUrl: string;
   sessionId: string;
-  hash: string;
-  salt: string;
   context: any;
 };
 
 const FormComponent = ({
   extensionUrl,
   sessionId,
-  hash,
-  salt,
   context
 }: FormComponentProps) => {
   const nextCookies = cookies();
@@ -32,8 +28,6 @@ const FormComponent = ({
       id="tabby-extension-form"
     >
       <input type="hidden" name="csrf_token" value={csrfToken} />
-      <input type="hidden" name="hash" value={hash} />
-      <input type="hidden" name="salt" value={salt} />
       <input type="hidden" name="data" value={JSON.stringify(context)} />
 
       <script

package/src/pages/TabbyPaymentGateway.tsx

@@ -1,7 +1,7 @@
+import React from 'react';
 import { URLS } from '@akinon/next/data/urls';
 import settings from 'settings';
 import { cookies } from 'next/headers';
-import React from 'react';
 import FormComponent from '../components/FormComponent';
 import {
   fetchData,
@@ -14,6 +14,7 @@ import {
 type TabbyPaymentGatewayProps = {
   sessionId: string;
   currency: string;
+  locale: string;
   extensionUrl: string;
   hashKey: string;
 };
@@ -21,16 +22,26 @@ type TabbyPaymentGatewayProps = {
 export const TabbyPaymentGateway = async ({
   sessionId,
   currency,
+  locale,
   extensionUrl,
   hashKey
 }: TabbyPaymentGatewayProps) => {
+  if (!sessionId || !currency || !locale) {
+    return <></>;
+  }
+
   const nextCookies = cookies();
 
+  const language = settings.localization.locales.find(
+    (item) => item.value === locale
+  ).apiValue;
+
   const requestHeaders = {
     Cookie: `osessionid=${nextCookies.get('osessionid')?.value}`,
     'Content-Type': 'application/json',
-    'x-currency': currency,
-    'X-Requested-With': 'XMLHttpRequest'
+    'X-Currency': currency,
+    'X-Requested-With': 'XMLHttpRequest',
+    'Accept-Language': language
   };
 
   const [preOrder, userProfile, successOrders, orderHistory, wishlist] =
@@ -57,7 +68,7 @@ export const TabbyPaymentGateway = async ({
     shipping_address: {
       city: preOrder.pre_order.shipping_address.city.name,
       address: preOrder.pre_order.shipping_address.line,
-      zip: preOrder.pre_order.shipping_address.postcode
+      zip: preOrder.pre_order.shipping_address.postcode ?? '0'
     },
     order_items: preOrder.pre_order.basket.basketitem_set.map((item: any) => ({
       unit_price: item.unit_price,
@@ -86,7 +97,7 @@ export const TabbyPaymentGateway = async ({
       shipping_address: {
         city: order_history.shipping_address.city.name,
         address: order_history.shipping_address.line,
-        zip: order_history.shipping_address.postcode
+        zip: order_history.shipping_address.postcode ?? '0'
       },
       order_items: groupByProductId(order_history.orderitem_set)
     }))
@@ -96,8 +107,6 @@ export const TabbyPaymentGateway = async ({
     <FormComponent
       extensionUrl={extensionUrl}
       sessionId={sessionId}
-      hash={hash}
-      salt={salt}
       context={context}
     />
   );