diff options
Diffstat (limited to 'frontend')
| -rw-r--r-- | frontend/components/SingleItem.js | 9 | ||||
| -rw-r--r-- | frontend/components/TakeMyMoney.js | 3 | ||||
| -rw-r--r-- | frontend/package-lock.json | 134 | ||||
| -rw-r--r-- | frontend/package.json | 4 | ||||
| -rw-r--r-- | frontend/pages/diagram.js | 10 | ||||
| -rw-r--r-- | frontend/pages/update.js | 9 | ||||
| -rw-r--r-- | frontend/queries/queries.graphql | 16 |
7 files changed, 52 insertions, 133 deletions
diff --git a/frontend/components/SingleItem.js b/frontend/components/SingleItem.js index b709ff1..f71e0fe 100644 --- a/frontend/components/SingleItem.js +++ b/frontend/components/SingleItem.js @@ -4,18 +4,24 @@ import styled from 'styled-components'; import Link from 'next/link'; import { SINGLE_ITEM_QUERY } from '../queries/queries.graphql'; import Error from './ErrorMessage'; +import AddToCart from './AddToCart'; const SingleItemStyles = styled.div` max-width: 1200px; margin: 2rem auto; box-shadow: ${props => props.theme.bs}; + display: grid; + grid-auto-columns: 1fr; + grid-auto-flow: column; + min-height: 800px; img { width: 100%; + height: 100%; object-fit: cover; } .details { margin: 3rem; - font-size: 3rem; + font-size: 2rem; } `; @@ -39,6 +45,7 @@ const SingleItem = props => ( > <a>Edit ✏️</a> </Link> + <AddToCart id={item.id} /> </div> </SingleItemStyles> ); diff --git a/frontend/components/TakeMyMoney.js b/frontend/components/TakeMyMoney.js index fef90de..5823d00 100644 --- a/frontend/components/TakeMyMoney.js +++ b/frontend/components/TakeMyMoney.js @@ -20,8 +20,9 @@ class TakeMyMoney extends Component { token: res.id, }, }); + console.log(order); // Route them to that order page - const { id } = order.data.CREATE_ORDER_MUTATION; + const { id } = order.data.createOrder; Router.push({ pathname: `/order`, query: { id }, diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 2f0e683..abdb745 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -1047,14 +1047,14 @@ "resolved": "https://registry.npmjs.org/@types/next/-/next-2.4.10.tgz", "integrity": "sha512-inIs4SZ8H9PScj84UwOO1EHM/5tnuDyzCYzYucItW91px9Q1aSxuWWGG6Rpm0EhPTHxPIF4kCiZ2x7QgEHoY1A==", "requires": { - "@types/node": "9.6.16", + "@types/node": "9.6.17", "@types/react": "16.3.14" } }, "@types/node": { - "version": "9.6.16", - "resolved": "https://registry.npmjs.org/@types/node/-/node-9.6.16.tgz", - "integrity": "sha512-fwUW7S8gaSVNpPa1XUdzI0URY71xqXsc90S9vKr2uFIUpVCKV+8ysnN9vvAFK8np4H03A7QGRkHpQvgah0964Q==" + "version": "9.6.17", + "resolved": "https://registry.npmjs.org/@types/node/-/node-9.6.17.tgz", + "integrity": "sha512-K/pOQpXevFVZYFWI+Oi6yDzVv4j665eEW3w5pXa/GOfWi7kwzHiSkX1kMEDwoAe0LcHFIOIezgOQfXfUXd392Q==" }, "@types/prop-types": { "version": "15.5.2", @@ -1066,7 +1066,7 @@ "resolved": "https://registry.npmjs.org/@types/react/-/react-16.3.14.tgz", "integrity": "sha512-wNUGm49fPl7eE2fnYdF0v5vSOrUMdKMQD/4NwtQRnb6mnPwtkhabmuFz37eq90+hhyfz0pWd38jkZHOcaZ6LGw==", "requires": { - "csstype": "2.5.1" + "csstype": "2.5.2" } }, "@types/zen-observable": { @@ -2295,8 +2295,8 @@ "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-3.2.7.tgz", "integrity": "sha512-oYVLxFVqpX9uMhOIQBLtZL+CX4uY8ZpWcjNTaxyWl5rO8yA9SSNikFnAfvk8J3P/7z3BZwNmEqFKaJoYltj3MQ==", "requires": { - "caniuse-lite": "1.0.30000841", - "electron-to-chromium": "1.3.46" + "caniuse-lite": "1.0.30000842", + "electron-to-chromium": "1.3.47" } }, "bser": { @@ -2393,9 +2393,9 @@ "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk=" }, "caniuse-lite": { - "version": "1.0.30000841", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000841.tgz", - "integrity": "sha512-LeOGLEY4hl6xZc/xMYOrVmSrHOybyHWNShFN51qCmDXo69nEGKHTJTfe6jdWe4hLxSJcwEIYtKHFFh93fF/kNA==" + "version": "1.0.30000842", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000842.tgz", + "integrity": "sha512-juspQHLwQRgptEM03HN66SpM/ggZUB+m49NAgJIaIS11aXVNeRB57sEY1X6tEzeK2THGvYWKZZu1wIbh+W7YTA==" }, "capture-exit": { "version": "1.2.0", @@ -2725,11 +2725,6 @@ "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz", "integrity": "sha1-uCeAl7m8IpNl3lxiz1/K7YtVmeU=" }, - "cookie": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz", - "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s=" - }, "copy-concurrently": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz", @@ -2889,9 +2884,9 @@ } }, "csstype": { - "version": "2.5.1", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.5.1.tgz", - "integrity": "sha512-qfG5lXkiUKz3kAuABSlpRxL9QL/U8ViJiXC6hvk/7tEJaCj7a2ZOW2kVtSFGpETOfQR7MicXjf/q1bmO1iShiA==" + "version": "2.5.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.5.2.tgz", + "integrity": "sha512-epoHrKPywwUhFTXadQNA5PPx4GChtkM03SkBeFZTaFtJcn6QfXpBkX2IAc4J9Oe18nha5NrTOo2OMOge+qH1mw==" }, "cyclist": { "version": "0.2.2", @@ -3220,9 +3215,9 @@ "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=" }, "electron-to-chromium": { - "version": "1.3.46", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.46.tgz", - "integrity": "sha1-AOheIidUFaiHUF5KtJc3GU8YubA=" + "version": "1.3.47", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.47.tgz", + "integrity": "sha1-dk6IfKkQTQGgrI6r7n38DizhQQQ=" }, "elliptic": { "version": "6.4.0", @@ -4483,9 +4478,9 @@ } }, "graphql-mock": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/graphql-mock/-/graphql-mock-1.0.1.tgz", - "integrity": "sha512-eqQs0kH0yXgZjbXIUgZb3YvIUi7b7jrTOyMPaQPdsJLlEYU2LQV9EFnwwiOAafPjYquJsVsR44rS0vIExC48ew==", + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/graphql-mock/-/graphql-mock-1.0.2.tgz", + "integrity": "sha512-HAVVFSviSclX1x7EaPPWU+YkzhRL6CP45Lec79qP7EszKKiszgjd/+8dLkcbkHi6KDPJseWfZnEveQXFJYyPDw==", "requires": { "apollo-link-schema": "1.1.0", "fast-deep-equal": "2.0.1", @@ -4514,7 +4509,7 @@ "resolved": "https://registry.npmjs.org/apollo-link/-/apollo-link-1.2.1.tgz", "integrity": "sha512-6Ghf+j3cQLCIvjXd2dJrLw+16HZbWbwmB1qlTc41BviB2hv+rK1nJr17Y9dWK0UD4p3i9Hfddx3tthpMKrueHg==", "requires": { - "@types/node": "9.6.16", + "@types/node": "9.6.17", "apollo-utilities": "1.0.12", "zen-observable-ts": "0.8.9" } @@ -6465,9 +6460,9 @@ "integrity": "sha512-3KL3fvuRkZ7s4IFOMfztb7zJp3QaVWnBeGoJlgB38XnCRPj/0tLzzLG5IB8NYOHbJ8g8UGrgZv44GLDk6CxTxA==" }, "next": { - "version": "6.0.3-canary.1", - "resolved": "https://registry.npmjs.org/next/-/next-6.0.3-canary.1.tgz", - "integrity": "sha1-SZ6rIqEcKsIRv6z7hJF4WtmBbMc=", + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/next/-/next-6.0.3.tgz", + "integrity": "sha1-t1n94uxIZPkhFs7k/NgFqvKFE2w=", "requires": { "@babel/core": "7.0.0-beta.42", "@babel/plugin-proposal-class-properties": "7.0.0-beta.42", @@ -6571,89 +6566,10 @@ "apollo-utilities": "1.0.12", "graphql": "0.13.2", "isomorphic-unfetch": "2.0.0", - "next": "6.0.2", + "next": "6.0.3", "prop-types": "15.6.1", "react-apollo": "2.1.4", "react-dom": "16.3.2" - }, - "dependencies": { - "next": { - "version": "6.0.2", - "resolved": "https://registry.npmjs.org/next/-/next-6.0.2.tgz", - "integrity": "sha1-1yUl63Je0aqFEpvSweZyJuJpDVw=", - "requires": { - "@babel/core": "7.0.0-beta.42", - "@babel/plugin-proposal-class-properties": "7.0.0-beta.42", - "@babel/plugin-proposal-object-rest-spread": "7.0.0-beta.42", - "@babel/plugin-syntax-dynamic-import": "7.0.0-beta.42", - "@babel/plugin-transform-react-jsx-source": "7.0.0-beta.42", - "@babel/plugin-transform-runtime": "7.0.0-beta.42", - "@babel/preset-env": "7.0.0-beta.42", - "@babel/preset-react": "7.0.0-beta.42", - "@babel/runtime": "7.0.0-beta.42", - "@babel/template": "7.0.0-beta.42", - "ansi-html": "0.0.7", - "babel-core": "7.0.0-bridge.0", - "babel-loader": "8.0.0-beta.2", - "babel-plugin-react-require": "3.0.0", - "babel-plugin-transform-react-remove-prop-types": "0.4.13", - "case-sensitive-paths-webpack-plugin": "2.1.1", - "cross-spawn": "5.1.0", - "del": "3.0.0", - "etag": "1.8.1", - "event-source-polyfill": "0.0.12", - "find-up": "2.1.0", - "fresh": "0.5.2", - "friendly-errors-webpack-plugin": "1.6.1", - "glob": "7.1.2", - "hoist-non-react-statics": "2.5.0", - "htmlescape": "1.1.1", - "http-errors": "1.6.2", - "http-status": "1.0.1", - "loader-utils": "1.1.0", - "minimist": "1.2.0", - "mkdirp-then": "1.2.0", - "path-to-regexp": "2.1.0", - "prop-types": "15.6.0", - "prop-types-exact": "1.1.1", - "react-hot-loader": "4.1.3", - "recursive-copy": "2.0.6", - "resolve": "1.5.0", - "send": "0.16.1", - "source-map": "0.5.7", - "strip-ansi": "3.0.1", - "styled-jsx": "2.2.6", - "touch": "3.1.0", - "uglifyjs-webpack-plugin": "1.1.6", - "unfetch": "3.0.0", - "update-check": "1.4.0", - "url": "0.11.0", - "uuid": "3.1.0", - "walk": "2.3.9", - "webpack": "3.10.0", - "webpack-dev-middleware": "1.12.0", - "webpack-hot-middleware": "2.19.1", - "webpack-sources": "1.1.0", - "write-file-webpack-plugin": "4.2.0" - }, - "dependencies": { - "prop-types": { - "version": "15.6.0", - "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.0.tgz", - "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY=", - "requires": { - "fbjs": "0.8.16", - "loose-envify": "1.3.1", - "object-assign": "4.1.1" - } - } - } - }, - "uuid": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.1.0.tgz", - "integrity": "sha512-DIWtzUkw04M4k3bf1IcpS2tngXEL26YUD2M0tMDUpnUrz2hgzUBlD55a4FjdLGPvfHxS6uluGWvaVEqgBcVa+g==" - } } }, "node-fetch": { @@ -7093,7 +7009,7 @@ "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==", "dev": true, "requires": { - "@types/node": "9.6.16" + "@types/node": "9.6.17" } }, "pascalcase": { diff --git a/frontend/package.json b/frontend/package.json index 925a118..a716864 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -19,10 +19,10 @@ "downshift": "^1.31.14", "graphql": "^0.13.2", "graphql-import": "^0.5.2", - "graphql-mock": "1.0.1", + "graphql-mock": "1.0.2", "graphql-tag": "^2.9.2", "lodash.debounce": "^4.0.8", - "next": "^6.0.3-canary.0", + "next": "^6.0.3", "next-with-apollo": "^2.1.2", "nprogress": "^0.2.0", "prop-types": "^15.6.1", diff --git a/frontend/pages/diagram.js b/frontend/pages/diagram.js index 9436ea3..a505089 100644 --- a/frontend/pages/diagram.js +++ b/frontend/pages/diagram.js @@ -14,6 +14,7 @@ const DiagramStyles = styled.div` list-style: none; li { border-bottom: 1px solid rgba(0, 0, 0, 0.2); + padding: 5px 0; } } h2 { @@ -27,7 +28,8 @@ const DiagramStyles = styled.div` span.for { font-size: 12px; text-align: center; - margin-bottom: 2rem; + margin-top: 1rem; + margin-bottom: 1rem; display: block; } .slat { @@ -130,7 +132,7 @@ const Diagram = () => ( <strong>Error</strong> and <strong>Loading</strong> UI States </li> <li> - <small>Apollo-client replaces the need for redux + data fetching libraries</small> + <small>Apollo Client replaces the need for redux + data fetching/caching libraries</small> </li> </ul> </div> @@ -157,7 +159,7 @@ const Diagram = () => ( <strong>Sending</strong> Email </li> <li> - Performing <strong>Authentication</strong> + Performing <strong>JWT Authentication</strong> </li> <li> Checking <strong>Permissions</strong> @@ -174,7 +176,7 @@ const Diagram = () => ( <span className="for">A GraphQL Database Interface</span> <ul> <li> - Provides a set of GraphQL <strong>CRUD APIs</strong> for our (currently MySQL){' '} + Provides a set of GraphQL <strong>CRUD APIs</strong> for MySQL or Postgres{' '} <strong>Database</strong> </li> <li> diff --git a/frontend/pages/update.js b/frontend/pages/update.js index 7d8deda..7a8630d 100644 --- a/frontend/pages/update.js +++ b/frontend/pages/update.js @@ -1,16 +1,13 @@ import { Component } from 'react'; import UpdateItem from '../components/UpdateItem'; -import Page from '../components/Page'; import PleaseSignIn from '../components/PleaseSignIn'; class Home extends Component { render() { return ( - <Page> - <PleaseSignIn> - <UpdateItem id={this.props.query.id} /> - </PleaseSignIn> - </Page> + <PleaseSignIn> + <UpdateItem id={this.props.query.id} /> + </PleaseSignIn> ); } } diff --git a/frontend/queries/queries.graphql b/frontend/queries/queries.graphql index 2ee2c8b..ababde3 100644 --- a/frontend/queries/queries.graphql +++ b/frontend/queries/queries.graphql @@ -24,11 +24,9 @@ mutation SIGNUP_MUTATION($email: String!, $name: String!, $password: String!) { mutation SIGNIN_MUTATION($email: String!, $password: String!) { signin(email: $email, password: $password) { - user { - id - email - name - } + id + email + name } } @@ -46,11 +44,9 @@ mutation REQUEST_RESET_MUTATION($email: String!) { mutation RESET_MUTATION($resetToken: String!, $password: String!, $confirmPassword: String!) { resetPassword(resetToken: $resetToken, password: $password, confirmPassword: $confirmPassword) { - user { - id - email - name - } + id + email + name } } |
