import gql from 'graphql-tag'
import { graphql, compose } from 'react-apollo'

const GetProduct = gql`
query GetProduct($productId: String) {
  getProduct(productId: $productId) {
    id
    title
    handle
    description
    description_html
    item_count
    product_type
    gender
    colors {
      id
      position
      name
      fill
    }
    sizes {
      name
      values {
        id
        name
        guidance
      }
    }
    images
    variants {
      id
      product_id
      sku
      title
      is_available
      price {
        msrp
        price
        isDiscounted
        percentOff
      }
      shipping {
        requires_shipping
        grams
        weight
        weight_unit
      }
      created_at
      updated_at
      sizes {
        name
        values {
          id
          name
          guidance
        }
      }
    }
    breadcrumbs {
      name
      link
      position
    }
    details {
      icon_handle
      title
      tech {
        title
        handle
        content
      }
    }
    created_at
    updated_at
  }
}`

const withAppSyncProduct = compose(
  graphql(GetProduct, {
    name: 'getProduct',
    options: (ownProps) => ({
      fetchPolicy: 'cache-and-network',
      variables: {
        productId: ownProps.productId
      }
    }),
    props: (props) => {
      if (props.getProduct.error) console.log(props.getProduct.error)
      return props
    }
  })
)

export { GetProduct, withAppSyncProduct }