@dynamic-labs/sdk-react-core/src/lib/views/CollectUserDataView/useFields.cjs

A React SDK for implementing wallet web3 authentication and authorization to your website.

'use client'
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var reactI18next = require('react-i18next');
var yup = require('yup');
var FieldsStateContext = require('../../context/FieldsStateContext/FieldsStateContext.cjs');
require('@dynamic-labs/sdk-api-core');
require('../../shared/logger.cjs');
require('@dynamic-labs/iconic');
require('@dynamic-labs/wallet-connector-core');
require('react/jsx-runtime');
require('../../context/ViewContext/ViewContext.cjs');
require('@dynamic-labs/wallet-book');
require('@dynamic-labs/utils');
require('../../utils/constants/colors.cjs');
require('../../utils/constants/values.cjs');
var fields = require('../../utils/constants/fields.cjs');
var index = require('../../shared/consts/index.cjs');
require('../../../../_virtual/_tslib.cjs');
require('@dynamic-labs/multi-wallet');
var validatePhoneLength = require('../../utils/functions/validatePhoneLength/validatePhoneLength.cjs');
require('react-international-phone');
require('../../store/state/nonce/nonce.cjs');
require('../../store/state/projectSettings/projectSettings.cjs');
require('../../config/ApiEndpoint.cjs');
require('../../store/state/user/user.cjs');
require('../../locale/locale.cjs');
require('../../store/state/dynamicContextProps/dynamicContextProps.cjs');
require('../../store/state/primaryWalletId/primaryWalletId.cjs');
require('../../store/state/connectedWalletsInfo/connectedWalletsInfo.cjs');

const customFieldValidationMap = {
    checkbox: yup.array(),
    select: yup.string(),
    text: yup.string(),
};
const useFields = () => {
    const { t } = reactI18next.useTranslation();
    const { selectedPhoneCountry } = FieldsStateContext.useFieldsState();
    const fieldsConfig = React.useMemo(() => ({
        alias: {
            key: 'dyn_collect_user_data.fields.alias.label',
            label: t('dyn_collect_user_data.fields.alias.label'),
            type: 'string',
            validation: yup.string().trim(),
        },
        country: {
            key: 'dyn_collect_user_data.fields.country.label',
            label: t('dyn_collect_user_data.fields.country.label'),
            type: 'select',
            validation: yup.string().oneOf(index.countryCodes.map((c) => c.code)),
        },
        email: {
            autoComplete: 'email',
            key: 'dyn_collect_user_data.fields.email.label',
            label: t('dyn_collect_user_data.fields.email.label'),
            type: 'email',
            validation: yup.string().email(t('dyn_collect_user_data.fields.email.validation')),
        },
        firstName: {
            key: 'dyn_collect_user_data.fields.first_name.label',
            label: t('dyn_collect_user_data.fields.first_name.label'),
            type: 'string',
            validation: yup.string().trim(),
        },
        jobTitle: {
            key: 'dyn_collect_user_data.fields.job_title.label',
            label: t('dyn_collect_user_data.fields.job_title.label'),
            type: 'string',
            validation: yup.string().trim(),
        },
        lastName: {
            key: 'dyn_collect_user_data.fields.last_name.label',
            label: t('dyn_collect_user_data.fields.last_name.label'),
            type: 'string',
            validation: yup.string().trim(),
        },
        phoneNumber: {
            key: 'dyn_collect_user_data.fields.phone_number.label',
            label: t('dyn_collect_user_data.fields.phone_number.label'),
            type: 'string',
            validation: yup.string()
                // Validate length
                .test('length', t('dyn_collect_user_data.fields.phone_number.too_short'), (phone) => {
                if (!selectedPhoneCountry.current)
                    return true;
                // Either it's the full length of a phone number, or empty
                return (phone === undefined ||
                    phone.length === 0 ||
                    validatePhoneLength.validatePhoneLength(phone, selectedPhoneCountry.current));
            })
                // Validate format
                .matches(fields.PHONE_NUMBER_REGEX, t('dyn_collect_user_data.fields.phone_number.validation')),
        },
        policiesConsent: {
            key: 'dyn_collect_user_data.fields.policies_consent.label',
            label: t('dyn_collect_user_data.fields.policies_consent.label'),
            type: 'boolean',
            validation: yup.boolean(),
        },
        tShirtSize: {
            key: 'dyn_collect_user_data.fields.t_shirt_size.label',
            label: t('dyn_collect_user_data.fields.t_shirt_size.label'),
            type: 'select',
            validation: yup.string().oneOf(index.tShirtSizes),
        },
        team: {
            key: 'dyn_collect_user_data.fields.team.label',
            label: t('dyn_collect_user_data.fields.team.label'),
            type: 'select',
            validation: yup.string().oneOf(index.teamNames),
        },
        username: {
            key: 'dyn_collect_user_data.fields.username.label',
            label: t('dyn_collect_user_data.fields.username.label'),
            type: 'string',
            // From chatGPT:
            // - string can contain letters A-Z, a-z, numbers 0-9, or symbols $ ! # % ?
            // - string must be length 3 to 20
            // - string cannot contain consecutive symbols
            validation: yup.string().matches(/^(?!.*([$!#%?])\1)[A-Za-z0-9$!#%?_-]{3,20}$/, t('dyn_collect_user_data.fields.username.validation')),
        },
    }), [selectedPhoneCountry, t]);
    return { fieldsConfig };
};

exports.customFieldValidationMap = customFieldValidationMap;
exports.useFields = useFields;