import { CheckoutFieldGroup, FieldType } from './checkout.types';

export const CHECKOUT_FIELDS: CheckoutFieldGroup[] = [
  {
    title: 'Sender Details',
    fields: [
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'billingAddressFirstName',
          label: 'First Name',
          config: {
            inputType: 'textInput',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'billingAddressLastName',
          label: 'Last Name',
          config: {
            inputType: 'textInput',
            width: '40%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        rule: 'required|email',
        data: {
          required: true,
          id: 'email',
          label: 'Email',
          config: {
            inputType: 'email',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'billingAddressPhone',
          label: 'Phone Number',
          config: {
            inputType: 'tel',
            width: '40%'
          }
        }
      },
    ]
  },
  {
    title: 'Billing Address',
    fields: [
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'billingAddressAddress1',
          label: 'Address line 1',
          config: {
            inputType: 'textInput',
            width: '100%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'billingAddressAddress2',
          label: 'Address line 2',
          config: {
            inputType: 'textInput',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'billingAddressBusinessName',
          label: 'Company Name',
          config: {
            inputType: 'textInput',
            width: '40%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'billingAddressCity',
          label: 'City',
          config: {
            inputType: 'textInput',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'billingAddressZipCode',
          label: 'Post Code',
          config: {
            inputType: 'textInput',
            width: '40%'
          }
        }
      }
    ]
  },
  {
    title: 'Delivering to',
    fields: [
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'shippingAddressFirstName',
          label: 'First Name',
          config: {
            inputType: 'textInput',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'shippingAddressLastName',
          label: 'Last Name',
          config: {
            inputType: 'textInput',
            width: '40%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'shippingAddressPhone',
          label: 'Phone Number',
          config: {
            inputType: 'tel',
            width: ''
          }
        }
      },
      {
        fieldType: FieldType.TextCaption,
        copy: 'Please note, we may contact the recipient in the event of delivery complications'
      }
    ]
  },
  {
    title: 'Delivery Address',
    fields: [
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'shippingAddressAddress1',
          label: 'Address line 1',
          config: {
            inputType: 'textInput',
            width: '100%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'shippingAddressAddress2',
          label: 'Address line 2',
          config: {
            inputType: 'textInput',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        data: {
          id: 'shippingAddressBusinessName',
          label: 'Company Name',
          config: {
            inputType: 'textInput',
            width: '40%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        rule: 'required',
        data: {
          required: true,
          id: 'shippingAddressCity',
          label: 'City',
          config: {
            inputType: 'textInput',
            width: '60%'
          }
        }
      },
      {
        fieldType: FieldType.TextField,
        rule: 'required|postalcode',
        data: {
          required: true,
          id: 'shippingAddressZipCode',
          label: 'Post Code',
          config: {
            inputType: 'textInput',
            width: '40%'
          }
        }
      }
    ]
  },
  {
    title: 'Delivery instructions',
    fields: [
      {
        fieldType: FieldType.TextCaption,
        copy: 'Please specify any additional delivery details here, we aim to deliver all orders between 10am-6pm. During peak periods deliveries may fall outside of our expected delivery times.'
      },
      {
        fieldType: FieldType.TextArea,
        data: {
          id: 'orderDeliveryInstructions',
          label: 'Delivery Instructions',
          config: {
            inputType: 'textInput'
          }
        }
      },
    ]
  },
  {
    title: 'What if nobody is home?',
    fields: [
      {
        fieldType: FieldType.Dropdown,
        placeholder: 'Select an option',
        data: {
          id: 'orderDeliveryNotHome'
        },
        options: [
          {
            slug: '0',
            title: 'Leave with a neighbour',
            valueKey: 0
          },
          {
            slug: '1',
            title: 'Leave at reception',
            valueKey: 1
          },
          {
            slug: '2',
            title: 'Leave in a safe place',
            valueKey: 2
          },
          {
            slug: '3',
            title: 'Leave with doorman',
            valueKey: 3
          }
        ]
      }
    ]
  }
]