@infosoftas/s4-orders-js-sdk 0.1.9 → 0.1.10

package/README.md

@@ -75,6 +75,7 @@ type ConfigType = {
     moduleTitle?: string;
     submitStartCallback?: (subscriberId: string) => void;
     userActionCallback?: (action: UserActionEnum, args: object | null | undefined) => void;
+    setContactCallback?: (contactInfo: contactRequestType) => void;
     apiKey: string;
     apiUrl: string;
     templatePackageId: string;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@infosoftas/s4-orders-js-sdk",
-    "version": "0.1.9",
+    "version": "0.1.10",
     "scripts": {
         "build": "rimraf lib && webpack --mode production",
         "release": "release-it"
@@ -34,7 +34,7 @@
         "style-loader": "^4.0.0",
         "ts-loader": "^9.5.4",
         "typescript": "^5.9.3",
-        "webpack": "^5.103.0",
+        "webpack": "^5.105.2",
         "webpack-cli": "^6.0.1"
     },
     "publishConfig": {

package/src/App.tsx

@@ -110,8 +110,13 @@ const App: FC<ConfigType> = ({
         try {
             // There is no way to detect the difference between "cancelled" and "accepted" payment for Vipps via UI
             // Completing an order for cancelled payment is fine. The backend handles it correctly.
-
-            await orderComplete(orderId || data.orderId || '');
+            await orderComplete(orderId || data.orderId || '',
+                userId && identityProviderId
+                    ? {
+                        userId,
+                        identityProviderId,
+                    }
+                    : undefined);
             setIsConfirmed(true);
             setLoading(false);
             if (window === top) {

package/src/api/OrdersApi.ts

@@ -13,6 +13,11 @@ type RequestOrderStartType = {
     orderReference?: string;
 };
 
+type OrderCompleteRequestType = { 
+    userId: string; 
+    identityProviderId: string;
+};
+
 type OrderResponseType = {
     terminalRedirectUrl: string;
     id: string;
@@ -31,15 +36,15 @@ export const orderStart = (
         body,
     }) as Promise<OrderResponseType>;
 
-export const orderComplete = (id: string): Promise<OrderResponseType> =>
-    fetcher<OrderResponseType, null>({
+export const orderComplete = (id: string, body?: OrderCompleteRequestType): Promise<OrderResponseType> =>
+    fetcher<OrderResponseType, OrderCompleteRequestType | null>({
         method: 'POST',
         url: `/order/${id}/complete`,
         headers: {
             'S4-ORDERS-API-KEY':
                 sessionStorage.getItem('sdk_api_key') || '',
         },
-        body: null,
+        body: body || null,
     }) as Promise<OrderResponseType>;
 
 export const orderDelete = (id: string): Promise<OrderResponseType> =>

package/src/api/SubscribeApi.ts

@@ -5,15 +5,6 @@ type CreateSubscriberResponseType = {
     id: string;
 };
 
-type MapSubscriberToUserRequestType = {
-    identityProviderId: string;
-    userId: string;
-};
-
-type MapSubscriberToUserResponseType = {
-    id: string;
-};
-
 export const createSubscriber = (
     body: CreateSubscriberRequestType
 ): Promise<CreateSubscriberResponseType> =>
@@ -26,17 +17,3 @@ export const createSubscriber = (
         },
         body,
     }) as Promise<CreateSubscriberResponseType>;
-
-export const mapSubscriberToUser = (
-    id: string,
-    body: MapSubscriberToUserRequestType
-): Promise<MapSubscriberToUserResponseType> =>
-    fetcher<MapSubscriberToUserResponseType, MapSubscriberToUserRequestType>({
-        method: 'POST',
-        url: `/subscriber/${id}/user`,
-        headers: {
-            'S4-ORDERS-API-KEY':
-                sessionStorage.getItem('sdk_api_key') || '',
-        },
-        body,
-    }) as Promise<MapSubscriberToUserResponseType>;

package/src/components/OrderForm/OrderForm.tsx

@@ -1,4 +1,4 @@
-import { FC, ChangeEvent, Suspense, useState, useMemo } from 'react';
+import { FC, ChangeEvent, Suspense, useState, useMemo, useEffect } from 'react';
 import { FormProvider, useForm, SubmitHandler } from 'react-hook-form';
 
 import { PaymentMethodEnum, UserActionEnum } from '../../enums/general';
@@ -148,6 +148,12 @@ const OrderForm: FC<Props> = ({
         formState: { errors },
     } = methods;
 
+    useEffect(() => {
+        userActionCallback?.(UserActionEnum.SELECT_PAYMENT_METHOD, {
+            paymentMethod: methods.getValues('paymentMethod'),
+        });
+    }, []);
+
     const invoiceAddressToggle = watch('invoiceAddressSelection');
     const paymentMethodInput = watch('paymentMethod');
 

package/src/hooks/useOrderForm.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { SubmitHandler } from 'react-hook-form';
 
-import { createSubscriber, mapSubscriberToUser } from '../api/SubscribeApi';
+import { createSubscriber } from '../api/SubscribeApi';
 import { orderStart } from '../api/OrdersApi';
 import { invoiceLookup } from '../api/InvoiceApi';
 import { InvoiceLookupNetworkEnum, PaymentMethodEnum, UserActionEnum } from '../enums/general';
@@ -130,22 +130,12 @@ const useOrderForm = ({
                         data.paymentMethod === PaymentMethodEnum.OIO
                             ? data?.cvr
                             : data.organizationNumber || undefined,
+                    ...(userId &&
+                        identityProviderId && { userId, identityProviderId }),
                 });
                 id = response.id;
 
                 sessionStorage.setItem('subscriberId', id); // For avoiding attempt of creating subscriber again
-
-                if (userId && identityProviderId) {
-                    const mapResponse = await mapSubscriberToUser(id, {
-                        userId: userId,
-                        identityProviderId: identityProviderId,
-                    });
-
-                    if (!mapResponse.id) {
-                        setErrorsMsg([WRONG_MSG]);
-                        return;
-                    }
-                }
             }
 
             if (setContactCallback) {

package/src/index.tsx

@@ -2,7 +2,7 @@ import { createRoot, Root } from 'react-dom/client';
 import { createElement } from 'react';
 
 import { ConfigType } from './types/general';
-import { createSubscriber, mapSubscriberToUser } from './api/SubscribeApi';
+import { createSubscriber } from './api/SubscribeApi';
 import App from './App';
 
 export const orderComponent = {
@@ -28,5 +28,4 @@ export const orderComponent = {
         (orderComponent.root as Root)?.unmount();
     },
     createSubscriber,
-    mapSubscriberToUser,
 };

package/src/types/api.ts

@@ -23,4 +23,6 @@ export type CreateSubscriberRequestType = {
     buyerReference?: string;
     gln?: string;
     organizationNumber?: string;
+    identityProviderId?: string;
+    userId?: string;
 };