@infosoftas/s4-orders-js-sdk 0.1.13 → 0.1.15

package/README.md

@@ -133,7 +133,11 @@ type ConfigType = {
         errorValidationBlockingOffersMsg?: string;
         paymentMethodNotAllowedMsg?: string;
         invoiceLookupNotFoundText?: string;
-        termsAndConditionsText?: string;
+        orderDenialOfferBaseText?: string;
+        orderDenialOfferWithFallbackText?: string;
+        orderDenialAmountText?: string;
+        fetchDenialFallbackOffer?: (organizationId: string) => Promise<OrderDenialFallbackOfferType | undefined>;
+        termsAndConditionsText?: string | ReactNode;
     };
 }
 ```

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@infosoftas/s4-orders-js-sdk",
-    "version": "0.1.13",
+    "version": "0.1.15",
     "scripts": {
         "build": "rimraf lib && webpack --mode production",
         "release": "release-it"

package/src/App.tsx

@@ -74,7 +74,6 @@ const App: FC<ConfigType> = ({
             'Hello again!\n\nLooks like you already tried this offer, but we would like to keep you with us.\n\nTherefore we got a new great offer for you:',
         orderDenialAmountText:
             'We are sorry, but you do not meet the requirements for this offer. Please contact customer service for more information.',
-        orderDenialFallbackOffer: undefined,
         paymentMethodNotAllowedMsg: '',
         invoiceLookupNotFoundText:
             'There was no recipient found for the given information',
@@ -399,8 +398,8 @@ const App: FC<ConfigType> = ({
                                 orderDenialAmountText={
                                     settings?.orderDenialAmountText
                                 }
-                                orderDenialFallbackOffer={
-                                    settings?.orderDenialFallbackOffer
+                                fetchDenialFallbackOffer={
+                                    settings?.fetchDenialFallbackOffer
                                 }
                             />
                         )}
@@ -459,8 +458,8 @@ const App: FC<ConfigType> = ({
                                 orderDenialAmountText={
                                     settings?.orderDenialAmountText
                                 }
-                                orderDenialFallbackOffer={
-                                    settings?.orderDenialFallbackOffer
+                                fetchDenialFallbackOffer={
+                                    settings?.fetchDenialFallbackOffer
                                 }
                             />
                         )}
@@ -533,8 +532,8 @@ const App: FC<ConfigType> = ({
                                     orderDenialAmountText={
                                         settings?.orderDenialAmountText
                                     }
-                                    orderDenialFallbackOffer={
-                                        settings?.orderDenialFallbackOffer
+                                    fetchDenialFallbackOffer={
+                                        settings?.fetchDenialFallbackOffer
                                     }
                                     termsAndConditionsText={
                                         settings?.termsAndConditionsText

package/src/components/EHFForm/EHFForm.tsx

@@ -58,7 +58,7 @@ type Props = {
     orderDenialOfferBaseText?: string;
     orderDenialOfferWithFallbackText?: string;
     orderDenialAmountText?: string;
-    orderDenialFallbackOffer?: OrderDenialFallbackOfferType;
+    fetchDenialFallbackOffer?: (organizationId: string) => Promise<OrderDenialFallbackOfferType | undefined>;
 };
 
 type EHFFormInputsType = {
@@ -101,7 +101,7 @@ const EHFForm: FC<Props> = ({
     orderDenialOfferBaseText,
     orderDenialOfferWithFallbackText,
     orderDenialAmountText,
-    orderDenialFallbackOffer,
+    fetchDenialFallbackOffer,
 }) => {
     const methods = useForm<EHFFormInputsType>({
         defaultValues: {
@@ -130,6 +130,7 @@ const EHFForm: FC<Props> = ({
         errorsMsg,
         orderDenialType,
         orderDenialMessage,
+        orderDenialFallbackOffer,
         dismissOrderDenial,
     } = useOrderForm({
         callback,
@@ -156,7 +157,7 @@ const EHFForm: FC<Props> = ({
         orderDenialOfferBaseText,
         orderDenialOfferWithFallbackText,
         orderDenialAmountText,
-        orderDenialFallbackOffer,
+        fetchDenialFallbackOffer,
     });
 
     const onSubmit: SubmitHandler<EHFFormInputsType> = async (

package/src/components/OIOForm/OIOForm.tsx

@@ -59,7 +59,7 @@ type Props = {
     orderDenialOfferBaseText?: string;
     orderDenialOfferWithFallbackText?: string;
     orderDenialAmountText?: string;
-    orderDenialFallbackOffer?: OrderDenialFallbackOfferType;
+    fetchDenialFallbackOffer?: (organizationId: string) => Promise<OrderDenialFallbackOfferType | undefined>;
 };
 
 type OIOFormInputsType = {
@@ -105,7 +105,7 @@ const OIOForm: FC<Props> = ({
     orderDenialOfferBaseText,
     orderDenialOfferWithFallbackText,
     orderDenialAmountText,
-    orderDenialFallbackOffer,
+    fetchDenialFallbackOffer,
 }) => {
     const methods = useForm<OIOFormInputsType>({
         defaultValues: {
@@ -138,6 +138,7 @@ const OIOForm: FC<Props> = ({
         errorsMsg,
         orderDenialType,
         orderDenialMessage,
+        orderDenialFallbackOffer,
         dismissOrderDenial,
     } = useOrderForm({
         callback,
@@ -164,7 +165,7 @@ const OIOForm: FC<Props> = ({
         orderDenialOfferBaseText,
         orderDenialOfferWithFallbackText,
         orderDenialAmountText,
-        orderDenialFallbackOffer,
+        fetchDenialFallbackOffer,
     });
 
     const onSubmit: SubmitHandler<OIOFormInputsType> = async (

package/src/components/OrderDenialModal/OrderDenialModal.tsx

@@ -42,13 +42,11 @@ const OrderDenialModal: FC<Props> = ({
                 aria-modal="true"
                 aria-label="Order denial modal"
             >
-                <p className="sdk-order-denial-modal-text">
-                    {message?.split('\\n').map((line, i, arr) => (
-                        <span key={i}>
-                            {line}
-                            {i < arr.length - 1 && <br />}
-                        </span>
-                    ))}
+                <p
+                    className="sdk-order-denial-modal-text"
+                    style={{ whiteSpace: 'pre-line' }}
+                >
+                    {message?.replace(/\\n/g, '\n')}
                 </p>
                 {offer?.title && offer?.templatePackageId && (
                     <div className="sdk-order-denial-offer-box">

package/src/components/OrderForm/OrderForm.tsx

@@ -76,7 +76,9 @@ type Props = {
     orderDenialOfferBaseText?: string;
     orderDenialOfferWithFallbackText?: string;
     orderDenialAmountText?: string;
-    orderDenialFallbackOffer?: OrderDenialFallbackOfferType;
+    fetchDenialFallbackOffer?: (
+        organizationId: string
+    ) => Promise<OrderDenialFallbackOfferType | undefined>;
     termsAndConditionsText?: string | ReactNode;
 };
 
@@ -127,7 +129,7 @@ const OrderForm: FC<Props> = ({
     orderDenialOfferBaseText,
     orderDenialOfferWithFallbackText,
     orderDenialAmountText,
-    orderDenialFallbackOffer,
+    fetchDenialFallbackOffer,
     requireTermsAcceptance,
     termsAndConditionsText,
 }) => {
@@ -205,6 +207,7 @@ const OrderForm: FC<Props> = ({
         errorsMsg,
         orderDenialType,
         orderDenialMessage,
+        orderDenialFallbackOffer,
         dismissOrderDenial,
     } = useOrderForm({
         callback,
@@ -230,7 +233,7 @@ const OrderForm: FC<Props> = ({
         orderDenialOfferBaseText,
         orderDenialOfferWithFallbackText,
         orderDenialAmountText,
-        orderDenialFallbackOffer,
+        fetchDenialFallbackOffer,
     });
 
     const onSubmit: SubmitHandler<OrderFormInputsType> = async (

package/src/hooks/useOrderForm.tsx

@@ -57,7 +57,9 @@ type Props = {
     orderDenialOfferBaseText?: string;
     orderDenialOfferWithFallbackText?: string;
     orderDenialAmountText?: string;
-    orderDenialFallbackOffer?: OrderDenialFallbackOfferType;
+    fetchDenialFallbackOffer?: (
+        organizationId: string
+    ) => Promise<OrderDenialFallbackOfferType | undefined>;
 };
 
 type DenialErrorType = {
@@ -127,7 +129,7 @@ const useOrderForm = ({
     orderDenialOfferBaseText,
     orderDenialOfferWithFallbackText,
     orderDenialAmountText,
-    orderDenialFallbackOffer,
+    fetchDenialFallbackOffer,
 }: Props) => {
     const [loading, setLoading] = useState<boolean>(false);
     const [apiErrorMsg, setApiErrorMsg] = useState<string>('');
@@ -135,12 +137,16 @@ const useOrderForm = ({
     const [orderDenialType, setOrderDenialType] = useState<
         'offer' | 'amount' | null
     >(null);
+    const [orderDenialFallbackOffer, setOrderDenialFallbackOffer] = useState<
+        OrderDenialFallbackOfferType | undefined
+    >();
     const [submittedOrderData, setSubmittedOrderData] =
         useState<OrderFormInputsType | null>(null);
     const fallbackOfferTemplatePackageIdRef = useRef<string | null>(null);
 
     const dismissOrderDenial = () => {
         setOrderDenialType(null);
+        setOrderDenialFallbackOffer(undefined);
     };
 
     const getOrderDenialMessage = () => {
@@ -311,8 +317,21 @@ const useOrderForm = ({
             if (detectedDenialType) {
                 setApiErrorMsg('');
                 setErrorsMsg([]);
+                setOrderDenialFallbackOffer(undefined);
                 setOrderDenialType(detectedDenialType);
                 callback(null);
+                if (
+                    detectedDenialType === 'offer' &&
+                    fetchDenialFallbackOffer
+                ) {
+                    void fetchDenialFallbackOffer(organizationId)
+                        .then((offer) => {
+                            setOrderDenialFallbackOffer(offer);
+                        })
+                        .catch(() => {
+                            setOrderDenialFallbackOffer(undefined);
+                        });
+                }
                 return;
             }
 
@@ -365,6 +384,7 @@ const useOrderForm = ({
         errorsMsg,
         orderDenialType,
         orderDenialMessage: getOrderDenialMessage(),
+        orderDenialFallbackOffer,
         dismissOrderDenial,
     };
 };

package/src/types/general.ts

@@ -34,6 +34,8 @@ export type ContactRequestType = {
     city?: string;
     zip?: string;
     careOf?: string;
+    organizationNumber?: string;
+    gln?: string;
 };
 
 export type OrderDenialFallbackOfferType = {
@@ -97,7 +99,9 @@ export type ConfigType = {
         orderDenialOfferBaseText?: string;
         orderDenialOfferWithFallbackText?: string;
         orderDenialAmountText?: string;
-        orderDenialFallbackOffer?: OrderDenialFallbackOfferType;
+        fetchDenialFallbackOffer?: (
+            organizationId: string
+        ) => Promise<OrderDenialFallbackOfferType | undefined>;
         termsAndConditionsText?: string | ReactNode;
     };
 };

package/src/utils/order.helper.ts

@@ -112,6 +112,11 @@ export const prepareContactModel = ({
     data,
     orderFields,
 }: ContactModelType) => {
+    const organizationNumber =
+        data.paymentMethod === PaymentMethodEnum.OIO
+            ? data.cvr?.trim() || undefined
+            : data.organizationNumber?.trim() || undefined;
+
     const model = {
         name: orderFields.find((i) => i.name === 'name')
             ? data.name?.trim() || undefined
@@ -143,6 +148,11 @@ export const prepareContactModel = ({
         careOf: orderFields.find((i) => i.name === 'careOf')
             ? data.careOf?.trim() || undefined
             : undefined,
+        organizationNumber,
+        gln:
+            data.paymentMethod === PaymentMethodEnum.OIO
+                ? data.gln?.trim() || undefined
+                : undefined,
     };
 
     return model;