summaryrefslogtreecommitdiffstats
path: root/stepped-solutions/FINISHED/frontend/components/OrderList.js
diff options
context:
space:
mode:
authorWes Bos <wesbos@gmail.com>2018-09-14 12:18:12 -0400
committerWes Bos <wesbos@gmail.com>2018-09-14 12:18:12 -0400
commit2d145b026cfdf54a63bef0b9d6324b6785390307 (patch)
treef6c1d8f987437803a5c026e70535bf9ff244e885 /stepped-solutions/FINISHED/frontend/components/OrderList.js
parent8a5825d52271d712ec7c8348447d433067e13ef2 (diff)
move finished folder
Diffstat (limited to 'stepped-solutions/FINISHED/frontend/components/OrderList.js')
-rw-r--r--stepped-solutions/FINISHED/frontend/components/OrderList.js80
1 files changed, 0 insertions, 80 deletions
diff --git a/stepped-solutions/FINISHED/frontend/components/OrderList.js b/stepped-solutions/FINISHED/frontend/components/OrderList.js
deleted file mode 100644
index e2e22ff..0000000
--- a/stepped-solutions/FINISHED/frontend/components/OrderList.js
+++ /dev/null
@@ -1,80 +0,0 @@
-import React from 'react';
-import { Query } from 'react-apollo';
-import { formatDistance } from 'date-fns';
-import Link from 'next/link';
-import styled from 'styled-components';
-import gql from 'graphql-tag';
-import Error from './ErrorMessage';
-import formatMoney from '../lib/formatMoney';
-import OrderItemStyles from './styles/OrderItemStyles';
-
-const USER_ORDERS_QUERY = gql`
- query USER_ORDERS_QUERY {
- orders(orderBy: createdAt_DESC) {
- id
- total
- createdAt
- items {
- id
- title
- price
- description
- quantity
- image
- }
- }
- }
-`;
-
-const orderUl = styled.ul`
- display: grid;
- grid-gap: 4rem;
- grid-template-columns: repeat(auto-fit, minmax(40%, 1fr));
-`;
-
-class OrderList extends React.Component {
- render() {
- return (
- <Query query={USER_ORDERS_QUERY}>
- {({ data: { orders }, loading, error }) => {
- if (loading) return <p>loading...</p>;
- if (error) return <Error erorr={error} />;
- console.log(orders);
- return (
- <div>
- <h2>You have {orders.length} orders</h2>
- <orderUl>
- {orders.map(order => (
- <OrderItemStyles key={order.id}>
- <Link
- href={{
- pathname: '/order',
- query: { id: order.id },
- }}
- >
- <a>
- <div className="order-meta">
- <p>{order.items.reduce((a, b) => a + b.quantity, 0)} Items</p>
- <p>{order.items.length} Products</p>
- <p>{formatDistance(order.createdAt, new Date())}</p>
- <p>{formatMoney(order.total)}</p>
- </div>
- <div className="images">
- {order.items.map(item => (
- <img key={item.id} src={item.image} alt={item.title} />
- ))}
- </div>
- </a>
- </Link>
- </OrderItemStyles>
- ))}
- </orderUl>
- </div>
- );
- }}
- </Query>
- );
- }
-}
-
-export default OrderList;