diff options
42 files changed, 510 insertions, 525 deletions
diff --git a/frontend/__tests__/AddToCart.test.js b/frontend/__tests__/AddToCart.test.js index 888ad68..fe15f3f 100644 --- a/frontend/__tests__/AddToCart.test.js +++ b/frontend/__tests__/AddToCart.test.js @@ -1,12 +1,12 @@ import React from 'react'; import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; -import AddToCart from '../components/AddToCart'; import { ApolloConsumer } from 'react-apollo'; import { MockedProvider } from 'react-apollo/test-utils'; import wait from 'waait'; +import AddToCart, { ADD_TO_CART_MUTATION } from '../components/AddToCart'; import { fakeCartItem, fakeUser } from '../lib/testUtils'; -import { ADD_TO_CART_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from '../components/User'; const mocks = [ { @@ -34,12 +34,15 @@ const mocks = [ ]; describe('<AddtoCart/>', () => { - it('renders and matches snapshot', () => { + it('renders and matches snapshot', async () => { const wrapper = mount( - <MockedProvider> + <MockedProvider mocks={mocks}> <AddToCart id="abc123" /> </MockedProvider> ); + await wait(); + wrapper.update(); + expect(toJSON(wrapper.find('button'))).toMatchSnapshot(); }); @@ -58,6 +61,8 @@ describe('<AddtoCart/>', () => { </MockedProvider> ); await wait(); + wrapper.update(); + const { me } = apolloClient.readQuery({ query: CURRENT_USER_QUERY }); expect(me.cart).toHaveLength(0); @@ -72,12 +77,14 @@ describe('<AddtoCart/>', () => { expect(me2.cart[0].quantity).toBe(1); }); - it('changes to adding when clicked', () => { + it('changes to adding when clicked', async () => { const wrapper = mount( <MockedProvider mocks={mocks}> <AddToCart id="abc123" /> </MockedProvider> ); + await wait(); + wrapper.update(); expect(wrapper.text()).toContain('🛒 Add To Cart'); wrapper.find('button').simulate('click'); expect(wrapper.text()).toContain('🛒 Adding To Cart'); diff --git a/frontend/__tests__/Cart.test.js b/frontend/__tests__/Cart.test.js index f32c7f9..255183e 100644 --- a/frontend/__tests__/Cart.test.js +++ b/frontend/__tests__/Cart.test.js @@ -6,7 +6,8 @@ import wait from 'waait'; import Cart from '../components/Cart'; import { MockedProvider } from 'react-apollo/test-utils'; import { fakeCartItem, fakeUser } from '../lib/testUtils'; -import { CURRENT_USER_QUERY, LOCAL_STATE_QUERY } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from '../components/User'; +import { LOCAL_STATE_QUERY } from '../components/Cart'; const mocks = [ { diff --git a/frontend/__tests__/CreateItem.test.js b/frontend/__tests__/CreateItem.test.js index a2fcb90..56c3f10 100644 --- a/frontend/__tests__/CreateItem.test.js +++ b/frontend/__tests__/CreateItem.test.js @@ -3,10 +3,9 @@ import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; import Router from 'next/router'; import { MockedProvider } from 'react-apollo/test-utils'; -import CreateItem from '../components/CreateItem'; +import CreateItem, { CREATE_ITEM_MUTATION } from '../components/CreateItem'; import wait from 'waait'; import { fakeItem } from '../lib/testUtils'; -import { CREATE_ITEM_MUTATION } from '../queries/queries.graphql'; const dogImage = 'https://dog.com/dog.jpg'; diff --git a/frontend/__tests__/EditUser.test.js b/frontend/__tests__/EditUser.test.js index c1aea1c..a98cbb5 100644 --- a/frontend/__tests__/EditUser.test.js +++ b/frontend/__tests__/EditUser.test.js @@ -1,11 +1,11 @@ import React from 'react'; import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; -import EditUser from '../components/EditUser'; -import wait from 'waait'; import { MockedProvider } from 'react-apollo/test-utils'; +import wait from 'waait'; +import EditUser, { UPDATE_USER_MUTATION } from '../components/EditUser'; import { fakeUser } from '../lib/testUtils'; -import { CURRENT_USER_QUERY, UPDATE_USER_MUTATION } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from '../components/User'; const mocks = [ { diff --git a/frontend/__tests__/Nav.test.js b/frontend/__tests__/Nav.test.js index 16f20e3..5c61c56 100644 --- a/frontend/__tests__/Nav.test.js +++ b/frontend/__tests__/Nav.test.js @@ -6,7 +6,7 @@ import Router from 'next/router'; import Nav from '../components/Nav'; import { MockedProvider } from 'react-apollo/test-utils'; import { fakeUser } from '../lib/testUtils'; -import { CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from '../components/User'; // Mock the router Router.router = { push() {} }; diff --git a/frontend/__tests__/Order.test.js b/frontend/__tests__/Order.test.js index 5cb21c8..f3a4f06 100644 --- a/frontend/__tests__/Order.test.js +++ b/frontend/__tests__/Order.test.js @@ -2,10 +2,9 @@ import React from 'react'; import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; import wait from 'waait'; -import Order from '../components/Order'; import { MockedProvider } from 'react-apollo/test-utils'; +import Order, { SINGLE_ORDER_QUERY } from '../components/Order'; import { fakeOrder } from '../lib/testUtils'; -import { SINGLE_ORDER_QUERY } from '../queries/queries.graphql'; const mocks = [ { diff --git a/frontend/__tests__/Pagination.test.js b/frontend/__tests__/Pagination.test.js index 1202d9a..29a57f9 100644 --- a/frontend/__tests__/Pagination.test.js +++ b/frontend/__tests__/Pagination.test.js @@ -1,11 +1,10 @@ import React from 'react'; import { shallow, mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; -import Pagination from '../components/Pagination'; +import Pagination, { PAGINATION_QUERY } from '../components/Pagination'; import { MockedProvider } from 'react-apollo/test-utils'; import wait from 'waait'; import { fakeItem } from '../lib/testUtils'; -import { ALL_ITEMS_QUERY } from '../queries/queries.graphql'; import Router from 'next/router'; @@ -15,7 +14,7 @@ Router.router = { push() {}, prefetch() {} }; function makeMocksFor(length) { return [ { - request: { query: ALL_ITEMS_QUERY, variables: { skip: 0, first: 4 } }, + request: { query: PAGINATION_QUERY, variables: { skip: 0, first: 4 } }, result: { data: { itemsConnection: { @@ -25,7 +24,6 @@ function makeMocksFor(length) { __typename: 'count', }, }, - items: Array.from({ length }, (_, i) => fakeItem({ id: `item${i}` })), }, }, }, diff --git a/frontend/__tests__/PleaseSignIn.test.js b/frontend/__tests__/PleaseSignIn.test.js index 68581b7..f516ea3 100644 --- a/frontend/__tests__/PleaseSignIn.test.js +++ b/frontend/__tests__/PleaseSignIn.test.js @@ -4,7 +4,7 @@ import wait from 'waait'; import PleaseSignIn from '../components/PleaseSignIn'; import { MockedProvider } from 'react-apollo/test-utils'; import { fakeUser } from '../lib/testUtils'; -import { CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from '../components/User'; const notSignedInMocks = [ { diff --git a/frontend/__tests__/RemoveFromCart.test.js b/frontend/__tests__/RemoveFromCart.test.js index 581e815..34229a5 100644 --- a/frontend/__tests__/RemoveFromCart.test.js +++ b/frontend/__tests__/RemoveFromCart.test.js @@ -4,9 +4,9 @@ import toJSON from 'enzyme-to-json'; import { ApolloConsumer } from 'react-apollo'; import { MockedProvider } from 'react-apollo/test-utils'; import wait from 'waait'; -import RemoveFromCart from '../components/RemoveFromCart'; +import RemoveFromCart, { REMOVE_FROM_CART_MUTATION } from '../components/RemoveFromCart'; import { fakeCartItem, fakeUser } from '../lib/testUtils'; -import { CURRENT_USER_QUERY, REMOVE_FROM_CART_MUTATION } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from '../components/User'; const mocks = [ { diff --git a/frontend/__tests__/ResetRequest.test.js b/frontend/__tests__/ResetRequest.test.js index 7e9a7c2..22a9508 100644 --- a/frontend/__tests__/ResetRequest.test.js +++ b/frontend/__tests__/ResetRequest.test.js @@ -1,11 +1,8 @@ -import React from 'react'; import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; -import ResetRequest from '../components/ResetRequest'; import { MockedProvider } from 'react-apollo/test-utils'; import wait from 'waait'; -import { fakeItem } from '../lib/testUtils'; -import { REQUEST_RESET_MUTATION, RESET_MUTATION } from '../queries/queries.graphql'; +import ResetRequest, { REQUEST_RESET_MUTATION } from '../components/ResetRequest'; const mocks = [ { @@ -46,50 +43,12 @@ describe('<ResetRequest/>', () => { }); // submit the form - wrapper.find('form').simulate('submit'); + const form = wrapper.find('form'); + console.log(form); + form.simulate('submit'); await wait(); wrapper.update(); expect(wrapper.find('p').text()).toContain('Success! Check Your Email!'); }); - - xit('displays an error', async () => { - const errorMocks = [ - { - request: { - query: REQUEST_RESET_MUTATION, - variables: { - email: 'wesbos@gmail.com', - }, - }, - error: { - message: 'Shit', - }, - }, - ]; - const wrapper = mount( - <MockedProvider mocks={errorMocks}> - <ResetRequest /> - </MockedProvider> - ); - - wrapper.find('input').simulate('change', { - target: { value: 'wesbos@gmail.com' }, - }); - - try { - wrapper.find('form').simulate('submit'); - await wait(); - } catch (e) { - console.log('CAUGHT'); - console.log(e); - } - // expect(async () => { - // }).toThrow(); - - // wrapper.find('form').simulate('submit'); - wrapper.update(); - console.log(wrapper.debug()); - // expect(wrapper.find('p').text()).toContain('Success! Check Your Email!'); - }); }); diff --git a/frontend/__tests__/Signup.test.js b/frontend/__tests__/Signup.test.js index 018f9b9..2a668a6 100644 --- a/frontend/__tests__/Signup.test.js +++ b/frontend/__tests__/Signup.test.js @@ -2,10 +2,11 @@ import React from 'react'; import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; import wait from 'waait'; -import Signup from '../components/Signup'; +import { ApolloConsumer } from 'react-apollo'; import { MockedProvider } from 'react-apollo/test-utils'; -import { LocalStorageMock, fakeItem, fakeUser, fakeCartItem } from '../lib/testUtils'; -import { SIGNUP_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import Signup, { SIGNUP_MUTATION } from '../components/Signup'; +import { fakeUser } from '../lib/testUtils'; +import { CURRENT_USER_QUERY } from '../components/User'; function type(wrapper, name, value) { wrapper.find(`input[name="${name}"]`).simulate('change', { @@ -29,14 +30,10 @@ const mocks = [ result: { data: { signup: { - __typename: 'AuthPayload', - token: 'tok123', - user: { - __typename: 'User', - id: 'abc123', - email: me.email, - name: me.name, - }, + __typename: 'User', + id: 'abc123', + email: me.email, + name: me.name, }, }, }, @@ -56,11 +53,6 @@ const mocks = [ ]; describe('<Signup/>', () => { - beforeAll(() => { - // mock localStorage - global.localStorage = new LocalStorageMock(); - }); - it('renders and matches snapshot', () => { const wrapper = mount( <MockedProvider> @@ -71,9 +63,15 @@ describe('<Signup/>', () => { }); it('calls mutation with correct data', async () => { + let apolloClient; const wrapper = mount( <MockedProvider mocks={mocks}> - <Signup /> + <ApolloConsumer> + {client => { + apolloClient = client; + return <Signup />; + }} + </ApolloConsumer> </MockedProvider> ); @@ -87,7 +85,7 @@ describe('<Signup/>', () => { wrapper.update(); wrapper.find('form').simulate('submit'); - await wait(5); - expect(localStorage.getItem('token')).toBe('tok123'); + const user = await apolloClient.query({ query: CURRENT_USER_QUERY }); + expect(user.data.me).toMatchObject(me); }); }); diff --git a/frontend/__tests__/SingleItem.test.js b/frontend/__tests__/SingleItem.test.js index e99facf..aeb8554 100644 --- a/frontend/__tests__/SingleItem.test.js +++ b/frontend/__tests__/SingleItem.test.js @@ -2,10 +2,10 @@ import React from 'react'; import { mount } from 'enzyme'; import wait from 'waait'; import toJSON from 'enzyme-to-json'; -import SingleItem from '../components/SingleItem'; -import { SINGLE_ITEM_QUERY } from '../queries/queries.graphql'; +import SingleItem, { SINGLE_ITEM_QUERY } from '../components/SingleItem'; import { MockedProvider } from 'react-apollo/test-utils'; -import { fakeItem } from '../lib/testUtils'; +import { fakeItem, fakeUser } from '../lib/testUtils'; +import { CURRENT_USER_QUERY } from '../components/User'; const data = { items: [fakeItem()], @@ -16,9 +16,12 @@ describe('<SingleItem/>', () => { const mocks = [ { request: { query: SINGLE_ITEM_QUERY, variables: { id: '123' } }, - delay: 50, result: { data }, }, + { + request: { query: CURRENT_USER_QUERY }, + result: { data: { me: fakeUser() } }, + }, ]; const wrapper = mount( <MockedProvider mocks={mocks}> @@ -32,9 +35,9 @@ describe('<SingleItem/>', () => { await wait(55); wrapper.update(); // Grab the piece we want - const Item = wrapper.find('[data-test="SingleItem"]'); - // snapshot it! - expect(toJSON(Item)).toMatchSnapshot(); + expect(toJSON(wrapper.find('h2'))).toMatchSnapshot(); + expect(toJSON(wrapper.find('img'))).toMatchSnapshot(); + expect(toJSON(wrapper.find('p'))).toMatchSnapshot(); }); it('Errors with a not found Item', async () => { diff --git a/frontend/__tests__/TakeMyMoney.test.js b/frontend/__tests__/TakeMyMoney.test.js index f2d0ca7..1c41410 100644 --- a/frontend/__tests__/TakeMyMoney.test.js +++ b/frontend/__tests__/TakeMyMoney.test.js @@ -1,13 +1,12 @@ -import React from 'react'; -import { shallow, mount } from 'enzyme'; +import { mount } from 'enzyme'; import toJSON from 'enzyme-to-json'; import NProgress from 'nprogress'; -import TakeMyMoney from '../components/TakeMyMoney'; import Router from 'next/router'; import wait from 'waait'; import { MockedProvider } from 'react-apollo/test-utils'; -import { fakeItem, fakeUser, fakeCartItem } from '../lib/testUtils'; -import { CREATE_ITEM_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import TakeMyMoney from '../components/TakeMyMoney'; +import { fakeUser, fakeCartItem } from '../lib/testUtils'; +import { CURRENT_USER_QUERY } from '../components/User'; Router.router = { push() {} }; @@ -40,9 +39,7 @@ describe('<TakeMyMoney />', () => { }); it('creates an order onToken', async () => { - const createOrderSpy = jest - .fn() - .mockResolvedValue({ data: { CREATE_ORDER_MUTATION: { id: 'xyz789' } } }); + const createOrderSpy = jest.fn().mockResolvedValue({ data: { createOrder: { id: 'xyz789' } } }); const wrapper = mount( <MockedProvider mocks={mocks}> @@ -66,9 +63,7 @@ describe('<TakeMyMoney />', () => { wrapper.update(); NProgress.start = jest.fn(); - const createOrderSpy = jest - .fn() - .mockResolvedValue({ data: { CREATE_ORDER_MUTATION: { id: 'xyz789' } } }); + const createOrderSpy = jest.fn().mockResolvedValue({ data: { createOrder: { id: 'xyz789' } } }); const component = wrapper.find('TakeMyMoney'); component.instance().onToken({ id: 'abc123' }, createOrderSpy); wrapper.find('button').simulate('click'); @@ -87,9 +82,7 @@ describe('<TakeMyMoney />', () => { // Spy on Router Push Router.router.push = jest.fn(); - const createOrderSpy = jest - .fn() - .mockResolvedValue({ data: { CREATE_ORDER_MUTATION: { id: 'xyz789' } } }); + const createOrderSpy = jest.fn().mockResolvedValue({ data: { createOrder: { id: 'xyz789' } } }); const component = wrapper.find('TakeMyMoney'); component.instance().onToken({ id: 'abc123' }, createOrderSpy); diff --git a/frontend/__tests__/__snapshots__/Signup.test.js.snap b/frontend/__tests__/__snapshots__/Signup.test.js.snap index 536c1d8..b3c057e 100644 --- a/frontend/__tests__/__snapshots__/Signup.test.js.snap +++ b/frontend/__tests__/__snapshots__/Signup.test.js.snap @@ -3,6 +3,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = ` <form className="sc-bdVaJa LHejR" + method="post" onSubmit={[Function]} > <fieldset @@ -24,7 +25,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = ` onChange={[Function]} placeholder="email" type="text" - value="wesbos@gmail.com" + value="" /> </label> <label @@ -36,7 +37,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = ` onChange={[Function]} placeholder="name" type="text" - value="Wes Bos" + value="" /> </label> <label @@ -50,7 +51,7 @@ exports[`<Signup/> renders and matches snapshot 1`] = ` onChange={[Function]} placeholder="password" type="password" - value="wes" + value="" /> </label> <button diff --git a/frontend/__tests__/__snapshots__/SingleItem.test.js.snap b/frontend/__tests__/__snapshots__/SingleItem.test.js.snap index 0969d73..28e9174 100644 --- a/frontend/__tests__/__snapshots__/SingleItem.test.js.snap +++ b/frontend/__tests__/__snapshots__/SingleItem.test.js.snap @@ -12,84 +12,21 @@ exports[`<SingleItem/> Errors with a not found Item 1`] = ` `; exports[`<SingleItem/> Renders with Proper Data 1`] = ` -Array [ - <styled.div - data-test="SingleItem" - > - <div - className="sc-bwzfXH dFvSZo" - data-test="SingleItem" - > - <img - alt="dogs are best" - src="dog.jpg" - /> - <div - className="details" - > - <h2> - Viewing - dogs are best - </h2> - <p> - dogs - </p> - <Link - href={ - Object { - "pathname": "/update", - "query": Object { - "id": "123", - }, - } - } - > - <a - href="/update?id=123" - onClick={[Function]} - > - Edit ✏️ - </a> - </Link> - </div> - </div> - </styled.div>, - <div - className="sc-bwzfXH dFvSZo" - data-test="SingleItem" - > - <img - alt="dogs are best" - src="dog.jpg" - /> - <div - className="details" - > - <h2> - Viewing - dogs are best - </h2> - <p> - dogs - </p> - <Link - href={ - Object { - "pathname": "/update", - "query": Object { - "id": "123", - }, - } - } - > - <a - href="/update?id=123" - onClick={[Function]} - > - Edit ✏️ - </a> - </Link> - </div> - </div>, -] +<h2> + Viewing + dogs are best +</h2> +`; + +exports[`<SingleItem/> Renders with Proper Data 2`] = ` +<img + alt="dogs are best" + src="dog.jpg" +/> +`; + +exports[`<SingleItem/> Renders with Proper Data 3`] = ` +<p> + dogs +</p> `; diff --git a/frontend/components/AddToCart.js b/frontend/components/AddToCart.js index 7cb0856..03242a4 100644 --- a/frontend/components/AddToCart.js +++ b/frontend/components/AddToCart.js @@ -1,10 +1,24 @@ import { Component } from 'react'; import { Mutation } from 'react-apollo'; import PropTypes from 'prop-types'; -import { - ADD_TO_CART_MUTATION, - CURRENT_USER_QUERY, -} from '../queries/queries.graphql'; +import gql from 'graphql-tag'; +import User, { CURRENT_USER_QUERY } from './User'; + +const ADD_TO_CART_MUTATION = gql` + mutation addToCart($id: ID!) { + addToCart(id: $id) { + id + quantity + item { + id + price + description + image + title + } + } + } +`; class AddToCart extends Component { static propTypes = { @@ -15,9 +29,7 @@ class AddToCart extends Component { const newCartItem = payload.data.addToCart; const data = cache.readQuery({ query: CURRENT_USER_QUERY }); - const existingIndex = data.me.cart.findIndex( - cartItem => cartItem.id === newCartItem.id, - ); + const existingIndex = data.me.cart.findIndex(cartItem => cartItem.id === newCartItem.id); if (existingIndex >= 0) { // already in cache, just replace it data.me.cart = [ @@ -34,19 +46,23 @@ class AddToCart extends Component { render() { const { id } = this.props; return ( - <Mutation - mutation={ADD_TO_CART_MUTATION} - variables={{ id }} - update={this.update} - > - {(addToCart, { loading }) => ( - <button disabled={loading} onClick={addToCart}> - 🛒 Add{loading && 'ing'} To Cart - </button> - )} - </Mutation> + <User> + {({ data: { me }, loading }) => { + if (!me || loading) return null; + return ( + <Mutation mutation={ADD_TO_CART_MUTATION} variables={{ id }} update={this.update}> + {(addToCart, { loading }) => ( + <button disabled={loading} onClick={addToCart}> + 🛒 Add{loading && 'ing'} To Cart + </button> + )} + </Mutation> + ); + }} + </User> ); } } export default AddToCart; +export { ADD_TO_CART_MUTATION }; diff --git a/frontend/components/Cart.js b/frontend/components/Cart.js index a815b78..7e8a9c5 100644 --- a/frontend/components/Cart.js +++ b/frontend/components/Cart.js @@ -1,14 +1,11 @@ import React from 'react'; import { Mutation, Query } from 'react-apollo'; import { adopt } from 'react-adopt'; +import gql from 'graphql-tag'; import TakeMyMoney from './TakeMyMoney'; import formatMoney from '../lib/formatMoney'; import CartItem from './CartItem'; -import { - CURRENT_USER_QUERY, - LOCAL_STATE_QUERY, - TOGGLE_CART_MUTATION, -} from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from './User'; import calcTotalPrice from '../lib/calcTotalPrice'; import Error from './ErrorMessage'; import CartStyles from './styles/CartStyles'; @@ -16,46 +13,51 @@ import Supreme from './styles/Supreme'; import CloseButton from './styles/CloseButton'; import SickButton from './styles/SickButton'; +const LOCAL_STATE_QUERY = gql` + query { + cartOpen @client + } +`; + +const TOGGLE_CART_MUTATION = gql` + mutation { + toggleCart @client + } +`; + const Composed = adopt({ toggleCart: ({ render }) => ( <Mutation mutation={TOGGLE_CART_MUTATION}> {(mutate, result) => render({ mutate, result })} </Mutation> ), - localState: <Query query={LOCAL_STATE_QUERY} />, - currentUser: <Query query={CURRENT_USER_QUERY} data-test="cart" />, + localState: ({ render }) => <Query query={LOCAL_STATE_QUERY} children={render} />, + currentUser: ({ render }) => ( + <Query children={render} query={CURRENT_USER_QUERY} data-test="cart" /> + ), }); const Cart = () => ( <Composed> {({ toggleCart, localState, currentUser }) => { - const { - data: { me }, - error, - loading, - } = currentUser; + const { data: { me }, error, loading } = currentUser; if (loading) return <p>Loading...</p>; if (error) return <Error error={error} />; if (!me) return null; return ( <CartStyles open={localState.data.cartOpen}> <header> - <CloseButton title="close" onClick={toggleCart}> + <CloseButton title="close" onClick={toggleCart.mutate}> × </CloseButton> <Supreme>{me.name}'s Cart.</Supreme> <p> - You have {me.cart.length} item{me.cart.length === 1 ? '' : 's'} in - your cart. + You have {me.cart.length} item{me.cart.length === 1 ? '' : 's'} in your cart. </p> </header> - <ul> - {me.cart.map(cartItem => ( - <CartItem key={cartItem.id} cartItem={cartItem} /> - ))} - </ul> + <ul>{me.cart.map(cartItem => <CartItem key={cartItem.id} cartItem={cartItem} />)}</ul> <footer> <p>{formatMoney(calcTotalPrice(me.cart))}</p> <TakeMyMoney> @@ -69,3 +71,4 @@ const Cart = () => ( ); export default Cart; +export { LOCAL_STATE_QUERY, TOGGLE_CART_MUTATION }; diff --git a/frontend/components/CreateItem.js b/frontend/components/CreateItem.js index 06e2da3..fc3dcb2 100644 --- a/frontend/components/CreateItem.js +++ b/frontend/components/CreateItem.js @@ -1,11 +1,31 @@ import React, { Component } from 'react'; import { Mutation } from 'react-apollo'; import Router from 'next/router'; -import { CREATE_ITEM_MUTATION } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import Error from './ErrorMessage'; import Form from './styles/Form'; import formatMoney from '../lib/formatMoney'; +const CREATE_ITEM_MUTATION = gql` + mutation CREATE_ITEM_MUTATION( + $description: String! + $title: String! + $price: Int! + $image: String + $largeImage: String + ) { + createItem( + description: $description + title: $title + price: $price + image: $image + largeImage: $largeImage + ) { + id + } + } +`; + class CreateItem extends Component { state = { title: '', @@ -116,3 +136,4 @@ class CreateItem extends Component { } export default CreateItem; +export { CREATE_ITEM_MUTATION }; diff --git a/frontend/components/DeleteItem.js b/frontend/components/DeleteItem.js index 53fc04d..9b09378 100644 --- a/frontend/components/DeleteItem.js +++ b/frontend/components/DeleteItem.js @@ -1,10 +1,18 @@ import React from 'react'; import { Mutation } from 'react-apollo'; import PropTypes from 'prop-types'; -import { - REMOVE_ITEM_MUTATION, - ALL_ITEMS_QUERY, -} from '../queries/queries.graphql'; +import gql from 'graphql-tag'; +import { ALL_ITEMS_QUERY } from './Items'; + +const DELETE_ITEM_MUTATION = gql` + mutation deleteItem($id: ID!) { + deleteItem(id: $id) { + id + title + description + } + } +`; class DeleteItem extends React.Component { static propTypes = { @@ -23,7 +31,7 @@ class DeleteItem extends React.Component { render() { return ( <Mutation - mutation={REMOVE_ITEM_MUTATION} + mutation={DELETE_ITEM_MUTATION} variables={{ id: this.props.id }} update={this.update} > @@ -44,3 +52,4 @@ class DeleteItem extends React.Component { } export default DeleteItem; +export { DELETE_ITEM_MUTATION }; diff --git a/frontend/components/EditUser.js b/frontend/components/EditUser.js index ce56e11..1bb8e5b 100644 --- a/frontend/components/EditUser.js +++ b/frontend/components/EditUser.js @@ -1,8 +1,18 @@ import React from 'react'; import { Query, Mutation } from 'react-apollo'; +import gql from 'graphql-tag'; import Form from './styles/Form'; -import { CURRENT_USER_QUERY, UPDATE_USER_MUTATION } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from './User'; import Error from './ErrorMessage'; +import User from './User'; + +const UPDATE_USER_MUTATION = gql` + mutation updateUser($name: String!) { + updateUser(name: $name) { + name + } + } +`; class EditUser extends React.Component { state = { @@ -28,7 +38,7 @@ class EditUser extends React.Component { render() { return ( - <Query query={CURRENT_USER_QUERY}> + <User> {({ data: { me }, loading }) => { if (loading) return <p>Loading...</p>; return ( @@ -62,9 +72,10 @@ class EditUser extends React.Component { </Mutation> ); }} - </Query> + </User> ); } } export default EditUser; +export { UPDATE_USER_MUTATION }; diff --git a/frontend/components/Items.js b/frontend/components/Items.js index 618cc84..394f16d 100644 --- a/frontend/components/Items.js +++ b/frontend/components/Items.js @@ -2,11 +2,25 @@ import React from 'react'; import { Query } from 'react-apollo'; import styled from 'styled-components'; import PropTypes from 'prop-types'; +import gql from 'graphql-tag'; import Pagination from './Pagination'; import Item from './Item'; import LoadingItem from './LoadingItem'; import { perPage } from '../config'; -import { ALL_ITEMS_QUERY } from '../queries/queries.graphql'; + +const ALL_ITEMS_QUERY = gql` + query ALL_ITEMS_QUERY($skip: Int = 0, $first: Int = 4) { + items(orderBy: createdAt_DESC, first: $first, skip: $skip) { + __typename + id + title + price + description + image + largeImage + } + } +`; const Items = styled.div` display: grid; @@ -57,3 +71,4 @@ class ItemList extends React.Component { } export default ItemList; +export { ALL_ITEMS_QUERY }; diff --git a/frontend/components/Nav.js b/frontend/components/Nav.js index 4bbce2d..826335f 100644 --- a/frontend/components/Nav.js +++ b/frontend/components/Nav.js @@ -1,21 +1,17 @@ import React, { Fragment } from 'react'; import Link from 'next/link'; import { Query, ApolloConsumer } from 'react-apollo'; -import { CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import User from './User'; import CartCount from './CartCount'; import Signout from './Signout'; -import Dump from './Dump'; 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 ( - <Query - query={CURRENT_USER_QUERY} - fetchPolicy={process.browser ? 'cache-first' : 'network-only'} - > - {({ data: { me }, loading, error }) => ( + <User> + {({ data: { me }, error }) => ( <NavStyles data-test="nav"> <Link href="/items"> <a>Shop</a> @@ -54,7 +50,7 @@ class Nav extends React.Component { )} </NavStyles> )} - </Query> + </User> ); } } diff --git a/frontend/components/Order.js b/frontend/components/Order.js index a224c1b..6411abe 100644 --- a/frontend/components/Order.js +++ b/frontend/components/Order.js @@ -3,11 +3,30 @@ import { Query } from 'react-apollo'; import { format } from 'date-fns'; import Head from 'next/head'; import PropTypes from 'prop-types'; -import { SINGLE_ORDER_QUERY } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import formatMoney from '../lib/formatMoney'; import Error from './ErrorMessage'; import OrderStyles from './styles/OrderStyles'; +const SINGLE_ORDER_QUERY = gql` + query SINGLE_ORDER_QUERY($id: ID!) { + order(id: $id) { + id + charge + total + createdAt + items { + id + title + price + description + image + quantity + } + } + } +`; + class Order extends Component { static propTypes = { id: PropTypes.string.isRequired, @@ -73,3 +92,4 @@ class Order extends Component { } export default Order; +export { SINGLE_ORDER_QUERY }; diff --git a/frontend/components/OrderList.js b/frontend/components/OrderList.js index eef69ca..5886ad7 100644 --- a/frontend/components/OrderList.js +++ b/frontend/components/OrderList.js @@ -3,10 +3,29 @@ import { Query } from 'react-apollo'; import { formatDistance } from 'date-fns'; import Link from 'next/link'; import styled from 'styled-components'; -import { USER_ORDERS_QUERY } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import formatMoney from '../lib/formatMoney'; import OrderItemStyles from './styles/OrderItemStyles'; +const USER_ORDERS_QUERY = gql` + query orders { + orders(orderBy: createdAt_DESC) { + id + total + createdAt + updatedAt + items { + id + title + price + description + quantity + image + } + } + } +`; + const OrderUl = styled.ul` display: grid; grid-gap: 4rem; @@ -71,3 +90,4 @@ class OrderList extends React.Component { } export default OrderList; +export { USER_ORDERS_QUERY }; diff --git a/frontend/components/Pagination.js b/frontend/components/Pagination.js index 380026d..8b25e06 100644 --- a/frontend/components/Pagination.js +++ b/frontend/components/Pagination.js @@ -3,8 +3,18 @@ import { Query } from 'react-apollo'; import styled from 'styled-components'; import Link from 'next/link'; import PropTypes from 'prop-types'; +import gql from 'graphql-tag'; import { perPage } from '../config'; -import { ALL_ITEMS_QUERY } from '../queries/queries.graphql'; + +const PAGINATION_QUERY = gql` + query itemsConnection($skip: Int = 0, $first: Int = 4) { + itemsConnection(orderBy: createdAt_DESC, first: $first, skip: $skip) { + aggregate { + count + } + } + } +`; const PaginationStyles = styled.div` text-align: center; @@ -31,7 +41,7 @@ const PaginationStyles = styled.div` `; const Pagination = props => ( - <Query query={ALL_ITEMS_QUERY}> + <Query query={PAGINATION_QUERY}> {({ data, loading, error }) => { if (loading || error) return null; const { aggregate } = data.itemsConnection; @@ -78,3 +88,4 @@ Pagination.propTypes = { }; export default Pagination; +export { PAGINATION_QUERY }; diff --git a/frontend/components/Permissions.js b/frontend/components/Permissions.js index 1807366..52a6acf 100644 --- a/frontend/components/Permissions.js +++ b/frontend/components/Permissions.js @@ -1,11 +1,33 @@ import React from 'react'; import { Query, Mutation } from 'react-apollo'; import PropTypes from 'prop-types'; -import { ALL_USERS_QUERY, UPDATE_PERMISSIONS_MUTATION } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import Error from './ErrorMessage'; import SickButton from './styles/SickButton'; import Table from './styles/Table'; +const ALL_USERS_QUERY = gql` + query { + users { + id + name + email + permissions + } + } +`; + +const UPDATE_PERMISSIONS_MUTATION = gql` + mutation updatePermissions($permissions: [Permission], $userId: ID!) { + updatePermissions(permissions: $permissions, userId: $userId) { + id + permissions + name + email + } + } +`; + const possiblePermissions = [ 'ADMIN', 'USER', @@ -108,3 +130,4 @@ const Permissions = () => ( ); export default Permissions; +export { ALL_USERS_QUERY, UPDATE_PERMISSIONS_MUTATION }; diff --git a/frontend/components/PleaseSignIn.js b/frontend/components/PleaseSignIn.js index 7e5e726..5646749 100644 --- a/frontend/components/PleaseSignIn.js +++ b/frontend/components/PleaseSignIn.js @@ -1,6 +1,6 @@ import { Query } from 'react-apollo'; import PropTypes from 'prop-types'; -import { CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from './User'; import Signin from './Signin'; const PleaseSignIn = props => ( diff --git a/frontend/components/RemoveFromCart.js b/frontend/components/RemoveFromCart.js index 7ec2313..cf5b6fd 100644 --- a/frontend/components/RemoveFromCart.js +++ b/frontend/components/RemoveFromCart.js @@ -2,10 +2,16 @@ import { Component } from 'react'; import { Mutation } from 'react-apollo'; import styled from 'styled-components'; import PropTypes from 'prop-types'; -import { - REMOVE_FROM_CART_MUTATION, - CURRENT_USER_QUERY, -} from '../queries/queries.graphql'; +import gql from 'graphql-tag'; +import { CURRENT_USER_QUERY } from './User'; + +const REMOVE_FROM_CART_MUTATION = gql` + mutation removeFromCart($id: ID!) { + removeFromCart(id: $id) { + id + } + } +`; const BigButton = styled.button` font-size: 3rem; @@ -38,11 +44,7 @@ class RemoveFromCart extends Component { update={this.update} > {(removeFromCart, { loading }) => ( - <BigButton - disabled={loading} - title="Remove From Cart" - onClick={removeFromCart} - > + <BigButton disabled={loading} title="Remove From Cart" onClick={removeFromCart}> × </BigButton> )} @@ -52,3 +54,4 @@ class RemoveFromCart extends Component { } export default RemoveFromCart; +export { REMOVE_FROM_CART_MUTATION }; diff --git a/frontend/components/Reset.js b/frontend/components/Reset.js index c4d791c..bb2ece0 100644 --- a/frontend/components/Reset.js +++ b/frontend/components/Reset.js @@ -1,9 +1,20 @@ import React from 'react'; import { Mutation } from 'react-apollo'; import PropTypes from 'prop-types'; +import gql from 'graphql-tag'; import Form from './styles/Form'; import Error from './ErrorMessage'; -import { RESET_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import { CURRENT_USER_QUERY } from './User'; + +const RESET_MUTATION = gql` + mutation RESET_MUTATION($resetToken: String!, $password: String!, $confirmPassword: String!) { + resetPassword(resetToken: $resetToken, password: $password, confirmPassword: $confirmPassword) { + id + email + name + } + } +`; class Reset extends React.Component { static propTypes = { @@ -71,3 +82,4 @@ class Reset extends React.Component { } export default Reset; +export { RESET_MUTATION }; diff --git a/frontend/components/ResetRequest.js b/frontend/components/ResetRequest.js index 1762aa3..6aedcc1 100644 --- a/frontend/components/ResetRequest.js +++ b/frontend/components/ResetRequest.js @@ -1,9 +1,17 @@ import React from 'react'; import { Mutation } from 'react-apollo'; -import { REQUEST_RESET_MUTATION } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import Form from './styles/Form'; import Error from './ErrorMessage'; +const REQUEST_RESET_MUTATION = gql` + mutation requestReset($email: String!) { + requestReset(email: $email) { + id + } + } +`; + class ResetRequest extends React.Component { state = { email: '', @@ -44,3 +52,4 @@ class ResetRequest extends React.Component { } export default ResetRequest; +export { REQUEST_RESET_MUTATION }; diff --git a/frontend/components/Search.js b/frontend/components/Search.js index 9f43d36..a972db2 100644 --- a/frontend/components/Search.js +++ b/frontend/components/Search.js @@ -2,10 +2,19 @@ import React from 'react'; import Downshift from 'downshift'; import Router from 'next/router'; import { ApolloConsumer } from 'react-apollo'; +import gql from 'graphql-tag'; import styled, { keyframes } from 'styled-components'; import debounce from 'lodash.debounce'; -import { SEARCH_ITEMS_QUERY } from '../queries/queries.graphql'; +const SEARCH_ITEMS_QUERY = gql` + query SEARCH_ITEMS_QUERY($searchTerm: String!) { + items(where: { OR: [{ title_contains: $searchTerm }, { description_contains: $searchTerm }] }) { + id + image + title + } + } +`; function routeToItem(item) { Router.push({ pathname: '/item', @@ -131,3 +140,4 @@ class AutoComplete extends React.Component { } export default AutoComplete; +export { SEARCH_ITEMS_QUERY }; diff --git a/frontend/components/Signin.js b/frontend/components/Signin.js index 23a5835..53cdb76 100644 --- a/frontend/components/Signin.js +++ b/frontend/components/Signin.js @@ -1,14 +1,26 @@ import React, { Component } from 'react'; -import { Mutation, ApolloConsumer } from 'react-apollo'; -import { SIGNIN_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import { Mutation } from 'react-apollo'; +import gql from 'graphql-tag'; +import { CURRENT_USER_QUERY } from './User'; import Error from './ErrorMessage'; import Form from './styles/Form'; +const SIGNIN_MUTATION = gql` + mutation SIGNIN_MUTATION($email: String!, $password: String!) { + signin(email: $email, password: $password) { + id + email + name + } + } +`; + class Signin extends Component { state = { - email: `wesbos@gmail.com`, - password: 'abc123', + email: '', + password: '', }; + saveToState = e => { const { name, value } = e.target; this.setState({ [name]: value }); @@ -64,3 +76,4 @@ class Signin extends Component { } export default Signin; +export { SIGNIN_MUTATION }; diff --git a/frontend/components/Signout.js b/frontend/components/Signout.js index fbd7fd9..ae87631 100644 --- a/frontend/components/Signout.js +++ b/frontend/components/Signout.js @@ -1,6 +1,15 @@ import React, { Component } from 'react'; -import { Query, Mutation } from 'react-apollo'; -import { CURRENT_USER_QUERY, SIGN_OUT_MUTATION } from '../queries/queries.graphql'; +import { Mutation } from 'react-apollo'; +import gql from 'graphql-tag'; +import { CURRENT_USER_QUERY } from './User'; + +const SIGN_OUT_MUTATION = gql` + mutation SIGN_OUT_MUTATION { + signout { + message + } + } +`; class Signout extends Component { render() { @@ -13,3 +22,4 @@ class Signout extends Component { } export default Signout; +export { SIGN_OUT_MUTATION }; diff --git a/frontend/components/Signup.js b/frontend/components/Signup.js index 624bc10..9164e67 100644 --- a/frontend/components/Signup.js +++ b/frontend/components/Signup.js @@ -1,14 +1,25 @@ import React, { Component } from 'react'; import { Mutation } from 'react-apollo'; -import { SIGNUP_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; +import { CURRENT_USER_QUERY } from './User'; import Form from './styles/Form'; import Error from './ErrorMessage'; +const SIGNUP_MUTATION = gql` + mutation SIGNUP_MUTATION($email: String!, $name: String!, $password: String!) { + signup(email: $email, name: $name, password: $password) { + id + email + name + } + } +`; + class Signup extends Component { state = { - email: `wesbos@gmail.com`, - name: 'Wes Bos', - password: 'wes', + email: '', + name: '', + password: '', }; saveToState = e => { @@ -79,3 +90,4 @@ class Signup extends Component { } export default Signup; +export { SIGNUP_MUTATION }; diff --git a/frontend/components/SingleItem.js b/frontend/components/SingleItem.js index f71e0fe..d543ad1 100644 --- a/frontend/components/SingleItem.js +++ b/frontend/components/SingleItem.js @@ -2,10 +2,22 @@ import { Query } from 'react-apollo'; import PropTypes from 'prop-types'; import styled from 'styled-components'; import Link from 'next/link'; -import { SINGLE_ITEM_QUERY } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import Error from './ErrorMessage'; import AddToCart from './AddToCart'; +const SINGLE_ITEM_QUERY = gql` + query SINGLE_ITEM_QUERY($id: ID!) { + items(where: { id: $id }) { + id + title + description + largeImage + image + } + } +`; + const SingleItemStyles = styled.div` max-width: 1200px; margin: 2rem auto; @@ -58,3 +70,4 @@ SingleItem.propTypes = { }; export default SingleItem; +export { SINGLE_ITEM_QUERY }; diff --git a/frontend/components/TakeMyMoney.js b/frontend/components/TakeMyMoney.js index 5823d00..b9e42ea 100644 --- a/frontend/components/TakeMyMoney.js +++ b/frontend/components/TakeMyMoney.js @@ -4,9 +4,24 @@ import { Mutation, Query } from 'react-apollo'; import Router from 'next/router'; import NProgress from 'nprogress'; import PropTypes from 'prop-types'; -import { CREATE_ORDER_MUTATION, CURRENT_USER_QUERY } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; import calcTotalPrice from '../lib/calcTotalPrice'; import Error from './ErrorMessage'; +import User, { CURRENT_USER_QUERY } from './User'; + +const CREATE_ORDER_MUTATION = gql` + mutation createOrder($token: String!) { + createOrder(token: $token) { + id + charge + total + items { + id + title + } + } + } +`; function totalItems(cart) { return cart.reduce((tally, cartItem) => tally + cartItem.quantity, 0); @@ -30,7 +45,7 @@ class TakeMyMoney extends Component { }; render() { return ( - <Query query={CURRENT_USER_QUERY}> + <User> {({ data: { me }, error }) => { if (!me || !me.cart.length) return null; if (error) return <Error error={error} />; @@ -56,7 +71,7 @@ class TakeMyMoney extends Component { </Mutation> ); }} - </Query> + </User> ); } } diff --git a/frontend/components/UpdateItem.js b/frontend/components/UpdateItem.js index ecaac75..08ba254 100644 --- a/frontend/components/UpdateItem.js +++ b/frontend/components/UpdateItem.js @@ -1,10 +1,19 @@ import React, { Component } from 'react'; import { Query, Mutation } from 'react-apollo'; import PropTypes from 'prop-types'; -import { SINGLE_ITEM_QUERY, UPDATE_ITEM_MUTATION } from '../queries/queries.graphql'; +import gql from 'graphql-tag'; +import { SINGLE_ITEM_QUERY } from './SingleItem'; import Form from './styles/Form'; import Error from './ErrorMessage'; +const UPDATE_ITEM_MUTATION = gql` + mutation updateItem($id: ID!, $title: String, $description: String, $price: Int) { + updateItem(id: $id, description: $description, title: $title, price: $price) { + id + } + } +`; + class UpdateItem extends Component { static propTypes = { id: PropTypes.string.isRequired, @@ -18,7 +27,6 @@ class UpdateItem extends Component { if (type === 'number') { value = parseInt(value); } - console.log('Saving to state'); const item = { ...this.state.item }; item[name] = value; this.setState({ item }); @@ -94,3 +102,4 @@ class UpdateItem extends Component { } export default UpdateItem; +export { UPDATE_ITEM_MUTATION }; diff --git a/frontend/components/User.js b/frontend/components/User.js new file mode 100644 index 0000000..19c568d --- /dev/null +++ b/frontend/components/User.js @@ -0,0 +1,45 @@ +import { Query } from 'react-apollo'; +import gql from 'graphql-tag'; +import PropTypes from 'prop-types'; + +const CURRENT_USER_QUERY = gql` + query { + me { + id + email + name + permissions + orders { + id + charge + total + } + cart { + id + quantity + item { + __typename + id + title + price + description + image + largeImage + } + } + } + } +`; + +const User = props => ( + <Query {...props} query={CURRENT_USER_QUERY}> + {result => props.children(result)} + </Query> +); + +User.propTypes = { + children: PropTypes.func.isRequired, +}; + +export default User; +export { CURRENT_USER_QUERY }; diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 1d4448d..d055fb6 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -1795,13 +1795,13 @@ } }, "babel-jest": { - "version": "22.4.4", - "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-22.4.4.tgz", - "integrity": "sha512-A9NB6/lZhYyypR9ATryOSDcqBaqNdzq4U+CN+/wcMsLcmKkPxQEoTKLajGfd3IkxNyVBT8NewUK2nWyGbSzHEQ==", + "version": "23.0.0", + "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-23.0.0.tgz", + "integrity": "sha1-Djg6KqazU14ZfbKSlXCiGCvQhOg=", "dev": true, "requires": { - "babel-plugin-istanbul": "^4.1.5", - "babel-preset-jest": "^22.4.4" + "babel-plugin-istanbul": "^4.1.6", + "babel-preset-jest": "^23.0.0" } }, "babel-loader": { @@ -1836,9 +1836,9 @@ } }, "babel-plugin-jest-hoist": { - "version": "22.4.4", - "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-22.4.4.tgz", - "integrity": "sha512-DUvGfYaAIlkdnygVIEl0O4Av69NtuQWcrjMOv6DODPuhuGLDnbsARz3AwiiI/EkIMMlxQDUcrZ9yoyJvTNjcVQ==", + "version": "23.0.0", + "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-23.0.0.tgz", + "integrity": "sha1-5h5oeZ90M5Gh5jBu4nBHeqz5Rsg=", "dev": true }, "babel-plugin-module-resolver": { @@ -1886,12 +1886,12 @@ "integrity": "sha1-Mxz8BQmagII4MR14MZwnRg1IEYk=" }, "babel-preset-jest": { - "version": "22.4.4", - "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-22.4.4.tgz", - "integrity": "sha512-+dxMtOFwnSYWfum0NaEc0O03oSdwBsjx4tMSChRDPGwu/4wSY6Q6ANW3wkjKpJzzguaovRs/DODcT4hbSN8yiA==", + "version": "23.0.0", + "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-23.0.0.tgz", + "integrity": "sha1-Sd4DA/G2h13K1hY+qn64Mw1Ugk0=", "dev": true, "requires": { - "babel-plugin-jest-hoist": "^22.4.4", + "babel-plugin-jest-hoist": "^23.0.0", "babel-plugin-syntax-object-rest-spread": "^6.13.0" } }, @@ -5672,6 +5672,32 @@ "source-map": "^0.5.7" } }, + "babel-jest": { + "version": "22.4.4", + "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-22.4.4.tgz", + "integrity": "sha512-A9NB6/lZhYyypR9ATryOSDcqBaqNdzq4U+CN+/wcMsLcmKkPxQEoTKLajGfd3IkxNyVBT8NewUK2nWyGbSzHEQ==", + "dev": true, + "requires": { + "babel-plugin-istanbul": "^4.1.5", + "babel-preset-jest": "^22.4.4" + } + }, + "babel-plugin-jest-hoist": { + "version": "22.4.4", + "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-22.4.4.tgz", + "integrity": "sha512-DUvGfYaAIlkdnygVIEl0O4Av69NtuQWcrjMOv6DODPuhuGLDnbsARz3AwiiI/EkIMMlxQDUcrZ9yoyJvTNjcVQ==", + "dev": true + }, + "babel-preset-jest": { + "version": "22.4.4", + "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-22.4.4.tgz", + "integrity": "sha512-+dxMtOFwnSYWfum0NaEc0O03oSdwBsjx4tMSChRDPGwu/4wSY6Q6ANW3wkjKpJzzguaovRs/DODcT4hbSN8yiA==", + "dev": true, + "requires": { + "babel-plugin-jest-hoist": "^22.4.4", + "babel-plugin-syntax-object-rest-spread": "^6.13.0" + } + }, "babylon": { "version": "6.18.0", "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz", diff --git a/frontend/package.json b/frontend/package.json index 34a246d..bd01c42 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -14,6 +14,7 @@ "dependencies": { "apollo-boost": "^0.1.6", "apollo-client": "^2.3.1", + "babel-core": "^7.0.0-bridge.0", "babel-plugin-styled-components": "^1.5.1", "date-fns": "^2.0.0-alpha.7", "downshift": "^1.31.14", @@ -35,6 +36,7 @@ "styled-components": "^3.2.6" }, "devDependencies": { + "babel-jest": "^23.0.0", "babel-plugin-module-resolver": "^3.1.1", "casual": "^1.5.19", "enzyme": "^3.3.0", diff --git a/frontend/pages/_app.js b/frontend/pages/_app.js index 65cc378..4e9af74 100644 --- a/frontend/pages/_app.js +++ b/frontend/pages/_app.js @@ -1,7 +1,6 @@ import App, { Container } from 'next/app'; import { ApolloProvider } from 'react-apollo'; import withData from '../lib/withData'; -import { CURRENT_USER_QUERY } from '../queries/queries.graphql'; import Page from '../components/Page'; // Next.js wraps each Page in an <App></App> component. This is handy for when you want to persist anything from page to page, or just access a component that is 1 level higher than each page. diff --git a/frontend/queries/queries.graphql b/frontend/queries/queries.graphql deleted file mode 100644 index ababde3..0000000 --- a/frontend/queries/queries.graphql +++ /dev/null @@ -1,233 +0,0 @@ -fragment itemDetails on Item { - __typename - id - title - price - description - image - largeImage -} - -mutation CREATE_ITEM_MUTATION($description: String!, $title: String!, $price: Int!, $image: String, $largeImage: String) { - createItem(description: $description, title: $title, price: $price, image: $image, largeImage: $largeImage) { - ...itemDetails - } -} - -mutation SIGNUP_MUTATION($email: String!, $name: String!, $password: String!) { - signup(email: $email, name: $name, password: $password) { - id - email - name - } -} - -mutation SIGNIN_MUTATION($email: String!, $password: String!) { - signin(email: $email, password: $password) { - id - email - name - } -} - -mutation SIGN_OUT_MUTATION { - signout { - message - } -} - -mutation REQUEST_RESET_MUTATION($email: String!) { - requestReset(email: $email) { - id - } -} - -mutation RESET_MUTATION($resetToken: String!, $password: String!, $confirmPassword: String!) { - resetPassword(resetToken: $resetToken, password: $password, confirmPassword: $confirmPassword) { - id - email - name - } -} - -mutation CREATE_ORDER_MUTATION($token: String!) { - createOrder(token: $token) { - id - charge - total - items { - id - title - } - } -} - -query ALL_ITEMS_QUERY($skip: Int = 0, $first: Int = 4) { - itemsConnection(orderBy: createdAt_DESC, first: $first, skip: $skip) { - aggregate { - count - } - } - items(orderBy: createdAt_DESC, first: $first, skip: $skip) { - ...itemDetails - } -} - -query SINGLE_ITEM_QUERY($id: ID!) { - items(where: { id: $id }) { - user { - id - email - name - } - ...itemDetails - } -} - -query SINGLE_ORDER_QUERY($id: ID!) { - order(id: $id) { - id - charge - total - createdAt - user { - id - } - items { - id - title - price - description - image - quantity - } - } -} - -query SEARCH_ITEMS_QUERY($searchTerm: String!) { - items( - where: { - OR: [ - { title_contains: $searchTerm } - { description_contains: $searchTerm } - ] - } - ) { - ...itemDetails - } -} - -mutation REMOVE_ITEM_MUTATION($id: ID!) { - deleteItem(id: $id) { - id - title - description - } -} - -mutation UPDATE_ITEM_MUTATION( - $id: ID! - $title: String - $description: String - $price: Int -) { - updateItem( - id: $id - description: $description - title: $title - price: $price - ) { - ...itemDetails - } -} - -mutation UPDATE_USER_MUTATION($name: String!) { - updateUser(name: $name) { - name - } -} - -query CURRENT_USER_QUERY { - me { - id - email - name - permissions - orders { - id - charge - total - } - cart { - id - quantity - item { - ...itemDetails - } - } - } -} - -query USER_ORDERS_QUERY { - orders(orderBy: createdAt_DESC) { - id - total - createdAt - updatedAt - items { - id - title - price - description - quantity - image - } - } -} - -mutation ADD_TO_CART_MUTATION($id: ID!) { - addToCart(id: $id) { - id - quantity - item { - id - price - description - image - title - } - } -} - -mutation REMOVE_FROM_CART_MUTATION($id: ID!) { - removeFromCart(id: $id) { - id - } -} - -query ALL_USERS_QUERY { - users { - id - name - email - permissions - } -} - -mutation UPDATE_PERMISSIONS_MUTATION($permissions: [Permission], $userId: ID!) { - updatePermissions(permissions: $permissions, userId: $userId) { - id - permissions - name - email - } -} - -query LOCAL_STATE_QUERY { - cartOpen @client -} - -mutation TOGGLE_CART_MUTATION { - toggleCart @client -} - |