{"size": 989, "ext": "js", "max_stars_repo_path": "client/components/Confirmation.js", "max_stars_repo_name": "Dichotomy-Engine/grace-shopper", "max_stars_repo_stars_event_min_datetime": "2020-12-25T07:09:25.000Z", "max_stars_repo_stars_event_max_datetime": "2020-12-25T07:10:03.000Z", "max_issues_repo_path": "client/components/Confirmation.js", "max_issues_repo_name": "ekjc/grace-shopper", "max_issues_repo_issues_event_min_datetime": "2018-07-23T22:20:23.000Z", "max_issues_repo_issues_event_max_datetime": "2018-07-31T19:36:09.000Z", "max_forks_repo_path": "client/components/Confirmation.js", "max_forks_repo_name": "ekjc/grace-shopper", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": 30, "max_forks_count": null, "avg_line_length": 31.9032258065, "max_line_length": 107, "alphanum_fraction": 0.5995955511}
import React, { Component } from 'react';
import { connect } from 'react-redux'

const Confirmation = (props) => {
  const {cart, cartItems} = props
  const orderNumber = props.match.params.orderNumber
  console.log(orderNumber);
  return (
    <div style={{ marginTop: '15px' }}>
      <h1 style={{ marginTop: '.5rem', fontWeight: 'bold' }} > Thank you for your order {cart.email}! </h1>
      <p style={{ marginTop: '.5rem' }}> Order {cart.orderNumber} </p>
      <p> Status: Processing </p>
      <p style={{ marginTop: '2rem', fontWeight: 'bold' }}> Items Purchased </p>
      {cartItems.map(item => (
        <ul key={item.product.id}>
        <li style={{ marginTop: '.5rem', fontWeight: 'bold' }}>{item.product.name}</li>
        <li>${item.product.price}</li>
        <li>Quantity Purchased: {item.quantity}</li>
      </ul>
      ))}
    </div>
  )
}

const mapState = ({ cart }) => ({
  cart: cart.info,
  cartItems: cart.items
})

export default connect(mapState)(Confirmation)
