summaryrefslogtreecommitdiffstats
path: root/stepped-solutions/FINISHED/frontend/components/UpdateItem.js
diff options
context:
space:
mode:
authorWes Bos <wesbos@gmail.com>2018-09-14 12:18:12 -0400
committerWes Bos <wesbos@gmail.com>2018-09-14 12:18:12 -0400
commit2d145b026cfdf54a63bef0b9d6324b6785390307 (patch)
treef6c1d8f987437803a5c026e70535bf9ff244e885 /stepped-solutions/FINISHED/frontend/components/UpdateItem.js
parent8a5825d52271d712ec7c8348447d433067e13ef2 (diff)
move finished folder
Diffstat (limited to 'stepped-solutions/FINISHED/frontend/components/UpdateItem.js')
-rw-r--r--stepped-solutions/FINISHED/frontend/components/UpdateItem.js117
1 files changed, 0 insertions, 117 deletions
diff --git a/stepped-solutions/FINISHED/frontend/components/UpdateItem.js b/stepped-solutions/FINISHED/frontend/components/UpdateItem.js
deleted file mode 100644
index 11aef32..0000000
--- a/stepped-solutions/FINISHED/frontend/components/UpdateItem.js
+++ /dev/null
@@ -1,117 +0,0 @@
-import React, { Component } from 'react';
-import { Mutation, Query } from 'react-apollo';
-import gql from 'graphql-tag';
-import Router from 'next/router';
-import Form from './styles/Form';
-import formatMoney from '../lib/formatMoney';
-import Error from './ErrorMessage';
-
-const SINGLE_ITEM_QUERY = gql`
- query SINGLE_ITEM_QUERY($id: ID!) {
- item(where: { id: $id }) {
- id
- title
- description
- price
- }
- }
-`;
-const UPDATE_ITEM_MUTATION = gql`
- mutation UPDATE_ITEM_MUTATION($id: ID!, $title: String, $description: String, $price: Int) {
- updateItem(id: $id, title: $title, description: $description, price: $price) {
- id
- title
- description
- price
- }
- }
-`;
-
-class UpdateItem extends Component {
- state = {};
- handleChange = e => {
- const { name, type, value } = e.target;
- const val = type === 'number' ? parseFloat(value) : value;
- this.setState({ [name]: val });
- };
- updateItem = async (e, updateItemMutation) => {
- e.preventDefault();
- console.log('Updating Item!!');
- console.log(this.state);
- const res = await updateItemMutation({
- variables: {
- id: this.props.id,
- ...this.state,
- },
- });
- console.log('Updated!!');
- };
-
- render() {
- return (
- <Query
- query={SINGLE_ITEM_QUERY}
- variables={{
- id: this.props.id,
- }}
- >
- {({ data, loading }) => {
- if (loading) return <p>Loading...</p>;
- if (!data.item) return <p>No Item Found for ID {this.props.id}</p>;
- return (
- <Mutation mutation={UPDATE_ITEM_MUTATION} variables={this.state}>
- {(updateItem, { loading, error }) => (
- <Form onSubmit={e => this.updateItem(e, updateItem)}>
- <Error error={error} />
- <fieldset disabled={loading} aria-busy={loading}>
- <label htmlFor="title">
- Title
- <input
- type="text"
- id="title"
- name="title"
- placeholder="Title"
- required
- defaultValue={data.item.title}
- onChange={this.handleChange}
- />
- </label>
-
- <label htmlFor="price">
- Price
- <input
- type="number"
- id="price"
- name="price"
- placeholder="Price"
- required
- defaultValue={data.item.price}
- onChange={this.handleChange}
- />
- </label>
-
- <label htmlFor="description">
- Description
- <textarea
- id="description"
- name="description"
- placeholder="Enter A Description"
- required
- defaultValue={data.item.description}
- onChange={this.handleChange}
- />
- </label>
- <button type="submit">Sav{loading ? 'ing' : 'e'} Changes</button>
- </fieldset>
- </Form>
- )}
- </Mutation>
- );
- }}
- </Query>
- );
- }
-}
-
-export default UpdateItem;
-export { UPDATE_ITEM_MUTATION };