@jetshop/core 5.17.0-alpha.8ede57ab → 5.17.0-alpha.8f38c56f

package/components/Auth/formFieldsFromSettings.d.ts

@@ -0,0 +1,65 @@
+import { CountrySettings } from '@jetshop/core/types';
+import { CustomerField } from '@jetshop/core/types';
+export declare const getFieldType: (name: string) => "text" | "tel" | "email" | "password";
+export declare function formFieldsFromSettings(selectedCountrySettings: CountrySettings, isUserTypeBusiness?: boolean): {
+    allFields: {
+        type: string;
+        id: string;
+        name: string;
+        label: any;
+        __typename?: "CustomerField";
+        required: boolean;
+        pattern?: string;
+        fields?: CustomerField[];
+    }[];
+    billingAddressFields: {
+        label: any;
+        placeholder: string;
+        type: string;
+        __typename?: "CustomerField";
+        id: string;
+        required: boolean;
+        pattern?: string;
+        fields?: CustomerField[];
+        name: string;
+    }[];
+    deliveryAddressFields: {
+        label: any;
+        placeholder: string;
+        type: string;
+        __typename?: "CustomerField";
+        id: string;
+        required: boolean;
+        pattern?: string;
+        fields?: CustomerField[];
+        name: string;
+    }[];
+    loginFields: {
+        type: string;
+        id: string;
+        name: string;
+        label: any;
+        placeholder: any;
+        __typename?: "CustomerField";
+        required: boolean;
+        pattern?: string;
+        fields?: CustomerField[];
+    }[];
+    pidField: {
+        type: string;
+        id: string;
+        name: string;
+        label: any;
+        __typename?: "CustomerField";
+        required: boolean;
+        pattern?: string;
+        fields?: CustomerField[];
+    };
+};
+export declare function createValidatorForFields(fields: CustomerField[], { getFieldName, getFieldValue, customValidation }?: {
+    getFieldName?: (name: string) => string;
+    getFieldValue?: (values: any, fieldName: string) => any;
+    customValidation?: (errors: {
+        [key: string]: any;
+    }, values: any) => any;
+}): (values: any) => any;

package/components/Auth/formFieldsFromSettings.js

@@ -0,0 +1,77 @@
+import { translations } from './signup-field-translations';
+import t from '@jetshop/intl';
+export const getFieldType = (name) => {
+    switch (name) {
+        case 'mobilePhone':
+            return 'tel';
+        case 'emailAddress':
+            return 'email';
+        case 'password':
+            return 'password';
+        default:
+            return 'text';
+    }
+};
+export function formFieldsFromSettings(selectedCountrySettings, isUserTypeBusiness) {
+    const customerFieldsKey = !isUserTypeBusiness
+        ? 'privateCustomerFields'
+        : 'businessCustomerFields';
+    const billingAddress = selectedCountrySettings &&
+        selectedCountrySettings[customerFieldsKey].find((field) => field.name === 'billingAddress');
+    const deliveryAddress = selectedCountrySettings &&
+        selectedCountrySettings[customerFieldsKey].find((field) => field.name === 'deliveryAddress');
+    const billingAddressFields = billingAddress
+        ? billingAddress.fields.map((field) => (Object.assign(Object.assign({}, field), { label: translations[field.name], placeholder: `${translations[field.name]}_placeholder`, type: getFieldType(field.name) })))
+        : [];
+    const deliveryAddressFields = deliveryAddress
+        ? deliveryAddress.fields.map((field) => (Object.assign(Object.assign({}, field), { label: translations[field.name], placeholder: `${translations[field.name]}_placeholder`, type: getFieldType(field.name) })))
+        : [];
+    const emailField = selectedCountrySettings
+        ? selectedCountrySettings[customerFieldsKey].find((field) => field.name === 'emailAddress')
+        : null;
+    const passwordField = selectedCountrySettings
+        ? selectedCountrySettings[customerFieldsKey].find((field) => field.name === 'password')
+        : null;
+    const pid = selectedCountrySettings === null || selectedCountrySettings === void 0 ? void 0 : selectedCountrySettings[customerFieldsKey].find((field) => field.name === 'pid' || field.name === 'organizationNumber');
+    const pidField = Object.assign(Object.assign({}, pid), { type: 'text', id: 'pid', name: isUserTypeBusiness ? 'organizationNumber' : 'pid', label: isUserTypeBusiness
+            ? translations['company_pid']
+            : translations['pid'] });
+    const loginFields = emailField && passwordField
+        ? [
+            Object.assign(Object.assign({}, emailField), { type: getFieldType('emailAddress'), id: 'emailAddress', name: 'emailAddress', label: translations['email'], placeholder: translations['email_placeholder'] }),
+            Object.assign(Object.assign({}, passwordField), { type: getFieldType('password'), id: 'password', name: 'password', label: translations['password'], placeholder: translations['password_placeholder'] })
+        ]
+        : [];
+    const allFields = [...billingAddressFields, ...loginFields, pidField];
+    return {
+        allFields,
+        billingAddressFields,
+        deliveryAddressFields,
+        loginFields,
+        pidField
+    };
+}
+// Create validation based on the rules specified in the CustomerFields from
+// channel settings
+export function createValidatorForFields(fields, { getFieldName = (name) => name, getFieldValue = (values, fieldName) => values[fieldName], customValidation } = {}) {
+    return function validate(values) {
+        const errors = {};
+        fields.forEach((field) => {
+            if (field) {
+                const pattern = field.pattern && new RegExp(unescape(field.pattern));
+                const fieldName = getFieldName(field.name);
+                const value = getFieldValue(values, fieldName);
+                // make sure that pattern is actually a valid regex
+                if (pattern && !pattern.test(value)) {
+                    errors[fieldName] = t('Field does not match required format');
+                }
+                if (field.required && !value) {
+                    errors[fieldName] = t('This field is required');
+                }
+                customValidation && customValidation(errors, values);
+            }
+        });
+        return errors;
+    };
+}
+//# sourceMappingURL=formFieldsFromSettings.js.map

package/components/Auth/formFieldsFromSettings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formFieldsFromSettings.js","sourceRoot":"","sources":["formFieldsFromSettings.tsx"],"names":[],"mappings":"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"}

package/components/Auth/formatSignupInput.d.ts

@@ -0,0 +1,8 @@
+import { SignUpInput } from '@jetshop/core/types';
+export type SignUpFormInput = SignUpInput & {
+    country: string;
+    organizationNumber?: string;
+};
+export declare function formatSignupInput(values: SignUpFormInput, { userType }: {
+    userType: 'COMPANY' | 'PRIVATE';
+}): SignUpInput;

package/components/Auth/formatSignupInput.js

@@ -0,0 +1,43 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+// Map forms to { valuename: { value: "value" } } format required for input
+// e.g. { country: { value: "Sweden" } }
+export function formatSignupInput(values, { userType }) {
+    const { emailAddress, password, pid, organizationNumber, country, externalId = '', externalAttributes = undefined, priceListAccessCode = undefined, dynamicContent = undefined, preferences = undefined, consents = [] } = values, rest = __rest(values, ["emailAddress", "password", "pid", "organizationNumber", "country", "externalId", "externalAttributes", "priceListAccessCode", "dynamicContent", "preferences", "consents"]);
+    // Currently passing through country.code:country.name for the country
+    // selector. This is a hack for now to get the code and name separately.
+    const [countryCode, countryName] = country.split(':');
+    const billingInput = {
+        countryCode: { value: countryCode }
+    };
+    const rawValues = Object.entries(rest);
+    for (const [field, value] of rawValues) {
+        billingInput[field] = {
+            value: field === 'country' ? countryName : value
+        };
+    }
+    return {
+        type: userType,
+        billingAddress: billingInput,
+        emailAddress,
+        password,
+        pid,
+        organizationNumber,
+        priceListAccessCode,
+        externalAttributes,
+        externalId,
+        dynamicContent,
+        preferences,
+        consents
+    };
+}
+//# sourceMappingURL=formatSignupInput.js.map

package/components/Auth/formatSignupInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formatSignupInput.js","sourceRoot":"","sources":["formatSignupInput.ts"],"names":[],"mappings":";;;;;;;;;;;AAOA,2EAA2E;AAC3E,wCAAwC;AACxC,MAAM,UAAU,iBAAiB,CAC/B,MAAuB,EACvB,EAAE,QAAQ,EAAuC;IAEjD,MAAM,EACJ,YAAY,EACZ,QAAQ,EACR,GAAG,EACH,kBAAkB,EAClB,OAAO,EACP,UAAU,GAAG,EAAE,EACf,kBAAkB,GAAG,SAAS,EAC9B,mBAAmB,GAAG,SAAS,EAC/B,cAAc,GAAG,SAAS,EAC1B,WAAW,GAAG,SAAS,EACvB,QAAQ,GAAG,EAAE,KAEX,MAAM,EADL,IAAI,UACL,MAAM,EAbJ,4KAaL,CAAS,CAAC;IAEX,sEAAsE;IACtE,wEAAwE;IACxE,MAAM,CAAC,WAAW,EAAE,WAAW,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAEtD,MAAM,YAAY,GAEd;QACF,WAAW,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE;KACpC,CAAC;IAEF,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAEvC,KAAK,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,IAAI,SAAS,EAAE;QACtC,YAAY,CAAC,KAAK,CAAC,GAAG;YACpB,KAAK,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK;SACjD,CAAC;KACH;IAED,OAAO;QACL,IAAI,EAAE,QAAwB;QAC9B,cAAc,EAAE,YAAY;QAC5B,YAAY;QACZ,QAAQ;QACR,GAAG;QACH,kBAAkB;QAClB,mBAAmB;QACnB,kBAAkB;QAClB,UAAU;QACV,cAAc;QACd,WAAW;QACX,QAAQ;KACT,CAAC;AACJ,CAAC"}

package/components/Auth/signup-context.d.ts

@@ -0,0 +1,36 @@
+import { Country, CustomerField, SignUpInput } from '@jetshop/core/types';
+import * as React from 'react';
+import { FormikProps } from 'formik';
+export interface EnhancedCustomerField extends CustomerField {
+    type: string;
+    label: string;
+    placeholder?: string;
+}
+type ISignupContext = {
+    isUserTypeBusiness: boolean;
+    billingAddressFields: EnhancedCustomerField[];
+    loginFields: EnhancedCustomerField[];
+    allFields: EnhancedCustomerField[];
+    countries: Country[];
+    selectedCountry: Country;
+    setCountry: React.Dispatch<React.SetStateAction<Country>>;
+    loading: boolean;
+} | undefined;
+export declare const SignupContext: React.Context<{
+    isUserTypeBusiness: boolean;
+    billingAddressFields: EnhancedCustomerField[];
+    loginFields: EnhancedCustomerField[];
+    allFields: EnhancedCustomerField[];
+    countries: Country[];
+    selectedCountry: Country;
+    setCountry: React.Dispatch<React.SetStateAction<Country>>;
+    loading: boolean;
+}>;
+declare const SignupProvider: React.FC<{
+    value?: ISignupContext;
+    LoadingComponent?: JSX.Element;
+}>;
+export declare const SignupFormikContext: React.Context<{
+    formik: FormikProps<SignUpInput>;
+}>;
+export default SignupProvider;

package/components/Auth/signup-context.js

@@ -0,0 +1,71 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import ChannelContext from '@jetshop/core/components/ChannelContext';
+import { formFieldsFromSettings } from '@jetshop/core/components/Auth/formFieldsFromSettings';
+import throwErrorInDev from '@jetshop/core/helpers/throwErrorInDev';
+import { useCountrySettings } from '../ChannelContext/useCountrySettings';
+// Holds fields and other API data
+export const SignupContext = React.createContext(undefined);
+const SignupProvider = function SignupContextProvider(_a) {
+    var { LoadingComponent } = _a, props = __rest(_a, ["LoadingComponent"]);
+    // We will use the selectedChannel to build the form to begin with.
+    // However, if the user changes country in the form, we should also change all
+    // of the fields and validation
+    const { selectedChannel } = React.useContext(ChannelContext);
+    const [isUserTypeBusiness, setIsUserTypeBusiness] = React.useState(false);
+    throwErrorInDev(!selectedChannel, 'Must be wrapped in ChannelContext Provider');
+    // Initialise country to the selected channel country. This will be selected
+    // by default in the form, and its settings will be used to build the form
+    // inputs and validation
+    const [country, setCountry] = React.useState(selectedChannel.country);
+    const { countrySettings, loading } = useCountrySettings();
+    const selectedCountrySettings = countrySettings &&
+        countrySettings.find((c) => c.countryCode === country.code);
+    // Get all the billing address fields from the country settings
+    const { allFields, billingAddressFields, loginFields } = !loading
+        ? formFieldsFromSettings(selectedCountrySettings, isUserTypeBusiness)
+        : {
+            allFields: null,
+            billingAddressFields: null,
+            loginFields: null
+        };
+    const value = React.useMemo(() => {
+        return {
+            billingAddressFields,
+            loginFields,
+            allFields,
+            selectedCountry: country,
+            countries: selectedChannel.countries,
+            setCountry,
+            loading,
+            isUserTypeBusiness,
+            setIsUserTypeBusiness
+        };
+    }, [
+        billingAddressFields,
+        loginFields,
+        allFields,
+        country,
+        selectedChannel.countries,
+        loading,
+        isUserTypeBusiness
+    ]);
+    if (loading) {
+        return LoadingComponent || null;
+    }
+    return React.createElement(SignupContext.Provider, Object.assign({ value: value }, props));
+};
+// Holds formik state
+export const SignupFormikContext = React.createContext(undefined);
+export default SignupProvider;
+//# sourceMappingURL=signup-context.js.map

package/components/Auth/signup-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"signup-context.js","sourceRoot":"","sources":["signup-context.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,cAAc,MAAM,yCAAyC,CAAC;AACrE,OAAO,EAAE,sBAAsB,EAAE,MAAM,sDAAsD,CAAC;AAC9F,OAAO,eAAe,MAAM,uCAAuC,CAAC;AAEpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAqB1E,kCAAkC;AAClC,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,CAAC,aAAa,CAAiB,SAAS,CAAC,CAAC;AAE5E,MAAM,cAAc,GAGf,SAAS,qBAAqB,CAAC,EAA8B;QAA9B,EAAE,gBAAgB,OAAY,EAAP,KAAK,cAA5B,oBAA8B,CAAF;IAC9D,mEAAmE;IACnE,8EAA8E;IAC9E,+BAA+B;IAC/B,MAAM,EAAE,eAAe,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IAE7D,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1E,eAAe,CACb,CAAC,eAAe,EAChB,4CAA4C,CAC7C,CAAC;IAEF,4EAA4E;IAC5E,0EAA0E;IAC1E,wBAAwB;IACxB,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;IACtE,MAAM,EAAE,eAAe,EAAE,OAAO,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAC1D,MAAM,uBAAuB,GAC3B,eAAe;QACf,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAE9D,+DAA+D;IAC/D,MAAM,EAAE,SAAS,EAAE,oBAAoB,EAAE,WAAW,EAAE,GAAG,CAAC,OAAO;QAC/D,CAAC,CAAC,sBAAsB,CAAC,uBAAuB,EAAE,kBAAkB,CAAC;QACrE,CAAC,CAAC;YACE,SAAS,EAAE,IAAI;YACf,oBAAoB,EAAE,IAAI;YAC1B,WAAW,EAAE,IAAI;SAClB,CAAC;IAEN,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC/B,OAAO;YACL,oBAAoB;YACpB,WAAW;YACX,SAAS;YACT,eAAe,EAAE,OAAO;YACxB,SAAS,EAAE,eAAe,CAAC,SAAS;YACpC,UAAU;YACV,OAAO;YACP,kBAAkB;YAClB,qBAAqB;SACtB,CAAC;IACJ,CAAC,EAAE;QACD,oBAAoB;QACpB,WAAW;QACX,SAAS;QACT,OAAO;QACP,eAAe,CAAC,SAAS;QACzB,OAAO;QACP,kBAAkB;KACnB,CAAC,CAAC;IAEH,IAAI,OAAO,EAAE;QACX,OAAO,gBAAgB,IAAI,IAAI,CAAC;KACjC;IACD,OAAO,oBAAC,aAAa,CAAC,QAAQ,kBAAC,KAAK,EAAE,KAAK,IAAM,KAAK,EAAI,CAAC;AAC7D,CAAC,CAAC;AAEF,qBAAqB;AACrB,MAAM,CAAC,MAAM,mBAAmB,GAAG,KAAK,CAAC,aAAa,CAEnD,SAAS,CAAC,CAAC;AAEd,eAAe,cAAc,CAAC"}

package/components/Auth/signup-field-translations.d.ts

@@ -0,0 +1,3 @@
+export declare const translations: {
+    [key: string]: any;
+};

package/components/Auth/signup-field-translations.js

@@ -0,0 +1,44 @@
+/* eslint-disable @typescript-eslint/camelcase */
+import t from '@jetshop/intl';
+export const translations = {
+    country: t('Select country'),
+    country_placeholder: t('Select country'),
+    city: t('City'),
+    city_placeholder: t('City'),
+    co: t('Extra address'),
+    co_placeholder: t('Extra address'),
+    companyAtt: t('Company contact name'),
+    companyAtt_placeholder: t('Company contact name'),
+    company: t('Company'),
+    companyName: t('Company'),
+    companyName_placeholder: t('Company'),
+    department: t('Department'),
+    department_placeholder: t('Department'),
+    email: t('E-mail address'),
+    email_placeholder: t('E-mail address'),
+    firstName: t('First name'),
+    firstName_placeholder: t('First name'),
+    lastName: t('Surname'),
+    lastName_placeholder: t('Surname'),
+    mobilePhone: t('Mobile phone number'),
+    mobilePhone_placeholder: t('Mobile phone number'),
+    municipality: t('County'),
+    municipality_placeholder: t('County'),
+    phone: t('Telephone number'),
+    phone_placeholder: t('Telephone number'),
+    organizationNumber: t('Company registration number'),
+    organizationNumber_placeholder: t('Company registration number'),
+    pid: t('National ID/Social Security number'),
+    company_pid: t('Company registration number'),
+    postalCode: t('Post code'),
+    postalCode_placeholder: t('Post code'),
+    region: t('Region'),
+    region_placeholder: t('Region'),
+    streetName: t('Address'),
+    streetName_placeholder: t('Address'),
+    password: t('Desired password'),
+    password_placeholder: t('Desired password'),
+    confirmPassword: t('Repeat desired password'),
+    confirmPassword_placeholder: t('Repeat desired password')
+};
+//# sourceMappingURL=signup-field-translations.js.map

package/components/Auth/signup-field-translations.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"signup-field-translations.js","sourceRoot":"","sources":["signup-field-translations.ts"],"names":[],"mappings":"AAAA,iDAAiD;AACjD,OAAO,CAAC,MAAM,eAAe,CAAC;AAE9B,MAAM,CAAC,MAAM,YAAY,GAA2B;IAClD,OAAO,EAAE,CAAC,CAAC,gBAAgB,CAAC;IAC5B,mBAAmB,EAAE,CAAC,CAAC,gBAAgB,CAAC;IACxC,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC;IACf,gBAAgB,EAAE,CAAC,CAAC,MAAM,CAAC;IAC3B,EAAE,EAAE,CAAC,CAAC,eAAe,CAAC;IACtB,cAAc,EAAE,CAAC,CAAC,eAAe,CAAC;IAClC,UAAU,EAAE,CAAC,CAAC,sBAAsB,CAAC;IACrC,sBAAsB,EAAE,CAAC,CAAC,sBAAsB,CAAC;IACjD,OAAO,EAAE,CAAC,CAAC,SAAS,CAAC;IACrB,WAAW,EAAE,CAAC,CAAC,SAAS,CAAC;IACzB,uBAAuB,EAAE,CAAC,CAAC,SAAS,CAAC;IACrC,UAAU,EAAE,CAAC,CAAC,YAAY,CAAC;IAC3B,sBAAsB,EAAE,CAAC,CAAC,YAAY,CAAC;IACvC,KAAK,EAAE,CAAC,CAAC,gBAAgB,CAAC;IAC1B,iBAAiB,EAAE,CAAC,CAAC,gBAAgB,CAAC;IACtC,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC;IAC1B,qBAAqB,EAAE,CAAC,CAAC,YAAY,CAAC;IACtC,QAAQ,EAAE,CAAC,CAAC,SAAS,CAAC;IACtB,oBAAoB,EAAE,CAAC,CAAC,SAAS,CAAC;IAClC,WAAW,EAAE,CAAC,CAAC,qBAAqB,CAAC;IACrC,uBAAuB,EAAE,CAAC,CAAC,qBAAqB,CAAC;IACjD,YAAY,EAAE,CAAC,CAAC,QAAQ,CAAC;IACzB,wBAAwB,EAAE,CAAC,CAAC,QAAQ,CAAC;IACrC,KAAK,EAAE,CAAC,CAAC,kBAAkB,CAAC;IAC5B,iBAAiB,EAAE,CAAC,CAAC,kBAAkB,CAAC;IACxC,kBAAkB,EAAE,CAAC,CAAC,6BAA6B,CAAC;IACpD,8BAA8B,EAAE,CAAC,CAAC,6BAA6B,CAAC;IAChE,GAAG,EAAE,CAAC,CAAC,oCAAoC,CAAC;IAC5C,WAAW,EAAE,CAAC,CAAC,6BAA6B,CAAC;IAC7C,UAAU,EAAE,CAAC,CAAC,WAAW,CAAC;IAC1B,sBAAsB,EAAE,CAAC,CAAC,WAAW,CAAC;IACtC,MAAM,EAAE,CAAC,CAAC,QAAQ,CAAC;IACnB,kBAAkB,EAAE,CAAC,CAAC,QAAQ,CAAC;IAC/B,UAAU,EAAE,CAAC,CAAC,SAAS,CAAC;IACxB,sBAAsB,EAAE,CAAC,CAAC,SAAS,CAAC;IACpC,QAAQ,EAAE,CAAC,CAAC,kBAAkB,CAAC;IAC/B,oBAAoB,EAAE,CAAC,CAAC,kBAAkB,CAAC;IAC3C,eAAe,EAAE,CAAC,CAAC,yBAAyB,CAAC;IAC7C,2BAA2B,EAAE,CAAC,CAAC,yBAAyB,CAAC;CAC1D,CAAC"}

package/components/Auth/signupSubmit.d.ts

@@ -0,0 +1,6 @@
+import { SignUpFormInput } from '@jetshop/core/components/Auth/formatSignupInput';
+import { FormikHelpers } from 'formik';
+export declare function useSignupSubmit(): ({ values, actions }: {
+    values: SignUpFormInput;
+    actions: FormikHelpers<SignUpFormInput>;
+}) => void;

package/components/Auth/signupSubmit.js

@@ -0,0 +1,57 @@
+import { formatSignupInput } from '@jetshop/core/components/Auth/formatSignupInput';
+import useAuth from '@jetshop/core/components/AuthContext/useAuth';
+import SignupMutation from '@jetshop/core/data/mutations/signup.gql';
+import getErrorDetail from '@jetshop/core/helpers/getErrorDetail';
+import { useApolloClient, useMutation } from '@apollo/client';
+import { useContext } from 'react';
+import { SignupContext } from './signup-context';
+import { trackRegisterEvent } from '../../analytics/tracking';
+import { useTracker } from '../../analytics/Analytics';
+export function useSignupSubmit() {
+    const [mutate] = useMutation(SignupMutation);
+    const client = useApolloClient();
+    const { logIn } = useAuth();
+    const { isUserTypeBusiness } = useContext(SignupContext);
+    const track = useTracker();
+    return function signup({ values, actions }) {
+        // Set the Formik state to submitting…
+        actions.setSubmitting(true);
+        mutate({
+            variables: {
+                input: formatSignupInput(values, {
+                    userType: isUserTypeBusiness ? 'COMPANY' : 'PRIVATE'
+                })
+            }
+        })
+            .then((resp) => {
+            // Submitting is done
+            actions.setSubmitting(false);
+            // Track user register in GTAG
+            track(trackRegisterEvent());
+            // Reset the Apollo store
+            client.resetStore().then(() => {
+                // Log the user in with the token from signup
+                logIn(resp.data.signUp.token.value);
+            });
+        }, (error) => {
+            const errorDetail = getErrorDetail(error);
+            const validationDetails = getvalidationDetails(errorDetail);
+            // Submitting is done
+            actions.setSubmitting(false);
+            actions.setStatus({
+                validationDetails,
+                isSignupError: true
+            });
+        })
+            .catch((err) => {
+            console.log(err);
+            actions.setSubmitting(false);
+        });
+    };
+}
+function getvalidationDetails(errorDetail) {
+    const [field] = Object.keys(errorDetail.data[0]);
+    const [detail] = errorDetail.data[0][field];
+    return [field, detail];
+}
+//# sourceMappingURL=signupSubmit.js.map

package/components/Auth/signupSubmit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"signupSubmit.js","sourceRoot":"","sources":["signupSubmit.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAElB,MAAM,iDAAiD,CAAC;AACzD,OAAO,OAAO,MAAM,8CAA8C,CAAC;AACnE,OAAO,cAAc,MAAM,yCAAyC,CAAC;AACrE,OAAO,cAEN,MAAM,sCAAsC,CAAC;AAE9C,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAGjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,MAAM,UAAU,eAAe;IAC7B,MAAM,CAAC,MAAM,CAAC,GAAG,WAAW,CAG1B,cAAc,CAAC,CAAC;IAClB,MAAM,MAAM,GAAG,eAAe,EAAE,CAAC;IACjC,MAAM,EAAE,KAAK,EAAE,GAAG,OAAO,EAAE,CAAC;IAC5B,MAAM,EAAE,kBAAkB,EAAE,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IACzD,MAAM,KAAK,GAAG,UAAU,EAAE,CAAC;IAE3B,OAAO,SAAS,MAAM,CAAC,EACrB,MAAM,EACN,OAAO,EAIR;QACC,sCAAsC;QACtC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAE5B,MAAM,CAAC;YACL,SAAS,EAAE;gBACT,KAAK,EAAE,iBAAiB,CAAC,MAAM,EAAE;oBAC/B,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;iBACrD,CAAC;aACH;SACF,CAAC;aACC,IAAI,CACH,CAAC,IAAI,EAAE,EAAE;YACP,qBAAqB;YACrB,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAC7B,8BAA8B;YAC9B,KAAK,CAAC,kBAAkB,EAAE,CAAC,CAAC;YAC5B,yBAAyB;YACzB,MAAM,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;gBAC5B,6CAA6C;gBAC7C,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACL,CAAC,EACD,CAAC,KAAK,EAAE,EAAE;YACR,MAAM,WAAW,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;YAC1C,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;YAE5D,qBAAqB;YACrB,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAE7B,OAAO,CAAC,SAAS,CAAC;gBAChB,iBAAiB;gBACjB,aAAa,EAAE,IAAI;aACpB,CAAC,CAAC;QACL,CAAC,CACF;aACA,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE;YACb,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;YACjB,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC/B,CAAC,CAAC,CAAC;IACP,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CAAC,WAAwB;IACpD,MAAM,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACjD,MAAM,CAAC,MAAM,CAAC,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;AACzB,CAAC"}

package/components/Auth/useAddressFields.d.ts

@@ -0,0 +1,22 @@
+export default function useAddressFields(): {
+    fields: {
+        inputProps: {
+            key: string;
+            type: string;
+            name: string;
+            label: string;
+            required: boolean;
+        };
+        type: string;
+        label: string;
+        placeholder?: string;
+        __typename?: "CustomerField";
+        id: string;
+        required: boolean;
+        pattern?: string;
+        fields?: import("../../types").CustomerField[];
+        name: string;
+    }[];
+    countries: import("../../types").Country[];
+    setCountryByCode: (countryCode: string) => void;
+};

package/components/Auth/useAddressFields.js

@@ -0,0 +1,33 @@
+import throwErrorInDev from '@jetshop/core/helpers/throwErrorInDev';
+import React from 'react';
+import { SignupContext } from './signup-context';
+export default function useAddressFields() {
+    const context = React.useContext(SignupContext);
+    // Throw if this hook is used from outside the signup form container (which
+    // contains the context provider)
+    throwErrorInDev(typeof context === 'undefined', 'useAddressFields can only be used from inside `SignupFormContainer`');
+    const { billingAddressFields, countries, setCountry } = context;
+    // Change the selected country by country code
+    // This will change the fields and validations based on that country's settings
+    const setCountryByCode = React.useCallback((countryCode) => {
+        const country = countries.find((c) => c.code === countryCode);
+        if (!country)
+            return;
+        setCountry(country);
+    }, [countries, setCountry]);
+    // Filter out the country field from the billing address fields, as it is handled separately
+    // See: Countries.tsx
+    const fields = billingAddressFields
+        .filter((f) => f.name !== 'country')
+        .map((field) => {
+        return Object.assign(Object.assign({}, field), { inputProps: {
+                key: field.id,
+                type: field.type,
+                name: field.name,
+                label: field.label,
+                required: field.required
+            } });
+    });
+    return { fields, countries, setCountryByCode };
+}
+//# sourceMappingURL=useAddressFields.js.map

package/components/Auth/useAddressFields.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAddressFields.js","sourceRoot":"","sources":["useAddressFields.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uCAAuC,CAAC;AACpE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,MAAM,CAAC,OAAO,UAAU,gBAAgB;IACtC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IAEhD,2EAA2E;IAC3E,iCAAiC;IACjC,eAAe,CACb,OAAO,OAAO,KAAK,WAAW,EAC9B,qEAAqE,CACtE,CAAC;IAEF,MAAM,EAAE,oBAAoB,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;IAEhE,8CAA8C;IAC9C,+EAA+E;IAC/E,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAW,CACxC,CAAC,WAAmB,EAAE,EAAE;QACtB,MAAM,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,WAAW,CAAC,CAAC;QAE9D,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,UAAU,CAAC,OAAO,CAAC,CAAC;IACtB,CAAC,EACD,CAAC,SAAS,EAAE,UAAU,CAAC,CACxB,CAAC;IAEF,4FAA4F;IAC5F,qBAAqB;IACrB,MAAM,MAAM,GAAG,oBAAoB;SAChC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,SAAS,CAAC;SACnC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QACb,uCACK,KAAK,KACR,UAAU,EAAE;gBACV,GAAG,EAAE,KAAK,CAAC,EAAE;gBACb,IAAI,EAAE,KAAK,CAAC,IAAI;gBAChB,IAAI,EAAE,KAAK,CAAC,IAAI;gBAChB,KAAK,EAAE,KAAK,CAAC,KAAK;gBAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ;aACzB,IACD;IACJ,CAAC,CAAC,CAAC;IAEL,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AACjD,CAAC"}

package/components/Auth/useAddressFields.test.js

@@ -3,11 +3,13 @@ import { render, fireEvent, waitForElement } from '@testing-library/react';
 import useAddressFields from './useAddressFields';
 import ChannelContext from '@jetshop/core/components/ChannelContext';
 import SignupProvider from './signup-context';
-import { ApolloClient } from 'apollo-client';
-import { MockLink } from 'apollo-link-mock';
-import { ApolloProvider } from 'react-apollo';
-import { InMemoryCache } from 'apollo-cache-inmemory';
-import gql from 'graphql-tag';
+import {
+  ApolloClient,
+  ApolloProvider,
+  InMemoryCache,
+  gql
+} from '@apollo/client';
+import { MockLink } from '@apollo/client';
 
 const fields = [
   {
@@ -69,7 +71,7 @@ describe('useAddressFields', () => {
     const testFields = await waitForElement(() => getAllByTestId('field'));
 
     expect(testFields).toHaveLength(2);
-    testFields.map(field => expect(field.id).not.toBe('country'));
+    testFields.map((field) => expect(field.id).not.toBe('country'));
   });
 
   it('changes the form fields based on selected country', async () => {
@@ -270,7 +272,7 @@ function Wrapper() {
   return (
     <>
       <div>
-        {fields.map(field => (
+        {fields.map((field) => (
           <span data-testid="field" key={field.name}>
             {field.name}
           </span>
@@ -284,7 +286,7 @@ function Wrapper() {
         Set country from form
       </button>
 
-      {countries.map(country => (
+      {countries.map((country) => (
         <span data-testid="country" key={country.id}>
           {country.code}
         </span>