summaryrefslogtreecommitdiffstats
path: root/finished-application/frontend/components/Nav.js
diff options
context:
space:
mode:
authorRandy Ridge <randyridge@gmail.com>2018-09-14 20:01:25 -0400
committerGitHub <noreply@github.com>2018-09-14 20:01:25 -0400
commit908180c77cd38011eeedcae949613da2a3391e5e (patch)
treeb59bf1aae819a04d453cde72f6e601f5561a740f /finished-application/frontend/components/Nav.js
parent1f6667d233a4a2e9df977204d83a8f749c050c75 (diff)
parentb3bebda57ba187b7fa10398054b54c05d3fd3555 (diff)
Merge branch 'master' into randyridge/our
Diffstat (limited to 'finished-application/frontend/components/Nav.js')
-rw-r--r--finished-application/frontend/components/Nav.js82
1 files changed, 36 insertions, 46 deletions
diff --git a/finished-application/frontend/components/Nav.js b/finished-application/frontend/components/Nav.js
index b483376..118db5a 100644
--- a/finished-application/frontend/components/Nav.js
+++ b/finished-application/frontend/components/Nav.js
@@ -1,59 +1,49 @@
-import React, { Fragment } from 'react';
import Link from 'next/link';
-import { Query, Mutation } from 'react-apollo';
+import { Mutation } from 'react-apollo';
import { TOGGLE_CART_MUTATION } from './Cart';
+import NavStyles from './styles/NavStyles';
import User from './User';
import CartCount from './CartCount';
import Signout from './Signout';
-import NavStyles from './styles/NavStyles';
-class Nav extends React.Component {
- render() {
- // below we set the fetchPolicy to network only so it forces re-fetch on the server
- return (
- <User>
- {({ data: { me }, error }) => (
- <NavStyles data-test="nav">
- <Link href="/items">
- <a>Shop</a>
- </Link>
+const Nav = () => (
+ <User>
+ {({ data: { me } }) => (
+ <NavStyles data-test="nav">
+ <Link href="/items">
+ <a>Shop</a>
+ </Link>
+ {me && (
+ <>
<Link href="/sell">
<a>Sell</a>
</Link>
+ <Link href="/orders">
+ <a>Orders</a>
+ </Link>
+ <Link href="/me">
+ <a>Account</a>
+ </Link>
+ <Signout />
+ <Mutation mutation={TOGGLE_CART_MUTATION}>
+ {(toggleCart) => (
+ <button onClick={toggleCart}>
+ My Cart
+ <CartCount count={me.cart.reduce((tally, cartItem) => tally + cartItem.quantity, 0)}></CartCount>
+ </button>
+ )}
+ </Mutation>
+ </>
+ )}
+ {!me && (
+ <Link href="/signup">
+ <a>Sign In</a>
+ </Link>
- {!me && (
- <Link href="/signup">
- <a>Sign In</a>
- </Link>
- )}
-
- {me && (
- <Fragment>
- <Link href="/orders">
- <a>Orders</a>
- </Link>
- <Link href="/me">
- <a>My Account</a>
- </Link>
- <Signout />
- <Mutation mutation={TOGGLE_CART_MUTATION}>
- {toggleCart => (
- <button onClick={toggleCart}>
- My Cart
- <CartCount
- className="cart-count"
- count={me.cart.reduce((tally, cartItem) => tally + cartItem.quantity, 0)}
- />
- </button>
- )}
- </Mutation>
- </Fragment>
- )}
- </NavStyles>
)}
- </User>
- );
- }
-}
+ </NavStyles>
+ )}
+ </User>
+);
export default Nav;