From e85f38fbde2acf34f029763915e23f9b250bb816 Mon Sep 17 00:00:00 2001
From: ivan <ivan@opensupports.com>
Date: Wed, 14 Sep 2016 20:03:15 -0300
Subject: [PATCH] Guillermo/Ivan - Frontend - Add edit-email form [skip ci]

---
 .../dashboard-edit-profile-page.js            | 37 ++++++++++++++++++-
 .../dashboard-edit-profile-page.scss          |  9 +++++
 client/src/data/fixtures/user-fixtures.js     | 10 +++++
 3 files changed, 54 insertions(+), 2 deletions(-)
 create mode 100644 client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.scss

diff --git a/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.js b/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.js
index 3cfb7621..3d00f610 100644
--- a/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.js
+++ b/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.js
@@ -1,14 +1,47 @@
 import React from 'react';
 
+import API from 'lib-app/api-call';
+
+import Header from 'core-components/header';
+import Form from 'core-components/form';
+import FormField from 'core-components/form-field';
+import SubmitButton from 'core-components/submit-button';
+
 class DashboardEditProfilePage extends React.Component {
 
+    state = {
+        loading: false
+    };
+
     render() {
         return (
-            <div>
-                DASHBOARD EDIT PROFILE
+            <div className="edit-profile-page">
+                <Header title="Edit Profile" description="adsfasdfasdfasdfasdf asdfa" />
+                <div className="edit-profile-page__title">Edit Email</div>
+                <Form loading={this.state.loading} onSubmit={this.onSubmit.bind(this)}>
+                    <FormField name="newEmail" label="New Email" field="input" validation="EMAIL" required/>
+                    <SubmitButton>CHANGE EMAIL</SubmitButton>
+                </Form>
             </div>
         );
     }
+    
+    onSubmit(formState) {
+        this.setState({
+            loading: true
+        });
+
+        API.call({
+            path: "/user/edit-email",
+            data: {
+                newEmail: formState.newEmail
+            }
+        }).then(function () {
+            this.setState({
+                loading: false
+            });
+        }.bind(this));
+    }
 }
 
 export default DashboardEditProfilePage;
diff --git a/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.scss b/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.scss
new file mode 100644
index 00000000..872bab3c
--- /dev/null
+++ b/client/src/app/main/dashboard/dashboard-edit-profile/dashboard-edit-profile-page.scss
@@ -0,0 +1,9 @@
+@import '../../../../scss/vars';
+
+.edit-profile-page {
+    &__title {
+        color: $dark-grey;
+        font-size: 20px;
+        text-align: left;
+    }
+}
\ No newline at end of file
diff --git a/client/src/data/fixtures/user-fixtures.js b/client/src/data/fixtures/user-fixtures.js
index e661d46c..36d03718 100644
--- a/client/src/data/fixtures/user-fixtures.js
+++ b/client/src/data/fixtures/user-fixtures.js
@@ -104,6 +104,16 @@ module.exports = [
             }
         }
     },
+    {
+        path: '/user/edit-email',
+        time: 1000,
+        response: function () {
+            return {
+                status: 'success',
+                data: {}
+            };
+        }
+    },
     {
         path: '/user/get',
         time: 100,