diff options
Diffstat (limited to 'frontend')
| -rw-r--r-- | frontend/components/CreateItem.js | 21 | ||||
| -rw-r--r-- | frontend/components/DeleteItem.js | 6 | ||||
| -rw-r--r-- | frontend/components/Item.js | 4 | ||||
| -rw-r--r-- | frontend/components/Items.js | 15 | ||||
| -rw-r--r-- | frontend/components/Nav.js | 4 | ||||
| -rw-r--r-- | frontend/components/Pagination.js | 2 | ||||
| -rw-r--r-- | frontend/components/Search.js | 118 | ||||
| -rw-r--r-- | frontend/components/Signin.js | 3 | ||||
| -rw-r--r-- | frontend/components/Signout.js | 1 | ||||
| -rw-r--r-- | frontend/package-lock.json | 386 | ||||
| -rw-r--r-- | frontend/package.json | 14 | ||||
| -rw-r--r-- | frontend/queries/index.js | 16 |
12 files changed, 211 insertions, 379 deletions
diff --git a/frontend/components/CreateItem.js b/frontend/components/CreateItem.js index 625bf89..49f2f8f 100644 --- a/frontend/components/CreateItem.js +++ b/frontend/components/CreateItem.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import { Mutation } from 'react-apollo'; -import { CREATE_ITEM_MUTATION } from '../queries'; +import { CREATE_ITEM_MUTATION, ALL_ITEMS_QUERY } from '../queries'; import Error from './ErrorMessage'; import Form from './styles/Form'; import PropTypes from 'prop-types'; @@ -42,9 +42,22 @@ class CreateItem extends Component { }); }; + // TODO: Problem here - if I refetch page 1, page 2 to infinity are still out of date. I need to refetch all the pages somehow? without @connection render() { return ( - <Mutation mutation={CREATE_ITEM_MUTATION} variables={this.state}> + <Mutation + mutation={CREATE_ITEM_MUTATION} + variables={this.state} + refetchQueries={[ + { + query: ALL_ITEMS_QUERY, + variables: { + skip: 0, + first: 2, + }, + }, + ]} + > {(createItem, { loading, error }) => ( <Form onSubmit={async e => { @@ -62,7 +75,9 @@ class CreateItem extends Component { <label> Image <input required onChange={this.uploadFile} type="file" accept=".png, .jpg, .jpeg" /> - {this.state.image ? <img src={this.state.image} width="100" alt={this.state.title} /> : null} + {this.state.image ? ( + <img src={this.state.image} width="100" alt={this.state.title} /> + ) : null} </label> <label> Title diff --git a/frontend/components/DeleteItem.js b/frontend/components/DeleteItem.js index 8609ca7..e854340 100644 --- a/frontend/components/DeleteItem.js +++ b/frontend/components/DeleteItem.js @@ -20,7 +20,11 @@ class DeleteItem extends React.Component { render() { return ( - <Mutation mutation={REMOVE_ITEM_MUTATION} variables={{ id: this.props.id }} update={this.update}> + <Mutation + mutation={REMOVE_ITEM_MUTATION} + variables={{ id: this.props.id }} + update={this.update} + > {(removeItem, { error }) => ( <button onClick={() => { diff --git a/frontend/components/Item.js b/frontend/components/Item.js index 050ec17..2ed5742 100644 --- a/frontend/components/Item.js +++ b/frontend/components/Item.js @@ -35,7 +35,6 @@ const Item = styled.div` & > * { background: white; border: 0; - text-align: center; font-size: 1rem; padding: 1rem; } @@ -44,10 +43,11 @@ const Item = styled.div` const PriceTag = styled.span` background: ${props => props.theme.red}; - transform: rotate(2deg); + transform: rotate(3deg); color: white; font-weight: 600; padding: 5px; + line-height: 1; font-size: 3rem; display: inline-block; position: absolute; diff --git a/frontend/components/Items.js b/frontend/components/Items.js index e26408e..6a5defa 100644 --- a/frontend/components/Items.js +++ b/frontend/components/Items.js @@ -23,28 +23,25 @@ class ItemList extends React.Component { static propTypes = { page: PropTypes.number.isRequired, }; - componentDidUpdate(lastProps) { - if (lastProps.page === this.props.page) return; - // update the query - console.log('This fires, and should update the query'); - } render() { return ( <Center key={this.props.page}> <Pagination page={this.props.page} /> <Query query={ALL_ITEMS_QUERY} - fetchPolicy="cache-and-network" - ssr={false} variables={{ skip: this.props.page * perPage - perPage, first: perPage, }} > - {({ data, error, loading, variables, refetch }) => { + {({ data, error, loading }) => { if (loading) return <div>Loading</div>; if (error) return <div>Error</div>; - return <Items key={this.props.page}>{data.items.map(item => <Item key={item.id} item={item} />)}</Items>; + return ( + <Items key={this.props.page}> + {data.items.map(item => <Item key={item.id} item={item} />)} + </Items> + ); }} </Query> <Pagination page={this.props.page} /> diff --git a/frontend/components/Nav.js b/frontend/components/Nav.js index 34c00cf..80f91c6 100644 --- a/frontend/components/Nav.js +++ b/frontend/components/Nav.js @@ -25,6 +25,10 @@ const StyledUl = styled.ul` background: none; border: 0; cursor: pointer; + @media (max-width: 700px) { + font-size: 10px; + padding: 0 10px; + } &:before { content: ''; width: 2px; diff --git a/frontend/components/Pagination.js b/frontend/components/Pagination.js index d42c807..64e749a 100644 --- a/frontend/components/Pagination.js +++ b/frontend/components/Pagination.js @@ -4,7 +4,7 @@ import styled from 'styled-components'; import Link from 'next/link'; import PropTypes from 'prop-types'; import { perPage } from '../config'; -import { ALL_ITEMS_QUERY } from '../queries/index'; +import { ALL_ITEMS_QUERY, ITEM_COUNT_QUERY } from '../queries/index'; const PaginationStyles = styled.div` text-align: center; diff --git a/frontend/components/Search.js b/frontend/components/Search.js index b8816ec..49c5023 100644 --- a/frontend/components/Search.js +++ b/frontend/components/Search.js @@ -1,9 +1,8 @@ import Downshift from 'downshift'; -import { Query } from 'react-apollo'; import Router from 'next/router'; import styled from 'styled-components'; import debounce from 'lodash.debounce'; - +import { client } from '../lib/withData'; import { SEARCH_ITEMS_QUERY } from '../queries'; function routeToItem(item) { @@ -43,77 +42,72 @@ const SearchStyles = styled.div` padding: 10px; border: 0; font-size: 2rem; + &.loading { + background: red; + } } `; -function AutoComplete(props) { - const { items, onChange, loading } = props; - return ( - <Downshift onChange={routeToItem} itemToString={i => (i === null ? '' : i.title)}> - {({ getInputProps, getItemProps, isOpen, inputValue, highlightedIndex }) => ( - <div> - {/* This is the searchInput */} - {loading && 'LOADING'} - <input - {...getInputProps({ - placeholder: 'Search For Item', - id: 'search', - onChange: e => { - props.refetch({ searchTerm: e.target.value }); - }, - })} - /> - {isOpen ? ( - <DropDown> - {/* This is the Dropdown */} - {items.map((item, index) => ( - <DropDownItem - {...getItemProps({ item })} - key={item.id} - highlighted={highlightedIndex === index} - > - <img width="50" src={item.image} alt={item.title} /> - {item.title} - </DropDownItem> - ))} - {!items.length && <DropDownItem>Nothing Found for {inputValue}...</DropDownItem>} - </DropDown> - ) : null} - </div> - )} - </Downshift> - ); -} - -// TODO: This should not fire a queryon page load -class Search extends React.Component { +class AutoComplete extends React.Component { state = { - skip: true, + items: [], + loading: false, }; - componentDidMount() { - this.setState({ skip: false }); - } + onChange = debounce(async e => { + if (!e.target.value) { + return this.setState({ items: [] }); + } + this.setState({ loading: true }); + const res = await client.query({ + query: SEARCH_ITEMS_QUERY, + variables: { searchTerm: e.target.value }, + }); + this.setState({ items: res.data.items, loading: false }); + }, 350); + render() { return ( <SearchStyles> - <Query - skip={this.state.skip} - query={SEARCH_ITEMS_QUERY} - variables={{ searchTerm: '' }} - fetchPolicy="network-only" - > - {({ data, error, loading, refetch }) => - console.log('QUERY', data.items) || ( - <AutoComplete - loading={loading} - items={data.items || []} - refetch={debounce(refetch, 300)} + <Downshift onChange={routeToItem} itemToString={i => (i === null ? '' : i.title)}> + {({ getInputProps, getItemProps, isOpen, inputValue, highlightedIndex }) => ( + <div> + {/* This is the searchInput */} + <input + {...getInputProps({ + placeholder: 'Search For Item', + id: 'search', + className: this.state.loading ? 'loading' : '', + onChange: e => { + e.persist(); + this.onChange(e); + }, + })} /> - )} - </Query> + {/* This is the Dropdown */} + {isOpen && ( + <DropDown> + {this.state.items.map((item, index) => ( + <DropDownItem + {...getItemProps({ item })} + key={item.id} + highlighted={highlightedIndex === index} + > + <img width="50" src={item.image} alt={item.title} /> + {item.title} + </DropDownItem> + ))} + {/* Found Nothing State */} + {!this.state.items.length && ( + <DropDownItem>Nothing Found for {inputValue}...</DropDownItem> + )} + </DropDown> + )} + </div> + )} + </Downshift> </SearchStyles> ); } } -export default Search; +export default AutoComplete; diff --git a/frontend/components/Signin.js b/frontend/components/Signin.js index 238e167..e701e94 100644 --- a/frontend/components/Signin.js +++ b/frontend/components/Signin.js @@ -15,8 +15,7 @@ class Signin extends Component { e.preventDefault(); const res = await signin(); localStorage.setItem('token', res.data.signin.token); - // client.query({ query: CURRENT_USER_QUERY, fetchPolicy: 'network-only' }); - client.query({ query: CURRENT_USER_QUERY }); + client.query({ query: CURRENT_USER_QUERY, fetchPolicy: 'network-only' }); }; saveToState = e => { diff --git a/frontend/components/Signout.js b/frontend/components/Signout.js index d7c7816..b2a7ad6 100644 --- a/frontend/components/Signout.js +++ b/frontend/components/Signout.js @@ -4,6 +4,7 @@ import { CURRENT_USER_QUERY } from '../queries'; class Signout extends Component { signout = refetch => { + console.log(refetch); console.log('Signing Out'); localStorage.removeItem('token'); refetch(); diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 46aaf28..3ad143a 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -63,6 +63,11 @@ "to-fast-properties": "2.0.0" } }, + "@emotion/is-prop-valid": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.5.2.tgz", + "integrity": "sha1-T0dxfCvM6HWeEZl1IOa8sUMm9Uo=" + }, "@semantic-release/commit-analyzer": { "version": "3.0.7", "resolved": "https://registry.npmjs.org/@semantic-release/commit-analyzer/-/commit-analyzer-3.0.7.tgz", @@ -292,11 +297,6 @@ "string-width": "2.1.1" } }, - "ansi-escapes": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz", - "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=" - }, "ansi-html": { "version": "0.0.7", "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz", @@ -875,14 +875,6 @@ "mkdirp": "0.5.1" } }, - "babel-macros": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/babel-macros/-/babel-macros-1.2.0.tgz", - "integrity": "sha512-/GIwkOeNHQU9R27Bkt0jHrJgaXBX5KLKrIH5h/iGebvKppvL9e4wKCgrl4qwUj0qssBHQFeSavk3lG2lQgdq8w==", - "requires": { - "cosmiconfig": "3.1.0" - } - }, "babel-messages": { "version": "6.23.0", "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz", @@ -900,16 +892,17 @@ } }, "babel-plugin-emotion": { - "version": "8.0.12", - "resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-8.0.12.tgz", - "integrity": "sha512-GVxl6Y86I2PPICtFqabf5qvcVc0MD8PJbLujJ9UV1tdC5QoKMe+dZD0DCpdTDEzlOJVwetMu7m+bg66NeGi49w==", + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-9.1.0.tgz", + "integrity": "sha512-p5WF1ZqYjtXfzi4FMTXftf8svRTrlZOwssYcoWdEXLY+cnxu9hzRk2eN3BAcgtvwPslj003hNKv3fwYeB9ycDA==", "requires": { "@babel/helper-module-imports": "7.0.0-beta.32", - "babel-macros": "1.2.0", + "babel-plugin-macros": "2.2.0", "babel-plugin-syntax-jsx": "6.18.0", "convert-source-map": "1.5.1", - "emotion-utils": "8.0.12", + "emotion-utils": "9.1.0", "find-root": "1.1.0", + "mkdirp": "0.5.1", "source-map": "0.5.7", "touch": "1.0.0" }, @@ -946,6 +939,14 @@ "integrity": "sha512-zhvv4f6OTWy2bYevcJftwGCWXMFe7pqoz41IhMi4xna7xNsX5NygdagsrE0y6kkfuXq8UalwvPwKTyAxME2E/g==", "dev": true }, + "babel-plugin-macros": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.2.0.tgz", + "integrity": "sha512-HGdenPU9+WGhg++P65O+6aIdmXx99p58K7VtAtizC3eUHbO4FXfyfK9SCJubylcyKziEB3nMAUDFHeyDUj38eA==", + "requires": { + "cosmiconfig": "4.0.0" + } + }, "babel-plugin-module-resolver": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/babel-plugin-module-resolver/-/babel-plugin-module-resolver-3.1.1.tgz", @@ -1344,23 +1345,6 @@ "babel-types": "6.26.0" } }, - "babel-polyfill": { - "version": "6.23.0", - "resolved": "https://registry.npmjs.org/babel-polyfill/-/babel-polyfill-6.23.0.tgz", - "integrity": "sha1-g2TKYt+Or7gwSZ9pkXdGbDsDSZ0=", - "requires": { - "babel-runtime": "6.26.0", - "core-js": "2.5.4", - "regenerator-runtime": "0.10.5" - }, - "dependencies": { - "regenerator-runtime": { - "version": "0.10.5", - "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz", - "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg=" - } - } - }, "babel-preset-env": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz", @@ -1958,11 +1942,6 @@ "resolved": "https://registry.npmjs.org/change-emitter/-/change-emitter-0.1.6.tgz", "integrity": "sha1-6LL+PX8at9aaMhma/5HqaTFAlRU=" }, - "chardet": { - "version": "0.4.2", - "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.4.2.tgz", - "integrity": "sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I=" - }, "cheerio": { "version": "1.0.0-rc.2", "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.2.tgz", @@ -2093,19 +2072,6 @@ "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz", "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM=" }, - "cli-cursor": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz", - "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=", - "requires": { - "restore-cursor": "2.0.0" - } - }, - "cli-width": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.2.0.tgz", - "integrity": "sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk=" - }, "cliui": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz", @@ -2633,22 +2599,23 @@ "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=" }, "cosmiconfig": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-3.1.0.tgz", - "integrity": "sha512-zedsBhLSbPBms+kE7AH4vHg6JsKDz6epSv2/+5XHs8ILHlgDciSJfSWf8sX9aQ52Jb7KI7VswUTsLpR/G0cr2Q==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-4.0.0.tgz", + "integrity": "sha512-6e5vDdrXZD+t5v0L8CrurPeybg4Fmf+FCSYxXKYVAqLUtyCSbuyqE059d0kDthTNRzKVjL7QMgNpEUlsoYH3iQ==", "requires": { "is-directory": "0.3.1", "js-yaml": "3.11.0", - "parse-json": "3.0.0", + "parse-json": "4.0.0", "require-from-string": "2.0.1" }, "dependencies": { "parse-json": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-3.0.0.tgz", - "integrity": "sha1-+m9HsY4jgm6tMvJj50TQ4ehH+xM=", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz", + "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=", "requires": { - "error-ex": "1.3.1" + "error-ex": "1.3.1", + "json-parse-better-errors": "1.0.1" } } } @@ -2662,6 +2629,32 @@ "elliptic": "6.4.0" } }, + "create-emotion": { + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.1.1.tgz", + "integrity": "sha512-cXm9BJlgjZGOrSUjOvt7e9ac/UMdqNcwvAXk2CLaVNDyUbovyae0Cuws5cVtTC2qq0qeDIOfAf65pmHRpo2j4w==", + "requires": { + "emotion-utils": "9.1.0", + "stylis": "3.5.0", + "stylis-rule-sheet": "0.0.10" + }, + "dependencies": { + "stylis-rule-sheet": { + "version": "0.0.10", + "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz", + "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw==" + } + } + }, + "create-emotion-styled": { + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/create-emotion-styled/-/create-emotion-styled-9.1.1.tgz", + "integrity": "sha512-oadr4YK9+l3RyywjD3WGPekN3767E8FSRtVUyVK9iggmSKRyN69kmhNQ6F+06EbsDUZK+868gj6bTo5yePUQEQ==", + "requires": { + "@emotion/is-prop-valid": "0.5.2", + "emotion-utils": "9.1.0" + } + }, "create-error-class": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz", @@ -3235,9 +3228,9 @@ "integrity": "sha1-hk7xN5rO1Vzm+V3r7NzhefegzR0=" }, "downshift": { - "version": "1.31.2", - "resolved": "https://registry.npmjs.org/downshift/-/downshift-1.31.2.tgz", - "integrity": "sha512-z8by12jDYb8i/5vbDA3fH/dQMIUIGcb/tuijT5WTPnbL/51YUA0iaKkdJORhnp6SfeRt8briMpOcMGFRtoABzw==" + "version": "1.31.3", + "resolved": "https://registry.npmjs.org/downshift/-/downshift-1.31.3.tgz", + "integrity": "sha512-u5FWNxgEcE0GIp2dgPP7b7pLrjIPHEK/cgo5Rg8wPPvHKp+zhw9BwnXYksrtWkLCIxAe2AaZhcAVJdm0Ub9qBw==" }, "duplexer3": { "version": "0.1.4", @@ -3299,27 +3292,18 @@ "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k=" }, "emotion": { - "version": "8.0.12", - "resolved": "https://registry.npmjs.org/emotion/-/emotion-8.0.12.tgz", - "integrity": "sha512-WwPA6wrFo/Rwkcmn3ptO8Bpjob1lgRtBl4KJxagfQ+ExwnIryql3JNNwQX6TvJvlLxQm5ByrG71PZbKode1hpw==", + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/emotion/-/emotion-9.1.1.tgz", + "integrity": "sha512-nWCO529SltskIdUf46J55Z5C/7FyiisatVVfbzYGthyfNwdxiC7LaHH9iAHPp2j7uo7AWe7jALdKsqPKdfk4KQ==", "requires": { - "babel-plugin-emotion": "8.0.12", - "emotion-utils": "8.0.12", - "stylis": "3.5.0", - "stylis-rule-sheet": "0.0.5" - }, - "dependencies": { - "stylis-rule-sheet": { - "version": "0.0.5", - "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.5.tgz", - "integrity": "sha512-d1i8CktqcZI8oR239dRh/tZmWRxje/WR8rTAiXcN+oJehNhSD8OIYObP34qPdlOn37iu1ysBEm186WIRKpUU2w==" - } + "babel-plugin-emotion": "9.1.0", + "create-emotion": "9.1.1" } }, "emotion-utils": { - "version": "8.0.12", - "resolved": "https://registry.npmjs.org/emotion-utils/-/emotion-utils-8.0.12.tgz", - "integrity": "sha512-rEW3CSWnSh+7yD9sF9aniSCQFVDGG+iW7vM/0LpaavmtK3by8hG7cAcr5cMISQf4MxAFwv0nijZMSR5Fftjw+A==" + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/emotion-utils/-/emotion-utils-9.1.0.tgz", + "integrity": "sha512-Zdy9TiZzMDRsCufivL/ZhQ0JdfGGSOc20opRjaBOemF5h2kYI/MD/bLcXfAZgzYVL12WNQegZIme6l+N/JFE4Q==" }, "encodeurl": { "version": "1.0.2", @@ -3871,16 +3855,6 @@ } } }, - "external-editor": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.1.0.tgz", - "integrity": "sha512-E44iT5QVOUJBKij4IIV3uvxuNlbKS38Tw1HiupxEIHPv9qtC2PrDYohbXV5U+1jnfIXttny8gUhj+oZvflFlzA==", - "requires": { - "chardet": "0.4.2", - "iconv-lite": "0.4.19", - "tmp": "0.0.33" - } - }, "extglob": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.4.tgz", @@ -3964,14 +3938,6 @@ } } }, - "figures": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz", - "integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI=", - "requires": { - "escape-string-regexp": "1.0.5" - } - }, "filename-regex": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz", @@ -5910,50 +5876,6 @@ "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz", "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==" }, - "inquirer": { - "version": "3.0.6", - "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-3.0.6.tgz", - "integrity": "sha1-4EqqnQW3o8ubD0B9BDdfBEcZA0c=", - "requires": { - "ansi-escapes": "1.4.0", - "chalk": "1.1.3", - "cli-cursor": "2.1.0", - "cli-width": "2.2.0", - "external-editor": "2.1.0", - "figures": "2.0.0", - "lodash": "4.17.5", - "mute-stream": "0.0.7", - "run-async": "2.3.0", - "rx": "4.1.0", - "string-width": "2.1.1", - "strip-ansi": "3.0.1", - "through": "2.3.8" - }, - "dependencies": { - "ansi-styles": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", - "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=" - }, - "chalk": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", - "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", - "requires": { - "ansi-styles": "2.2.1", - "escape-string-regexp": "1.0.5", - "has-ansi": "2.0.0", - "strip-ansi": "3.0.1", - "supports-color": "2.0.0" - } - }, - "supports-color": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", - "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=" - } - } - }, "interpret": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.1.0.tgz", @@ -6259,11 +6181,6 @@ "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=", "dev": true }, - "is-promise": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz", - "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=" - }, "is-property": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz", @@ -8286,11 +8203,6 @@ "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" }, - "mute-stream": { - "version": "0.0.7", - "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz", - "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=" - }, "mv": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/mv/-/mv-2.1.1.tgz", @@ -8544,9 +8456,9 @@ "isomorphic-fetch": "2.2.1", "lodash.isfunction": "3.0.9", "next": "5.1.0", - "react": "16.3.0", - "react-apollo": "2.1.1", - "react-dom": "16.3.0" + "react": "16.3.1", + "react-apollo": "2.1.2", + "react-dom": "16.3.1" }, "dependencies": { "graphql": { @@ -8587,9 +8499,9 @@ "isomorphic-unfetch": "2.0.0", "next": "4.2.3", "prop-types": "15.6.1", - "react": "16.3.0", - "react-apollo": "2.1.1", - "react-dom": "16.3.0" + "react": "16.3.1", + "react-apollo": "2.1.2", + "react-dom": "16.3.1" }, "dependencies": { "ajv": { @@ -9281,69 +9193,6 @@ "wrappy": "1.0.2" } }, - "onetime": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/onetime/-/onetime-2.0.1.tgz", - "integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ=", - "requires": { - "mimic-fn": "1.2.0" - } - }, - "opencollective": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/opencollective/-/opencollective-1.0.3.tgz", - "integrity": "sha1-ruY3K8KBRFg2kMPKja7PwSDdDvE=", - "requires": { - "babel-polyfill": "6.23.0", - "chalk": "1.1.3", - "inquirer": "3.0.6", - "minimist": "1.2.0", - "node-fetch": "1.6.3", - "opn": "4.0.2" - }, - "dependencies": { - "ansi-styles": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", - "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=" - }, - "chalk": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", - "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", - "requires": { - "ansi-styles": "2.2.1", - "escape-string-regexp": "1.0.5", - "has-ansi": "2.0.0", - "strip-ansi": "3.0.1", - "supports-color": "2.0.0" - } - }, - "node-fetch": { - "version": "1.6.3", - "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.6.3.tgz", - "integrity": "sha1-3CNO3WSJmC1Y6PDbT2lQKavNjAQ=", - "requires": { - "encoding": "0.1.12", - "is-stream": "1.1.0" - } - }, - "supports-color": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", - "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=" - } - } - }, - "opn": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz", - "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU=", - "requires": { - "object-assign": "4.1.1", - "pinkie-promise": "2.0.1" - } - }, "optimist": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz", @@ -10039,9 +9888,9 @@ } }, "react": { - "version": "16.3.0", - "resolved": "https://registry.npmjs.org/react/-/react-16.3.0.tgz", - "integrity": "sha512-Qh35tNbwY8SLFELkN3PCLO16EARV+lgcmNkQnoZXfzAF1ASRpeucZYUwBlBzsRAzTb7KyfBaLQ4/K/DLC6MYeA==", + "version": "16.3.1", + "resolved": "https://registry.npmjs.org/react/-/react-16.3.1.tgz", + "integrity": "sha512-NbkxN9jsZ6+G+ICsLdC7/wUD26uNbvKU/RAxEWgc9kcdKvROt+5d5j2cNQm5PSFTQ4WNGsR3pa4qL2Q0/WSy1w==", "requires": { "fbjs": "0.8.16", "loose-envify": "1.3.1", @@ -10050,9 +9899,9 @@ } }, "react-apollo": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/react-apollo/-/react-apollo-2.1.1.tgz", - "integrity": "sha512-p8SkckP2naoVVmkDK9eWK8AXfU3ocBlc77pWUMeh5smilMY9a5FT/0QtxF3C9WnkQbMnrimRKKEpJUO8w2KJ9w==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/react-apollo/-/react-apollo-2.1.2.tgz", + "integrity": "sha512-d4OdB3sjvTUfYzXuRiiXnSckyBaZzdvFEZ9DrdoErqNGv3x+2+RhnEEJemlXDRve78Mf3cqkSeIhjSxMszrmPQ==", "requires": { "fbjs": "0.8.16", "hoist-non-react-statics": "2.3.1", @@ -10061,24 +9910,15 @@ "prop-types": "15.6.1" } }, - "react-debounce-input": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/react-debounce-input/-/react-debounce-input-3.2.0.tgz", - "integrity": "sha1-aXjGBh2Jj1SfQEF/sNLrvs9Qqqo=", - "requires": { - "lodash.debounce": "4.0.8", - "prop-types": "15.6.1" - } - }, "react-deep-force-update": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/react-deep-force-update/-/react-deep-force-update-2.1.1.tgz", "integrity": "sha1-jqQmPNZFWgULN0RbPwj9g52G6Qk=" }, "react-dom": { - "version": "16.3.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.3.0.tgz", - "integrity": "sha512-xT/FxawAurL6AV8YtAP7LkdDJFFX2vvv17AqFLQRF81ZtWLXkV/0dcAaiFIy0lmoQEFT931TU9aaH+5dBUxTcw==", + "version": "16.3.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.3.1.tgz", + "integrity": "sha512-2Infg89vzahq8nfVi1GkjPqq0vrBvf0f3T0+dTtyjq4f6HKOqKixAK25Vr593O3QTx4kw/vmUtAJwerlevNWOA==", "requires": { "fbjs": "0.8.16", "loose-envify": "1.3.1", @@ -10087,12 +9927,12 @@ } }, "react-emotion": { - "version": "8.0.12", - "resolved": "https://registry.npmjs.org/react-emotion/-/react-emotion-8.0.12.tgz", - "integrity": "sha512-shGa+uer+Ng1uRwqkdVIYW5zsxx4/kc5za8zRMhrTaGJCpU3uwQsdMpmX2kF4chJZvRsfxW+2cBue3EnJeX5zw==", + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/react-emotion/-/react-emotion-9.1.1.tgz", + "integrity": "sha512-ydM/USfC5vd0cuZ/Lc0kYoBp1kU8PZ4iqEHXgh2BgV2IWJGlOBibQgVfk69VyPSfToPcvywIARPDxJ7BqVLH+w==", "requires": { - "babel-plugin-emotion": "8.0.12", - "emotion-utils": "8.0.12" + "babel-plugin-emotion": "9.1.0", + "create-emotion-styled": "9.1.1" } }, "react-hot-loader": { @@ -10141,14 +9981,13 @@ } }, "react-spinners": { - "version": "0.2.6", - "resolved": "https://registry.npmjs.org/react-spinners/-/react-spinners-0.2.6.tgz", - "integrity": "sha512-DBKmRpoQi0NpG4LcUMQw+DzN8fyHZApoJ2gwnwTRKyPOqlfncypUhI0Or77Ueur049t+A9QO/gBke9RQ++mEsw==", + "version": "0.3.1", + "resolved": "https://registry.npmjs.org/react-spinners/-/react-spinners-0.3.1.tgz", + "integrity": "sha512-z3CY20uf6yodDU2LZ8d/jmNukHKQj2bjjzV7+HXhThkPj+2kRlUvIxa4/bTAsSIsCKnvRT7niJ/Xlo12WnIrrA==", "requires": { - "babel-plugin-emotion": "8.0.12", - "emotion": "8.0.12", + "emotion": "9.1.1", "prop-types": "15.6.1", - "react-emotion": "8.0.12", + "react-emotion": "9.1.1", "recompose": "0.26.0" } }, @@ -10554,15 +10393,6 @@ "lowercase-keys": "1.0.1" } }, - "restore-cursor": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz", - "integrity": "sha1-n37ih/gv0ybU/RYpI9YhKe7g368=", - "requires": { - "onetime": "2.0.1", - "signal-exit": "3.0.2" - } - }, "ret": { "version": "0.1.15", "resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz", @@ -10608,14 +10438,6 @@ "nearley": "2.13.0" } }, - "run-async": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz", - "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=", - "requires": { - "is-promise": "2.1.0" - } - }, "run-queue": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/run-queue/-/run-queue-1.0.3.tgz", @@ -10624,11 +10446,6 @@ "aproba": "1.2.0" } }, - "rx": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz", - "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=" - }, "safe-buffer": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz", @@ -11352,16 +11169,15 @@ "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=" }, "styled-components": { - "version": "3.2.3", - "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-3.2.3.tgz", - "integrity": "sha1-UPcSBzIO6x71Od7EY38h9ePJNrQ=", + "version": "3.2.5", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-3.2.5.tgz", + "integrity": "sha1-tdXX1hirJA/xBgK1yliGuNs9Cg0=", "requires": { "buffer": "5.1.0", "css-to-react-native": "2.1.2", "fbjs": "0.8.16", - "hoist-non-react-statics": "1.2.0", + "hoist-non-react-statics": "2.5.0", "is-plain-object": "2.0.4", - "opencollective": "1.0.3", "prop-types": "15.6.1", "stylis": "3.5.0", "stylis-rule-sheet": "0.0.10", @@ -11383,9 +11199,9 @@ "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo=" }, "hoist-non-react-statics": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz", - "integrity": "sha1-qkSM8JhtVcxAdzsXF0t90GbLfPs=" + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.0.tgz", + "integrity": "sha512-6Bl6XsDT1ntE0lHbIhr4Kp2PGcleGZ66qu5Jqk8lc0Xc/IeG6gVLmwUGs/K0Us+L8VWoKgj0uWdPMataOsm31w==" }, "stylis-rule-sheet": { "version": "0.0.10", @@ -11618,14 +11434,6 @@ "setimmediate": "1.0.5" } }, - "tmp": { - "version": "0.0.33", - "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz", - "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==", - "requires": { - "os-tmpdir": "1.0.2" - } - }, "tmpl": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz", diff --git a/frontend/package.json b/frontend/package.json index e182ba9..ef7534f 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -22,7 +22,7 @@ "apollo-link-state": "^0.4.1", "babel-plugin-styled-components": "^1.5.1", "date-fns": "^2.0.0-alpha.7", - "downshift": "^1.31.2", + "downshift": "^1.31.3", "express": "^4.16.3", "graphql": "^0.13.2", "graphql-tag": "^2.8.0", @@ -33,13 +33,13 @@ "next-with-apollo": "^1.0.6", "nprogress": "^0.2.0", "prop-types": "^15.6.1", - "react": "^16.3.0-alpha.1", - "react-apollo": "^2.1.0", - "react-dom": "^16.3.0-alpha.1", - "react-spinners": "^0.2.6", + "react": "^16.3.1", + "react-apollo": "^2.1.2", + "react-dom": "^16.3.1", + "react-spinners": "^0.3.1", "react-stripe-checkout": "^2.6.3", "react-transition-group": "^2.3.0", - "styled-components": "^3.2.3" + "styled-components": "^3.2.5" }, "devDependencies": { "babel-plugin-module-resolver": "^3.1.1", @@ -112,4 +112,4 @@ } } } -}
\ No newline at end of file +} diff --git a/frontend/queries/index.js b/frontend/queries/index.js index 1080a2e..6b3dd2a 100644 --- a/frontend/queries/index.js +++ b/frontend/queries/index.js @@ -74,18 +74,28 @@ export const CREATE_ORDER_MUTATION = gql` export const ALL_ITEMS_QUERY = gql` # Import the Fragment ${itemDetails} - query AllItemsQuery($skip: Int = 0, $first: Int = 3) { - itemsConnection(orderBy: createdAt_DESC, first: $first, skip: $skip) @connection(key: "itemsConnection") { + query AllItemsQuery($skip: Int = 0, $first: Int = 2) { + itemsConnection { aggregate { count } } - items(orderBy: createdAt_DESC, first: $first, skip: $skip) @connection(key: "items") { + items(orderBy: createdAt_DESC, first: $first, skip: $skip) { ...itemDetails } } `; +export const ITEM_COUNT_QUERY = gql` + query itemCountQuery { + itemsConnection { + aggregate { + count + } + } + } +`; + export const SINGLE_ITEM_QUERY = gql` ${itemDetails} query FindItem($id: ID!) { |