Updates User actions and store

src/actions/UserActions/UserActions.js

@@ -17,7 +17,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import Reflux from 'reflux';
 import Api from '../../components/ApiCaller';
-import {servicesUrl, defaultDomain} from '../../config';
+import { servicesUrl, defaultDomain } from '../../config';
 import Location from '../../core/Location';
 
 let UserAction = Reflux.createActions({
@@ -30,7 +30,9 @@ let UserAction = Reflux.createActions({
   switchProject: {},
   getScopedProjects: { children: ["completed", "failed"] },
   loadProjects: { children: ["completed", "failed"] },
-  federateToken: { }
+  federateToken: { },
+  getUserInfo: { children: ["completed", "failed"] },
+  setUserInfo: { children: ["success", "failed"] }
 })
 
 UserAction.login.listen(userData => {
@@ -132,4 +134,35 @@ UserAction.getScopedProjects.listen((callback) => {
     });
 })
 
+UserAction.getUserInfo.listen((userId) => {
+  Api.sendAjaxRequest({
+    url: servicesUrl.users + "/" + userId,
+    method: "GET"
+  })
+    .then(
+      (response) => {
+        UserAction.getUserInfo.completed(response)
+      }, UserAction.getUserInfo.failed)
+    .catch((response) => {
+      UserAction.getUserInfo.failed(response)
+    });
+})
+
+UserAction.setUserInfo.listen((userId, userObject) => {
+  Api.sendAjaxRequest({
+    url: servicesUrl.users + "/" + userId,
+    method: "PATCH",
+    data: {
+      user: userObject
+    }
+  })
+    .then(
+      (response) => {
+        UserAction.setUserInfo.completed(response)
+      }, UserAction.setUserInfo.failed)
+    .catch((response) => {
+      UserAction.setUserInfo.failed(response)
+    });
+})
+
 export default UserAction;

src/components/Replica/Replica.js

@@ -0,0 +1,57 @@
+/*
+Copyright (C) 2017  Cloudbase Solutions SRL
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+import React, { PropTypes } from 'react';
+import Reflux from 'reflux';
+import MigrationStore from '../../stores/MigrationStore';
+
+const title = "Coriolis: View Replica"
+
+class Replica extends Reflux.Component {
+
+  static propTypes = {
+    replicaId: PropTypes.string
+  }
+
+  static contextTypes = {
+    onSetTitle: PropTypes.func.isRequired,
+  };
+
+  constructor(props) {
+    super(props)
+    this.store = MigrationStore
+  }
+
+  componentWillMount() {
+    super.componentWillMount.call(this)
+  }
+
+  componentDidMount() {
+    this.context.onSetTitle(title);
+  }
+
+  render() {
+    return (
+      <div>
+        {React.cloneElement(this.props.children, { replicas: this.state.replicas, replicaId: this.props.replicaId })}
+      </div>
+    )
+  }
+
+}
+
+export default Replica;

src/components/Replica/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "Replica",
+  "version": "0.0.0",
+  "private": true,
+  "main": "./Replica.js"
+}

src/components/UserOverview/UserOverview.js

@@ -21,6 +21,8 @@ import withStyles from 'isomorphic-style-loader/lib/withStyles';
 import s from './UserOverview.scss';
 import Moment from 'react-moment';
 import UserStore from '../../stores/UserStore';
+import Modal from 'react-modal';
+import EditProfile from '../EditProfile';
 
 const title = 'User Overview';
 
@@ -28,6 +30,10 @@ class UserOverview extends Reflux.Component {
   constructor(props) {
     super(props)
     this.store = UserStore
+
+    this.state = {
+      showModal: false
+    }
   }
 
   static contextTypes = {
@@ -38,11 +44,33 @@ class UserOverview extends Reflux.Component {
     super.componentWillMount.call(this)
     this.context.onSetTitle(title);
   }
+
   handleChangeNotifications() {
 
   }
 
+  closeModal() {
+    this.setState({ showModal: false })
+  }
+
+  openModal() {
+    this.setState({ showModal: true })
+  }
+
   render() {
+    let modalStyle = {
+      content: {
+        padding: "0px",
+        borderRadius: "4px",
+        bottom: "auto",
+        width: "576px",
+        height: "auto",
+        left: "50%",
+        top: "20%",
+        marginLeft: "-288px"
+      }
+    }
+
     let item = this.state.currentUser
     return (
       <div className={s.root}>
@@ -65,7 +93,7 @@ class UserOverview extends Reflux.Component {
               </div>
             </div>
             <div className={s.formGroup}>
-              <button className="gray">Edit Profile</button>
+              <button className="gray" onClick={(e) => this.openModal(e)}>Edit Profile</button>
             </div>
             <div className={s.formGroup}>
               <div className={s.title}>
@@ -108,6 +136,16 @@ class UserOverview extends Reflux.Component {
             </div>
           </div>
         </div>
+        <Modal
+          isOpen={this.state.showModal}
+          contentLabel="Edit Profile"
+          style={modalStyle}
+        >
+          <EditProfile
+            closeHandle={(e) => this.closeModal(e)}
+            user={this.state.currentUser}
+          />
+        </Modal>
       </div>
     );
   }

src/config.sample.js

@@ -42,6 +42,7 @@ export const securityGroups = ["testgroup"]
 export const servicesUrl = {
   identity: coriolisUrl + "identity/auth/tokens",
   projects: coriolisUrl + "identity/auth/projects",
+  users: coriolisUrl + "identity/users",
   endpoints: coriolisUrl + "coriolis/endpoints",
   coriolis: coriolisUrl + "coriolis",
   migrations: coriolisUrl + "coriolis/migrations",

src/stores/UserStore/UserStore.js

@@ -29,8 +29,8 @@ class UserStore extends Reflux.Store
 {
   user = {
     id: null,
-    name: "Pat Bentar",
-    email: "pat.bentar@coriolis.ui",
+    name: "-",
+    email: "-",
     created: new Date(),
     project: {},
     roles: [],
@@ -67,7 +67,6 @@ class UserStore extends Reflux.Store
     let token = response.headers['X-Subject-Token']
     Api.setDefaultHeader('X-Auth-Token', token)
     cookie.save('unscopedToken', token, { path: "/", expires: moment().add(1, 'hour').toDate() })
-
     UserActions.getScopedProjects(response => {
       if (response.data.projects) {
         let projectId = cookie.load('projectId')
@@ -94,16 +93,16 @@ class UserStore extends Reflux.Store
     cookie.save('projectId', currentUser.project.id, { path: "/", expires: moment().add(1, 'months').toDate() })
     Api.setDefaultHeader('X-Auth-Token', currentUser.token)
 
-    this.setState({currentUser: currentUser})
+    this.setState({ currentUser: currentUser })
 
     ConnectionsActions.loadProviders()
     ConnectionsActions.loadConnections()
+    UserActions.getScopedProjects()
+    UserActions.getUserInfo(currentUser.id)
 
     if (window.location.pathname == "/" || window.location.pathname == "/login") {
       Location.push('/replicas');
     }
-
-    UserActions.getScopedProjects()
   }
 
   onLoginScopeFailed(token) {
@@ -134,6 +133,17 @@ class UserStore extends Reflux.Store
     Api.resetHeaders()
   }
 
+  onGetUserInfoCompleted(response) {
+    let currentUser = this.state.currentUser
+    currentUser.email = response.data.user.email
+    this.setState({ currentUser: currentUser })
+    console.log("onGetUserInfo", response)
+  }
+
+  onSetUserInfoSuccess(response) {
+
+  }
+
   onTokenLoginFailed() {
     cookie.remove('token');
     cookie.remove('projectId');