@akinon/next 1.62.0 → 1.64.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @akinon/next
 
+## 1.64.0
+
+### Minor Changes
+
+- c53ea3e: ZERO-2609: Reset additional form fields when selectedFormType is not company
+- d3474c6: ZERO-2655: Add data source shipping option
+
+## 1.63.0
+
+### Minor Changes
+
+- a4c8d6a: ZERO-2663: Fix the image url for gif and svgs and return them without options
+- fda5b92: ZERO-2725: fix invalid import
+- 0d3a913: ZERO-2725: Update decimal scale in Price component
+- c45b62c: ZERO-2818: Add upload and download support for b2b package
+- d409996: ZERO-2781: Refactor buildClientRequestUrl function to support caching and options
+- dcc8a15: ZERO-2694: added build step to RC branch pipeline
+
 ## 1.62.0
 
 ### Minor Changes

package/components/price.tsx

@@ -1,11 +1,13 @@
 import { useMemo } from 'react';
-import NumberFormat, { NumberFormatProps } from 'react-number-format';
+// @ts-ignore
+import { NumericFormat, NumericFormatProps } from 'react-number-format';
 import { getCurrency } from '@akinon/next/utils';
 
 import { useLocalization } from '@akinon/next/hooks';
 import { PriceProps } from '../types';
+import Settings from 'settings';
 
-export const Price = (props: NumberFormatProps & PriceProps) => {
+export const Price = (props: NumericFormatProps & PriceProps) => {
   const {
     value,
     currencyCode,
@@ -27,6 +29,10 @@ export const Price = (props: NumberFormatProps & PriceProps) => {
   // TODO: This is very bad practice. It broke decimalScale.
   const _value = value?.toString().replace('.', ',');
 
+  const currentCurrencyDecimalScale = Settings.localization.currencies.find(
+    (currency) => currency.code === currencyCode_
+  ).decimalScale;
+
   const currency = useMemo(
     () =>
       getCurrency({
@@ -39,14 +45,14 @@ export const Price = (props: NumberFormatProps & PriceProps) => {
   );
 
   return (
-    <NumberFormat
+    <NumericFormat
       value={useNegative ? `-${useNegativeSpace}${_value}` : _value}
       {...{
         [useCurrencyAfterPrice ? 'suffix' : 'prefix']: currency
       }}
       displayType={displayType}
       thousandSeparator={thousandSeparator}
-      decimalScale={decimalScale}
+      decimalScale={currentCurrencyDecimalScale ?? decimalScale}
       decimalSeparator={decimalSeparator}
       fixedDecimalScale={fixedDecimalScale}
       {...rest}

package/data/client/b2b.ts

@@ -12,7 +12,9 @@ import {
   SaveBasketParams,
   UpdateProductParams,
   DeleteProductParams,
-  CreateQuotationParams
+  CreateQuotationParams,
+  BasketStatusResponse,
+  ExportBasketResponse
 } from '../../types';
 
 const b2bApi = api.injectEndpoints({
@@ -89,6 +91,34 @@ const b2bApi = api.injectEndpoints({
       }),
       invalidatesTags: ['BasketB2b', 'DraftsB2b']
     }),
+    exportBasket: build.mutation<ExportBasketResponse, string>({
+      query: (queryString) => {
+        return {
+          url: buildClientRequestUrl(b2b.basketExport(queryString)),
+          method: 'GET'
+        };
+      }
+    }),
+    getBasketStatus: build.mutation<BasketStatusResponse, string>({
+      query: (cacheKey) => {
+        return {
+          url: buildClientRequestUrl(b2b.statusBasket(cacheKey)),
+          method: 'GET'
+        };
+      }
+    }),
+    uploadFile: build.mutation<void, FormData>({
+      query: (body) => {
+        return {
+          url: buildClientRequestUrl(b2b.basketImport, {
+            useFormData: true
+          }),
+          method: 'POST',
+          body
+        };
+      },
+      invalidatesTags: ['BasketB2b']
+    })
   }),
   overrideExisting: true
 });
@@ -102,5 +132,8 @@ export const {
   useLoadBasketMutation,
   useUpdateProductMutation,
   useDeleteProductMutation,
-  useCreateQuotationMutation
+  useCreateQuotationMutation,
+  useGetBasketStatusMutation,
+  useExportBasketMutation,
+  useUploadFileMutation
 } = b2bApi;

package/data/client/checkout.ts

@@ -380,6 +380,22 @@ export const checkoutApi = api.injectEndpoints({
         dispatch(setShippingStepBusy(false));
       }
     }),
+    setDataSourceShippingOptions: build.mutation<CheckoutResponse, number[]>({
+      query: (pks) => ({
+        url: buildClientRequestUrl(checkout.setDataSourceShippingOption, {
+          useFormData: true
+        }),
+        method: 'POST',
+        body: {
+          data_source_shipping_options: JSON.stringify(pks)
+        }
+      }),
+      async onQueryStarted(arg, { dispatch, queryFulfilled }) {
+        dispatch(setShippingStepBusy(true));
+        await queryFulfilled;
+        dispatch(setShippingStepBusy(false));
+      }
+    }),
     setRetailStore: build.mutation<CheckoutResponse, SetRetailStoreParams>({
       query: ({ retailStorePk, billingAddressPk }) => ({
         url: buildClientRequestUrl(
@@ -712,6 +728,7 @@ export const {
   useSetDeliveryOptionMutation,
   useSetAddressesMutation,
   useSetShippingOptionMutation,
+  useSetDataSourceShippingOptionsMutation,
   useSetPaymentOptionMutation,
   useSetBinNumberMutation,
   useSetInstallmentOptionMutation,

package/data/urls.ts

@@ -83,6 +83,8 @@ export const checkout = {
   setDeliveryOption: '/orders/checkout/?page=DeliveryOptionSelectionPage',
   setAddresses: '/orders/checkout/?page=AddressSelectionPage',
   setShippingOption: '/orders/checkout/?page=ShippingOptionSelectionPage',
+  setDataSourceShippingOption:
+    '/orders/checkout/?page=DataSourceShippingOptionSelectionPage',
   setPaymentOption: '/orders/checkout/?page=PaymentOptionSelectionPage',
   setBinNumber: '/orders/checkout/?page=BinNumberPage',
   setMasterpassBinNumber: '/orders/checkout/?page=MasterpassBinNumberPage',
@@ -199,7 +201,10 @@ export const b2b = {
   draftBaskets: '/b2b/basket/drafts/',
   divisions: '/b2b/my-divisions/',
   myQuotations: '/b2b/my-quotations/',
-  loadBasket: (id) => `/b2b/basket/${id}/load/`
+  loadBasket: (id) => `/b2b/basket/${id}/load/`,
+  statusBasket: (cacheKey) => `/b2b/basket/?status_cache_key=${cacheKey}`,
+  basketExport: (queryString) => `/b2b/basket/?upload=true&${queryString}`,
+  basketImport: '/b2b/basket/bulk-import/'
 };
 
 export const widgets = {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@akinon/next",
   "description": "Core package for Project Zero Next",
-  "version": "1.62.0",
+  "version": "1.64.0",
   "private": false,
   "license": "MIT",
   "bin": {
@@ -30,7 +30,7 @@
     "set-cookie-parser": "2.6.0"
   },
   "devDependencies": {
-    "@akinon/eslint-plugin-projectzero": "1.62.0",
+    "@akinon/eslint-plugin-projectzero": "1.64.0",
     "@types/react-redux": "7.1.30",
     "@types/set-cookie-parser": "2.4.7",
     "@typescript-eslint/eslint-plugin": "6.7.4",

package/redux/middlewares/checkout.ts

@@ -16,6 +16,7 @@ import {
   setPreOrder,
   setRetailStores,
   setShippingOptions,
+  setDataSourceShippingOptions,
   setShippingStepCompleted,
   setCreditPaymentOptions
 } from '../../redux/reducers/checkout';
@@ -73,6 +74,7 @@ export const preOrderMiddleware: Middleware = ({
       deliveryOptions,
       addressList: addresses,
       shippingOptions,
+      dataSourceShippingOptions,
       paymentOptions,
       installmentOptions
     } = getState().checkout;
@@ -126,6 +128,22 @@ export const preOrderMiddleware: Middleware = ({
       dispatch(apiEndpoints.setShippingOption.initiate(shippingOptions[0].pk));
     }
 
+    if (
+      dataSourceShippingOptions.length > 0 &&
+      !preOrder.data_source_shipping_options
+    ) {
+      const selectedDataSourceShippingOptionsPks =
+        dataSourceShippingOptions.map(
+          (opt) => opt.data_source_shipping_options[0].pk
+        );
+
+      dispatch(
+        apiEndpoints.setDataSourceShippingOptions.initiate(
+          selectedDataSourceShippingOptionsPks
+        )
+      );
+    }
+
     if (!preOrder.payment_option && paymentOptions.length > 0) {
       dispatch(apiEndpoints.setPaymentOption.initiate(paymentOptions[0].pk));
     }
@@ -164,7 +182,6 @@ export const contextListMiddleware: Middleware = ({
     if (result?.payload?.context_list) {
       result.payload.context_list.forEach((context) => {
         const redirectUrl = context.page_context.redirect_url;
-
         if (redirectUrl) {
           const currentLocale = getCookie('pz-locale');
 
@@ -221,6 +238,12 @@ export const contextListMiddleware: Middleware = ({
           dispatch(setShippingOptions(context.page_context.shipping_options));
         }
 
+        if (context.page_context.data_sources) {
+          dispatch(
+            setDataSourceShippingOptions(context.page_context.data_sources)
+          );
+        }
+
         if (context.page_context.payment_options) {
           dispatch(setPaymentOptions(context.page_context.payment_options));
         }

package/redux/reducers/checkout.ts

@@ -14,7 +14,8 @@ import {
   CheckoutCreditPaymentOption,
   PreOrder,
   RetailStore,
-  ShippingOption
+  ShippingOption,
+  DataSource
 } from '../../types';
 
 export interface CheckoutState {
@@ -36,6 +37,7 @@ export interface CheckoutState {
   addressList: Address[];
   deliveryOptions: DeliveryOption[];
   shippingOptions: ShippingOption[];
+  dataSourceShippingOptions: DataSource[];
   paymentOptions: PaymentOption[];
   creditPaymentOptions: CheckoutCreditPaymentOption[];
   selectedCreditPaymentPk: number;
@@ -67,6 +69,7 @@ const initialState: CheckoutState = {
   addressList: [],
   deliveryOptions: [],
   shippingOptions: [],
+  dataSourceShippingOptions: [],
   paymentOptions: [],
   creditPaymentOptions: [],
   selectedCreditPaymentPk: null,
@@ -121,6 +124,9 @@ const checkoutSlice = createSlice({
     setShippingOptions(state, { payload }) {
       state.shippingOptions = payload;
     },
+    setDataSourceShippingOptions(state, { payload }) {
+      state.dataSourceShippingOptions = payload;
+    },
     setPaymentOptions(state, { payload }) {
       state.paymentOptions = payload;
     },
@@ -168,6 +174,7 @@ export const {
   setAddressList,
   setDeliveryOptions,
   setShippingOptions,
+  setDataSourceShippingOptions,
   setPaymentOptions,
   setCreditPaymentOptions,
   setSelectedCreditPaymentPk,

package/types/commerce/address.ts

@@ -17,7 +17,7 @@ export type AddressFormType = {
   line: string;
   postcode: string;
   company_name?: string;
-  tax_no?: number;
+  tax_no?: string;
   tax_office?: string;
   e_bill_taxpayer?: boolean;
   country_code?: string;

package/types/commerce/b2b.ts

@@ -72,7 +72,7 @@ export type BasketItemType = {
   divisions: BasketItemDivision[];
   product: ProductB2b;
   product_remote_id: number;
-}
+};
 
 export type BasketParams = {
   division: string;
@@ -91,7 +91,7 @@ export type CreateQuotationParams = {
 export type UpdateProductParams = {
   product_remote_id: number;
   division: number;
-  quantity: number
+  quantity: number;
 };
 
 export type DeleteProductParams = {
@@ -115,3 +115,13 @@ export type DraftResponse = {
   total_amount: number;
   total_quantity: number;
 };
+
+export type BasketStatusResponse = {
+  is_ready: boolean;
+  status: string;
+  url: string;
+};
+
+export type ExportBasketResponse = {
+  cache_key: string;
+};

package/types/commerce/checkout.ts

@@ -34,6 +34,23 @@ export interface ShippingOption {
   slug: string;
 }
 
+export interface DataSource {
+  pk: number;
+  name: string;
+  data_source_shipping_options: DataSourceShippingOption[];
+}
+
+export interface DataSourceShippingOption {
+  pk: number;
+  shipping_amount: string;
+  shipping_option_name: string;
+  shipping_option_logo: string | null;
+  data_source: {
+    pk: number;
+    title: string | null;
+  };
+}
+
 export interface CheckoutAddressType {
   label: string;
   text: string;
@@ -79,6 +96,7 @@ export interface PreOrder {
   retail_store?: RetailStore;
   gift_box?: GiftBox;
   credit_payment_option?: CheckoutCreditPaymentOption;
+  data_source_shipping_options: any;
   bags?: Product[];
   bags_fee?: string;
   extra_field?: ExtraField;

package/types/index.ts

@@ -68,6 +68,13 @@ export interface Currency {
    * @see https://en.wikipedia.org/wiki/ISO_4217
    */
   code: string;
+  /**
+   * Number of decimal places to display.
+   *
+   * @example
+   * decimalScale: 3
+   */
+  decimalScale?: number;
 }
 
 export interface Settings {

package/utils/index.ts

@@ -63,18 +63,33 @@ export function getTranslateFn(path: string, translations: any) {
 
 export function buildClientRequestUrl(
   path: string,
-  options?: ClientRequestOptions
+  options?: ClientRequestOptions & { cache?: boolean }
 ) {
   let url = `/api/client${path}`;
 
+  let hasQuery = url.includes('?');
+
   if (options) {
-    if (url.includes('?')) {
-      url += '&';
-    } else {
-      url += '?';
+    const { cache, ...otherOptions } = options;
+
+    if (Object.keys(otherOptions).length > 0) {
+      if (hasQuery) {
+        url += '&';
+      } else {
+        url += '?';
+        hasQuery = true;
+      }
+      url += `options=${encodeURIComponent(JSON.stringify(otherOptions))}`;
     }
 
-    url += `options=${encodeURIComponent(JSON.stringify(options))}`;
+    if (cache === false) {
+      if (hasQuery) {
+        url += '&';
+      } else {
+        url += '?';
+      }
+      url += `t=${Date.now()}`;
+    }
   }
 
   return url;
@@ -102,6 +117,12 @@ export function buildCDNUrl(url: string, config?: CDNOptions) {
     ''
   );
 
+  const noOptionFileExtension = url?.split('.').pop()?.toLowerCase() ?? '';
+
+  if (noOptionFileExtension === 'svg' || noOptionFileExtension === 'gif') {
+    return url;
+  }
+
   let options = '';
 
   if (config) {