'use client'
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { array, string, boolean } from 'yup';
import { useFieldsState } from '../../context/FieldsStateContext/FieldsStateContext.js';
import '@dynamic-labs/iconic';
import '@dynamic-labs/wallet-connector-core';
import 'react/jsx-runtime';
import '../../context/ViewContext/ViewContext.js';
import '../../shared/logger.js';
import '@dynamic-labs/wallet-book';
import '@dynamic-labs/utils';
import '../../utils/constants/colors.js';
import '../../utils/constants/values.js';
import { PHONE_NUMBER_REGEX } from '../../utils/constants/fields.js';
import '@dynamic-labs/sdk-api-core';
import { countryCodes, tShirtSizes, teamNames } from '../../shared/consts/index.js';
import '../../../../_virtual/_tslib.js';
import '@dynamic-labs/multi-wallet';
import { validatePhoneLength } from '../../utils/functions/validatePhoneLength/validatePhoneLength.js';
import 'react-international-phone';
import '../../store/state/nonce/nonce.js';
import '@dynamic-labs-wallet/browser-wallet-client';
import '@dynamic-labs-sdk/client/core';
import 'eventemitter3';
import '@dynamic-labs-sdk/client';
import '../../config/ApiEndpoint.js';
import '../../events/dynamicEvents.js';
import '@dynamic-labs/locale';
import '../../store/state/dynamicContextProps/dynamicContextProps.js';
import '../../store/state/primaryWalletId/primaryWalletId.js';
import '../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
import '../../utils/functions/getWaasAddressTypeLabel/getWaasAddressTypeLabel.js';

const customFieldValidationMap = {
    checkbox: array(),
    select: string(),
    text: string(),
};
const useFields = () => {
    const { t } = useTranslation();
    const { selectedPhoneCountry } = useFieldsState();
    const fieldsConfig = useMemo(() => ({
        alias: {
            key: 'dyn_collect_user_data.fields.alias.label',
            label: t('dyn_collect_user_data.fields.alias.label'),
            type: 'string',
            validation: string().trim(),
        },
        country: {
            key: 'dyn_collect_user_data.fields.country.label',
            label: t('dyn_collect_user_data.fields.country.label'),
            type: 'select',
            validation: string().oneOf(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: 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: 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: 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: 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: 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(phone, selectedPhoneCountry.current));
            })
                // Validate format
                .matches(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: 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: string().oneOf(tShirtSizes),
        },
        team: {
            key: 'dyn_collect_user_data.fields.team.label',
            label: t('dyn_collect_user_data.fields.team.label'),
            type: 'select',
            validation: string().oneOf(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: string().matches(/^(?!.*([$!#%?])\1)[A-Za-z0-9$!#%?_-]{3,20}$/, t('dyn_collect_user_data.fields.username.validation')),
        },
    }), [selectedPhoneCountry, t]);
    return { fieldsConfig };
};

export { customFieldValidationMap, useFields };
