From 46a0ba30ef54a7e36206481a4f5b2bf1f9702fca Mon Sep 17 00:00:00 2001
From: Wes Bos <wesbos@gmail.com>
Date: Mon, 12 Mar 2018 14:06:25 -0400
Subject: wip

---
 frontend/components/EditUser.js | 51 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 51 insertions(+)
 create mode 100644 frontend/components/EditUser.js

(limited to 'frontend/components/EditUser.js')

diff --git a/frontend/components/EditUser.js b/frontend/components/EditUser.js
new file mode 100644
index 0000000..e763616
--- /dev/null
+++ b/frontend/components/EditUser.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import Form from './styles/Form';
+import { userEnhancer, updateUserEnhancer } from '../enhancers/enhancers';
+import { compose } from 'react-apollo';
+
+class EditUser extends React.Component {
+  state = {
+    changes: {},
+  };
+  handleChange = e => {
+    const { name, value } = e.target;
+    const { me } = this.props.currentUser;
+    const changes = {
+      ...this.state.changes,
+      [name]: value,
+    };
+    if (value === me[e.target.name]) {
+      delete changes[name];
+    }
+    this.setState({ changes });
+  };
+
+  handleSubmit = async e => {
+    e.preventDefault();
+    const user = await this.props.updateUser({
+      variables: this.state.changes,
+    });
+    this.props.currentUser.refetch();
+    this.setState({ changes: {} });
+  };
+
+  render() {
+    const { me } = this.props.currentUser;
+    if (!me) return <p>You must be logged in</p>;
+    return (
+      <Form onSubmit={this.handleSubmit}>
+        <label htmlFor="name">
+          Name:
+          <input type="text" name="name" defaultValue={me.name} onChange={this.handleChange} />
+        </label>
+        <button type="submit">Update</button>
+        <strong>me:</strong>
+        <pre>{JSON.stringify(me.name)}</pre>
+        <strong>Change:</strong>
+        <pre>{JSON.stringify(this.state.changes)}</pre>
+      </Form>
+    );
+  }
+}
+
+export default compose(userEnhancer, updateUserEnhancer)(EditUser);
-- 
cgit v1.3