Implemented components for adding/editing users

scm-ui/src/users/containers/EditUser.js

@@ -0,0 +1,67 @@
+//@flow
+import React from "react";
+import { connect } from "react-redux";
+import UserForm from "./UserForm";
+import type { User } from "../types/User";
+
+import {
+  updateUser,
+  deleteUser,
+  editUser,
+  fetchUser,
+  getUsersFromState
+} from "../modules/users";
+import { Route, Link } from "react-router-dom";
+
+type Props = {
+  name: string,
+  fetchUser: string => void,
+  usersByNames: Map<string, any>,
+  updateUser: User => void
+};
+
+class EditUser extends React.Component<Props> {
+  componentDidMount() {
+    this.props.fetchUser(this.props.name);
+  }
+
+  render() {
+    const submitUser = this.props.updateUser;
+
+    const { usersByNames, name } = this.props;
+
+    if (!usersByNames || usersByNames[name].loading) {
+      return <div>Loading...</div>;
+    } else {
+      const user = usersByNames[name].entry;
+      return (
+        <div>
+          <UserForm submitForm={user => submitUser(user)} user={user} />
+        </div>
+      );
+    }
+  }
+}
+
+const mapDispatchToProps = dispatch => {
+  return {
+    fetchUser: (name: string) => {
+      dispatch(fetchUser(name));
+    },
+    updateUser: (user: User) => {
+      dispatch(updateUser(user));
+    }
+  };
+};
+
+const mapStateToProps = (state, ownProps) => {
+  return {
+    usersByNames: state.users.usersByNames,
+    name: ownProps.match.params.name
+  };
+};
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(EditUser);