restructure ui for users

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

@@ -3,33 +3,48 @@ import React from "react";
 import { connect } from "react-redux";
 import UserForm from "./UserForm";
 import type { User } from "../types/User";
-
+import type { History } from "history";
 import { createUser } from "../modules/users";
+import Page from "../../components/Page";
 
 type Props = {
-  addUser: User => void,
-  loading?: boolean
+  addUser: (user: User, callback?: () => void) => void,
+  loading?: boolean,
+  error?: Error,
+  history: History
 };
 
 class AddUser extends React.Component<Props> {
-  render() {
-    const addUser = this.props.addUser;
+  userCreated = () => {
+    const { history } = this.props;
+    history.push("/users");
+  };
 
+  createUser = (user: User) => {
+    this.props.addUser(user, this.userCreated);
+  };
+
+  render() {
+    const { loading, error } = this.props;
+
+    // TODO i18n
     return (
-      <div>
-        <UserForm
-          submitForm={user => addUser(user)}
-          loading={this.props.loading}
-        />
-      </div>
+      <Page
+        title="Create User"
+        subtitle="Create a new user"
+        loading={loading}
+        error={error}
+      >
+        <UserForm submitForm={user => this.createUser(user)} />
+      </Page>
     );
   }
 }
 
 const mapDispatchToProps = dispatch => {
   return {
-    addUser: (user: User) => {
-      dispatch(createUser(user));
+    addUser: (user: User, callback?: () => void) => {
+      dispatch(createUser(user, callback));
     }
   };
 };