import { wording } from 'src/words'

const wordings = {
  weeklyEmailLabel: 'weekly emails with new sales and special offers',
  allEmailLabel: 'all emails about sales and special offers',
  sendSaleNotifications: 'send sale notifications',
  sendAllNotifications: 'send all notifications',
}

const MyProfileInputList = [
  {
    identifier: 'first-name',
    type: 'text',
    value: '',
    name: 'firstName',
    labelText: `${wording.firstNameLabel}*`,
    className: 'form-input first-name',
    wrapperClassName: 'form-input-wrapper',
    maxLength: '50',
    validationType: 'name',
    errorMessageFor: 'firstName',
    autocomplete: 'given-name',
    ariaLabel: wording.firstNameLabel,
    dataQa: 'qa-first-name',
    animatePlaceholder: false,
  },
  {
    identifier: 'last-name',
    type: 'text',
    value: '',
    name: 'lastName',
    labelText: `${wording.lastNameLabel}*`,
    className: 'form-input last-name',
    wrapperClassName: 'form-input-wrapper',
    maxLength: '50',
    validationType: 'name',
    errorMessageFor: 'lastName',
    autocomplete: 'given-name',
    ariaLabel: wording.lastNameLabel,
    dataQa: 'qa-last-name',
    animatePlaceholder: false,
  },
  {
    identifier: 'email',
    type: 'text',
    value: '',
    name: 'email',
    labelText: `${wording.emailLabel}*`,
    className: 'form-input email-address',
    wrapperClassName: 'form-input-wrapper email-address-wrapper',
    maxLength: '254',
    validationType: 'email',
    errorMessageFor: 'email',
    autocomplete: 'given-email',
    ariaLabel: wording.emailLabel,
    dataQa: 'qa-my-profile-email',
    animatePlaceholder: false,
  },
]

const emailPreferenceInputList = [
  {
    identity: 'weeklyEmail',
    type: 'checkbox',
    label: wordings.allEmailLabel,
    className: 'email-preference-option',
    name: 'weeklyEmailPreference',
    isSelected: false,
    bgColor: '#1b75bc',
    ariaLabel: wordings.allEmailLabel,
  },
  {
    identity: 'allEmail',
    type: 'checkbox',
    label: wordings.weeklyEmailLabel,
    className: 'email-preference-option all-email-option',
    name: 'allEmailPreference',
    isSelected: true,
    bgColor: '#1b75bc',
  },
]

const smsNotificationInputList = [
  {
    type: 'groupElements',
    validationType: 'groupElements',
    className: 'group-container',
    name: 'group-container',
    elementList: [
      {
        identity: 'phone-number',
        type: 'telephone',
        value: '',
        className: 'input-form phone-number',
        name: 'phoneNumber',
        labelText: wording.phoneNumber,
        maxLength: '50',
        wrapperClassName: 'input-form-wrapper phone-number-wrapper',
        validationType: 'emptyOrTelephone',
        errorMessageFor: 'phoneNumber',
        dataQa: 'qa-telephone',
        autocomplete: 'tel',
        ariaLabel: wording.phoneNumber,
        animatePlaceholder: false,
      },
      {
        identity: 'extension',
        type: 'text',
        value: '',
        className: 'input-form extension',
        name: 'extension',
        labelText: wording.extension,
        maxLength: '50',
        wrapperClassName: 'input-form-wrapper extension-wrapper',
        validationType: 'emptyOrNumber',
        dataQa: 'qa-telephone-ext',
        ariaLabel: wording.extension,
        animatePlaceholder: false,
      },
    ],
  },
  {
    identity: 'send-sale-notifications',
    type: 'checkbox',
    label: wordings.sendSaleNotifications,
    className: 'input-form-wrapper send-sale-wrapper',
    name: 'sendSaleNotifications',
    bgColor: '#1b75bc',
    dataQa: 'qa-send-sale-notifications',
    ariaLabel: wordings.sendSaleNotifications,
  },
  {
    identity: 'send-all-notifications',
    type: 'checkbox',
    label: wordings.sendAllNotifications,
    className: 'input-form-wrapper send-all-wrapper',
    name: 'sendAllNotifications',
    isSelected: true,
    bgColor: '#1b75bc',
    dataQa: 'qa-send-all-notifications',
    ariaLabel: wordings.sendAllNotifications,
  },
]

const changePasswordInputList = [
  {
    identity: 'old-password',
    type: 'password',
    value: '',
    className: 'old-password',
    name: 'password',
    labelText: `${wording.oldPassword}*`,
    maxLength: 90,
    wrapperClassName: 'old-password-wrapper',
    validationType: 'password',
    errorMessageFor: 'currentPassword',
    dataQa: 'qa-old-password-text',
    autocomplete: '',
    ariaLabel: 'password',
    animatePlaceholder: false,
  },
  {
    identity: 'new-password',
    type: 'password',
    value: '',
    className: 'new-password',
    name: 'newPassword',
    labelText: `${wording.newPassword}*`,
    maxLength: 90,
    wrapperClassName: 'new-password-wrapper',
    validationType: 'password',
    errorMessageFor: 'enterPassword',
    dataQa: 'qa-new-password-text',
    autocomplete: '',
    ariaLabel: 'password',
    animatePlaceholder: false,
    placeholderText: 'Must be at least 8 characters',
  },
  {
    identity: 'confirm-password',
    type: 'password',
    value: '',
    className: 'confirm-password',
    name: 'confirmPassword',
    labelText: `${wording.confirmNewPassword}*`,
    maxLength: 90,
    wrapperClassName: 'confirm-password-wrapper',
    validationType: 'password',
    errorMessageFor: 'confirmPassword',
    dataQa: 'qa-confirm-password-text',
    autocomplete: '',
    ariaLabel: 'password',
    animatePlaceholder: false,
    placeholderText: 'Must be at least 8 characters',
  },
]

export {
  MyProfileInputList,
  emailPreferenceInputList,
  smsNotificationInputList,
  changePasswordInputList,
}