import React from 'react'
import { storiesOf } from '@storybook/react'
import Order from 'abstractions/Order'
import { ActionButtons } from 'abstractions/Order/ActionButtons'
import { CancelReturnForm } from 'abstractions/Order/CancelReturnForm'
import { PaymentSummary } from 'abstractions/Order/PaymentSummary'
import { ProductItem } from 'abstractions/Order/ProductItem'
import { ProductItemList } from 'abstractions/Order/ProductItemList'
import { OrderStatus } from 'abstractions/Order/OrderStatus'

/**
 * Order History Card
 */
storiesOf('abstractions/Order', module)
  .add('List View', () => <Order viewType="list" />)
  .add('Grid View', () => <Order viewType="grid" />)

/**
 * Order Status
 */
storiesOf('abstractions/Order/OrderStatus', module).add(
  'default',
  () => <OrderStatus />
)

/**
 * Action Buttons
 */
storiesOf('abstractions/Order/ActionButtons', module).add(
  'default',
  () => <ActionButtons />
)

/**
 * Cancel Return Forms
 */
storiesOf('abstractions/Order/CancelReturnForm', module).add(
  'default',
  () => <CancelReturnForm />
)

/**
 * Product Item
 */
storiesOf('abstractions/Order/ProductItem', module).add(
  'default',
  () => <ProductItem />
)

/**
 * Product Item List
 */
storiesOf('abstractions/Order/ProductItemList', module).add(
  'default',
  () => <ProductItemList viewType="grid" />
)

/**
 * Payment Summary
 */
storiesOf('abstractions/Order/PaymentSummary', module)
  .add('Summary without action buttons', () => <PaymentSummary />)
  .add('Summary with action buttons', () => (
    <PaymentSummary shouldHideActionButtons={false} />
  ))