summaryrefslogtreecommitdiffstats
path: root/components/UpdateItem.js
diff options
context:
space:
mode:
Diffstat (limited to 'components/UpdateItem.js')
-rw-r--r--components/UpdateItem.js64
1 files changed, 30 insertions, 34 deletions
diff --git a/components/UpdateItem.js b/components/UpdateItem.js
index a3b45a8..27be90f 100644
--- a/components/UpdateItem.js
+++ b/components/UpdateItem.js
@@ -1,35 +1,51 @@
-import React, { Component } from 'react'
-import { graphql, gql, compose } from 'react-apollo'
+import React, { Component } from 'react';
+import { graphql, gql, compose } from 'react-apollo';
import { SINGLE_ITEM_QUERY, UPDATE_LINK_MUTATION } from '../queries';
class UpdateLink extends Component {
-
state = {
...this.props.findItem.Item,
- }
+ };
- saveToState = (e) => {
+ saveToState = e => {
let { name, value, type } = e.target;
if (type === 'number') {
value = parseInt(value);
}
this.setState({ [name]: value });
- }
+ };
+
+ _createLink = async e => {
+ e.preventDefault();
+ // pull the values from state
+ const { description, title } = this.state;
+ const { id } = this.props;
+ // create a mutation
+ // TODO: handle any errors
+ // turn loading on
+ this.setState({ loading: true });
+ console.log(this.state);
+ const res = await this.props.updateItem({
+ // pass in those variables from state
+ variables: {
+ ...this.state,
+ },
+ });
+ this.setState({ loading: false });
+ };
render() {
return (
<div>
-
<h2>Edit {this.props.id}</h2>
- { this.state.loading ? 'LOADING...' : 'Ready!' }
+ {this.state.loading ? 'LOADING...' : 'Ready!'}
<form onSubmit={this._createLink}>
-
<label htmlFor="title">Title</label>
- <input value={this.state.title} name="title" onChange={this.saveToState} type='text'/>
+ <input value={this.state.title} name="title" onChange={this.saveToState} type="text" />
<label htmlFor="description">Description</label>
- <textarea value={this.state.description} name="description" onChange={this.saveToState}></textarea>
+ <textarea value={this.state.description} name="description" onChange={this.saveToState} />
<label htmlFor="price">Price</label>
<input type="number" name="price" onChange={this.saveToState} value={this.state.price} />
@@ -40,28 +56,8 @@ class UpdateLink extends Component {
<button type="submit">Save...</button>
</form>
</div>
- )
+ );
}
-
- _createLink = async (e) => {
- e.preventDefault();
- // pull the values from state
- const { description, title } = this.state
- const { id } = this.props;
- // create a mutation
- // TODO: handle any errors
- // turn loading on
- this.setState({ loading: true });
- console.log(this.state);
- const res = await this.props.updateItem({
- // pass in those variables from state
- variables: {
- ...this.state
- }
- });
- this.setState({ loading: false });
- }
-
}
const ComponentWithMutations = compose(
@@ -69,8 +65,8 @@ const ComponentWithMutations = compose(
graphql(SINGLE_ITEM_QUERY, {
name: 'findItem',
options: ({ id }) => ({
- variables: { id }
- })
+ variables: { id },
+ }),
}),
// Second, the mutation for updating the link
graphql(UPDATE_LINK_MUTATION, { name: 'updateItem' })