content: import React from 'react'
  import {connect} from 'react-redux'
  import compose from 'recompose/compose'
  
  import {getStateName, getCountryName} from '../service/country'
  
  import CheckoutStepSection from '../component/checkout-step-section'
  import Link from '../component/link'
  import Grid from '../component/grid'
  import Column from '../component/column'
  import Paragraph from '../component/paragraph'
  
  import * as navigationAction from '../action/navigation'
  
  const CheckoutAddressDonePartial = ({user, goToAddress, children}) => {
    const shippingStateName =
      user && getStateName(user.shippingAddress.countryCode, user.shippingAddress.stateCode)
  
    const billingStateName =
      (user &&
        user.billingAddress &&
        user.billingAddress.stateCode &&
        getStateName(user.billingAddress.countryCode, user.billingAddress.stateCode)) ||
      (user &&
        user.shippingAddress.countryCode === user.billingAddress.countryCode &&
        shippingStateName) ||
      ''
  
    return (
      <CheckoutStepSection
        title="2. Address"
        type="done"
        action={
          <Link
            label="edit"
            href="/checkout/address"
            onClick={event => {
              event.preventDefault()
              goToAddress(true)
            }}
          />
        }
      >
        <Grid>
          <Column md={6}>
            <Paragraph size="s" minor>
              <strong>Delivery</strong>
              <br />
              {user.shippingAddress.firstName} {user.shippingAddress.lastName}
              <br />
              {user.shippingAddress.address}
              <br />
              {user.shippingAddress.addressLine2 && (
                <>
                  {user.shippingAddress.addressLine2}
                  <br />
                </>
              )}
              {user.shippingAddress.zipCode} {user.shippingAddress.city}
              <br />
              {shippingStateName && (
                <>
                  {shippingStateName}
                  <br />
                </>
              )}
              {getCountryName(user.shippingAddress.countryCode)}
            </Paragraph>
            <Paragraph size="s" minor>
              Contact Email: {user.emailAddress}
              <br />
              Contact Phone: {user.phoneNumber}
            </Paragraph>
          </Column>
          <Column md={6}>
            {user && (
              <Paragraph size="s" minor>
                <strong>Billing</strong>
                <br />
                {user.companyName ? (
                  <>
                    {user.companyName}
                    <br />
                  </>
                ) : null}
                {user.vatId ? (
                  <>
                    {user.vatId}
                    <br />
                  </>
                ) : null}
                {user.useDifferentBillingAddress ? (
                  <>
                    {user.billingAddress.firstName} {user.billingAddress.lastName}
                    <br />
                    {user.billingAddress.address}
                    <br />
                    {user.billingAddress.addressLine2 && (
                      <>
                        {user.billingAddress.addressLine2}
                        <br />
                      </>
                    )}
                    {user.billingAddress.zipCode} {user.billingAddress.city}
                    <br />
                  </>
                ) : (
                  <>
                    {user.shippingAddress.firstName} {user.shippingAddress.lastName}
                    <br />
                    {user.shippingAddress.address}
                    <br />
                    {user.shippingAddress.addressLine2 && (
                      <>
                        {user.shippingAddress.addressLine2}
                        <br />
                      </>
                    )}
                    {user.shippingAddress.zipCode} {user.shippingAddress.city}
                    <br />
                  </>
                )}
                {billingStateName && (
                  <>
                    {billingStateName}
                    <br />
                  </>
                )}
                {user.billingAddress.countryCode
                  ? getCountryName(user.billingAddress.countryCode)
                  : getCountryName(user.shippingAddress.countryCode)}
              </Paragraph>
            )}
          </Column>
        </Grid>
        {children}
      </CheckoutStepSection>
    )
  }
  
  const mapStateToProps = state => ({
    user: state.core.user
  })
  
  const mapDispatchToProps = {
    goToAddress: navigationAction.goToAddress
  }
  
  export default compose(
    connect(
      mapStateToProps,
      mapDispatchToProps
    )
  )(CheckoutAddressDonePartial)
  