import React from 'react'
import { storiesOf } from '@storybook/react'
import { MultipleShipping } from 'presets/Checkout/GuestUser'
import {
  productItem,
  shippingMethodOptionList,
  deliveryInstructionConfig,
} from '../fixture'

const handleShippingMethodChange = (event: Event, item) => {
  console.log('[Handler] handleShippingMethodChange: ', item.value)
}

const handleShippingAddressChange = (event: Event, item) => {
  console.log('[Handler] handleShippingAddressChange', item.value)
}

const handleAddDeliveryInstruction = (args: Object) => {
  console.log('[Handler] handleAddDeliveryInstruction', args.toSerialized())
}

const handleRemoveDeliveryInstruction = (args: Object) => {
  console.log('[Handler] handleRemoveDeliveryInstruction', args.toSerialized())
}

const attributes = {
  shippingMethodOptionList,
  deliveryInstructionConfig,
  productItem,
  handleShippingMethodChange,
  handleShippingAddressChange,
  handleAddDeliveryInstruction,
  handleRemoveDeliveryInstruction,
}
storiesOf('presets/Checkout/GuestUser', module).add('MultipleShipping', () => (
  <MultipleShipping {...attributes} />
))