From de6ca52fb823f84e71e6ccdac01c96e09930bae7 Mon Sep 17 00:00:00 2001
From: Patrick Fic <patrick@thinkimex.com>
Date: Tue, 4 Feb 2020 12:42:20 -0800
Subject: [PATCH] Added updating of display name to profile. Added employees
 table.

---
 bodyshop_translations.babel                   | 28 +++++-
 .../chat-window/chat-window.container.jsx     | 36 ++++----
 .../profile-content.component.jsx             |  5 +-
 .../profile-my/profile-my.component.jsx       | 67 ++++++++++++++
 client/src/firebase/firebase.utils.js         | 13 +++
 client/src/graphql/apollo-error-handling.js   |  5 +-
 client/src/pages/manage/manage.page.jsx       | 16 ++--
 .../src/redux/messaging/messaging.actions.js  |  7 ++
 .../src/redux/messaging/messaging.reducer.js  | 24 +++++
 client/src/redux/messaging/messaging.sagas.js | 90 +++++++++++++++++++
 .../redux/messaging/messaging.selectors.js    |  8 ++
 client/src/redux/messaging/messaging.types.js |  5 ++
 client/src/redux/root.reducer.js              |  4 +-
 client/src/redux/root.saga.js                 |  3 +-
 client/src/redux/user/user.actions.js         | 10 +++
 client/src/redux/user/user.reducer.js         |  9 +-
 client/src/redux/user/user.sagas.js           | 28 +++++-
 client/src/redux/user/user.types.js           |  4 +-
 client/src/translations/en_us/common.json     |  3 +
 client/src/translations/es/common.json        |  3 +
 client/src/translations/fr/common.json        |  3 +
 .../down.yaml                                 |  3 +
 .../up.yaml                                   | 21 +++++
 .../down.yaml                                 | 12 +++
 .../up.yaml                                   | 20 +++++
 .../down.yaml                                 |  6 ++
 .../up.yaml                                   | 30 +++++++
 .../down.yaml                                 |  6 ++
 .../up.yaml                                   | 27 ++++++
 .../down.yaml                                 |  6 ++
 .../up.yaml                                   | 29 ++++++
 .../down.yaml                                 |  6 ++
 .../up.yaml                                   | 16 ++++
 33 files changed, 514 insertions(+), 39 deletions(-)
 create mode 100644 client/src/components/profile-my/profile-my.component.jsx
 create mode 100644 client/src/redux/messaging/messaging.actions.js
 create mode 100644 client/src/redux/messaging/messaging.reducer.js
 create mode 100644 client/src/redux/messaging/messaging.sagas.js
 create mode 100644 client/src/redux/messaging/messaging.selectors.js
 create mode 100644 client/src/redux/messaging/messaging.types.js
 create mode 100644 hasura/migrations/1580845008791_create_table_public_employees/down.yaml
 create mode 100644 hasura/migrations/1580845008791_create_table_public_employees/up.yaml
 create mode 100644 hasura/migrations/1580845024748_track_all_relationships/down.yaml
 create mode 100644 hasura/migrations/1580845024748_track_all_relationships/up.yaml
 create mode 100644 hasura/migrations/1580845064503_update_permission_user_public_table_employees/down.yaml
 create mode 100644 hasura/migrations/1580845064503_update_permission_user_public_table_employees/up.yaml
 create mode 100644 hasura/migrations/1580845070982_update_permission_user_public_table_employees/down.yaml
 create mode 100644 hasura/migrations/1580845070982_update_permission_user_public_table_employees/up.yaml
 create mode 100644 hasura/migrations/1580845078647_update_permission_user_public_table_employees/down.yaml
 create mode 100644 hasura/migrations/1580845078647_update_permission_user_public_table_employees/up.yaml
 create mode 100644 hasura/migrations/1580845085318_update_permission_user_public_table_employees/down.yaml
 create mode 100644 hasura/migrations/1580845085318_update_permission_user_public_table_employees/up.yaml

diff --git a/bodyshop_translations.babel b/bodyshop_translations.babel
index 6ce698947..9e98b433c 100644
--- a/bodyshop_translations.babel
+++ b/bodyshop_translations.babel
@@ -1,4 +1,4 @@
-<babeledit_project version="1.2" be_version="2.6.1">
+<babeledit_project be_version="2.6.1" version="1.2">
     <!--
 
     BabelEdit project file
@@ -4438,6 +4438,32 @@
                                     </concept_node>
                                 </children>
                             </folder_node>
+                            <folder_node>
+                                <name>fields</name>
+                                <children>
+                                    <concept_node>
+                                        <name>displayname</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                </children>
+                            </folder_node>
                         </children>
                     </folder_node>
                     <folder_node>
diff --git a/client/src/components/chat-window/chat-window.container.jsx b/client/src/components/chat-window/chat-window.container.jsx
index d3d237a15..9b4244119 100644
--- a/client/src/components/chat-window/chat-window.container.jsx
+++ b/client/src/components/chat-window/chat-window.container.jsx
@@ -1,32 +1,34 @@
-import React, { useState } from "react";
-import ChatWindowComponent from "./chat-window.component";
-import { Button } from "antd";
+import { Layout } from "antd";
+import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { selectCurrentUser } from "../../redux/user/user.selectors";
+import { toggleChatVisible } from "../../redux/messaging/messaging.actions";
+import { selectChatVisible } from "../../redux/messaging/messaging.selectors";
+import ChatWindowComponent from "./chat-window.component";
 
 const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
+  chatVisible: selectChatVisible
 });
 
 const mapDispatchToProps = dispatch => ({
-  // signOutStart: () => dispatch(signOutStart())
+  toggleChatVisible: () => dispatch(toggleChatVisible())
 });
 
 export default connect(
   mapStateToProps,
   mapDispatchToProps
-)(function ChatWindowContainer() {
-  const [visible, setVisible] = useState(false);
+)(function ChatWindowContainer({ chatVisible, toggleChatVisible }) {
   return (
-    <div>
-      <Button onClick={() => setVisible(!visible)}>Drawer!</Button>
-      <ChatWindowComponent
-        mask={false}
-        maskClosable={false}
-        visible={visible}
-        zIndex={0}
-      />
-    </div>
+    <Layout.Sider
+      collapsible
+      defaultCollapsed
+      theme="light"
+      collapsedWidth={0}
+      width={300}
+      collapsed={!chatVisible}
+      onCollapse={(collapsed, type) => toggleChatVisible()}
+    >
+      <ChatWindowComponent mask={false} maskClosable={false} zIndex={0} />
+    </Layout.Sider>
   );
 });
diff --git a/client/src/components/profile-content/profile-content.component.jsx b/client/src/components/profile-content/profile-content.component.jsx
index f570c99c0..cc627a3fa 100644
--- a/client/src/components/profile-content/profile-content.component.jsx
+++ b/client/src/components/profile-content/profile-content.component.jsx
@@ -1,14 +1,15 @@
 import React from "react";
 import { useTranslation } from "react-i18next";
 import AlertComponent from "../alert/alert.component";
+import ProfileMyComponent from "../profile-my/profile-my.component";
 
 export default function ProfileContent({ sidebarSelection }) {
   const { t } = useTranslation();
 
   switch (sidebarSelection.key) {
     case "profile":
-      return <div>Profile stuff</div>;
-    case "shop":
+      return <ProfileMyComponent />;
+    case "shops":
       return <div>Shop stuff</div>;
     default:
       return (
diff --git a/client/src/components/profile-my/profile-my.component.jsx b/client/src/components/profile-my/profile-my.component.jsx
new file mode 100644
index 000000000..a924f6666
--- /dev/null
+++ b/client/src/components/profile-my/profile-my.component.jsx
@@ -0,0 +1,67 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectCurrentUser } from "../../redux/user/user.selectors";
+import AlertComponent from "../alert/alert.component";
+import { Form, Input, notification, Button } from "antd";
+import { updateUserDetails } from "../../redux/user/user.actions";
+
+const mapStateToProps = createStructuredSelector({
+  currentUser: selectCurrentUser
+});
+const mapDispatchToProps = dispatch => ({
+  updateUserDetails: userDetails => dispatch(updateUserDetails(userDetails))
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(
+  Form.create({ name: "ProfileMyComponentForm" })(function ProfileMyComponent({
+    currentUser,
+    form,
+    updateUserDetails
+  }) {
+    const { isFieldsTouched, resetFields, getFieldDecorator } = form;
+    const { t } = useTranslation();
+
+    const handleSubmit = e => {
+      e.preventDefault();
+
+      form.validateFieldsAndScroll((err, values) => {
+        if (err) {
+          notification["error"]({
+            message: t("jobs.errors.validationtitle"),
+            description: t("jobs.errors.validation")
+          });
+        }
+        if (!err) {
+          console.log("values", values);
+          updateUserDetails({ displayName: values.displayname });
+        }
+      });
+    };
+
+    return (
+      <div>
+        <AlertComponent message={"hi"} />
+        <Form onSubmit={handleSubmit} autoComplete={"no"}>
+          <Form.Item label={t("user.fields.displayname")}>
+            {getFieldDecorator("displayname", {
+              initialValue: currentUser.displayName,
+              rules: [{ required: true }]
+            })(<Input name="displayname" />)}
+          </Form.Item>
+          <Button
+            type="primary"
+            key="submit"
+            htmlType="submit"
+            onClick={handleSubmit}
+          >
+            Save
+          </Button>
+        </Form>
+      </div>
+    );
+  })
+);
diff --git a/client/src/firebase/firebase.utils.js b/client/src/firebase/firebase.utils.js
index 56426cfb7..5d2d7eafe 100644
--- a/client/src/firebase/firebase.utils.js
+++ b/client/src/firebase/firebase.utils.js
@@ -34,6 +34,7 @@ export const createUserProfileDocument = async (userAuth, additionalData) => {
 };
 
 export const auth = firebase.auth();
+
 export const firestore = firebase.firestore();
 
 const provider = new firebase.auth.GoogleAuthProvider();
@@ -49,3 +50,15 @@ export const getCurrentUser = () => {
     }, reject);
   });
 };
+
+export const updateCurrentUser = userDetails => {
+  return new Promise((resolve, reject) => {
+    const unsubscribe = auth.onAuthStateChanged(userAuth => {
+      console.log("userDetails", userDetails);
+      userAuth.updateProfile(userDetails).then(r => {
+        unsubscribe();
+        resolve(userAuth);
+      });
+    }, reject);
+  });
+};
diff --git a/client/src/graphql/apollo-error-handling.js b/client/src/graphql/apollo-error-handling.js
index 28394033b..cd9f196c6 100644
--- a/client/src/graphql/apollo-error-handling.js
+++ b/client/src/graphql/apollo-error-handling.js
@@ -42,8 +42,9 @@ const errorLink = onError(
               authorization: token ? `Bearer ${token}` : ""
             }
           });
-
-          return forward(operation);
+          console.log("forward", forward);
+          console.log("operation", operation);
+          return forward(operation).subscribe();
 
           // return new Observable(observer => {
           //   const subscriber = {
diff --git a/client/src/pages/manage/manage.page.jsx b/client/src/pages/manage/manage.page.jsx
index f30afcf45..300815d4d 100644
--- a/client/src/pages/manage/manage.page.jsx
+++ b/client/src/pages/manage/manage.page.jsx
@@ -2,7 +2,6 @@ import { BackTop, Layout } from "antd";
 import React, { lazy, Suspense, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { Route } from "react-router";
-import ChatWindowContainer from "../../components/chat-window/chat-window.container";
 import ErrorBoundary from "../../components/error-boundary/error-boundary.component";
 import FooterComponent from "../../components/footer/footer.component";
 //Component Imports
@@ -25,6 +24,9 @@ const JobsDocumentsPage = lazy(() =>
 const JobsAvailablePage = lazy(() =>
   import("../jobs-available/jobs-available.page.container")
 );
+const ChatWindowContainer = lazy(() =>
+  import("../../components/chat-window/chat-window.container")
+);
 
 const { Header, Content, Footer, Sider } = Layout;
 //This page will handle all routing for the entire application.
@@ -41,17 +43,9 @@ export default function Manage({ match }) {
         <HeaderContainer />
       </Header>
       <Layout>
-        <Sider
-          collapsible
-          defaultCollapsed
-          theme="light"
-          collapsedWidth={0}
-          width={300}
-        >
-          <chatWindowContainer />
-        </Sider>
+        <ChatWindowContainer />
 
-        <Content className="content-container" style={{ margin: "50px" }}>
+        <Content className="content-container" style={{ margin: "0px" }}>
           <ErrorBoundary>
             <Suspense
               fallback={
diff --git a/client/src/redux/messaging/messaging.actions.js b/client/src/redux/messaging/messaging.actions.js
new file mode 100644
index 000000000..c42e19aa1
--- /dev/null
+++ b/client/src/redux/messaging/messaging.actions.js
@@ -0,0 +1,7 @@
+import MessagingActionTypes from './messaging.types' 
+
+export const toggleChatVisible = () => ({
+  type: MessagingActionTypes.TOGGLE_CHAT_VISIBLE,
+  //payload: user
+});
+
diff --git a/client/src/redux/messaging/messaging.reducer.js b/client/src/redux/messaging/messaging.reducer.js
new file mode 100644
index 000000000..6b28f650a
--- /dev/null
+++ b/client/src/redux/messaging/messaging.reducer.js
@@ -0,0 +1,24 @@
+import MessagingActionTypes from "./messaging.types";
+
+const INITIAL_STATE = {
+  visible: false
+};
+
+const messagingReducer = (state = INITIAL_STATE, action) => {
+  switch (action.type) {
+    case MessagingActionTypes.TOGGLE_CHAT_VISIBLE:
+      return {
+        ...state,
+        visible: !state.visible
+      };
+    case MessagingActionTypes.SET_CHAT_VISIBLE:
+      return {
+        ...state,
+        visible: true
+      };
+    default:
+      return state;
+  }
+};
+
+export default messagingReducer;
diff --git a/client/src/redux/messaging/messaging.sagas.js b/client/src/redux/messaging/messaging.sagas.js
new file mode 100644
index 000000000..b897fedf5
--- /dev/null
+++ b/client/src/redux/messaging/messaging.sagas.js
@@ -0,0 +1,90 @@
+import {
+  all
+  //  call, put, takeLatest
+} from "redux-saga/effects";
+//import { auth, getCurrentUser } from "../../firebase/firebase.utils";
+
+// import { toggleChatVisible } from "./messaging.actions";
+// import MessagingActionTypes from "./messaging.types";
+
+// export function* getSnapshotFromUserAuth(userAuth) {
+//   try {
+//     const userRef = yield call(createUserProfileDocument, userAuth);
+//     //const userSnapshot = yield userRef.get();
+//   } catch (error) {
+//     yield put(signInFailure(error));
+//   }
+// }
+
+// export function* signInWithEmail({ payload: { email, password } }) {
+//   try {
+//     const { user } = yield auth.signInWithEmailAndPassword(email, password);
+//     yield put(
+//       signInSuccess({
+//         uid: user.uid,
+//         email: user.email,
+//         displayName: user.displayName,
+//         authorized: true
+//       })
+//     );
+//   } catch (error) {
+//     yield put(signInFailure(error));
+//   }
+// }
+// //This is the listener fo rthe call, and when it finds it, it triggers somethign else.
+// export function* onEmailSignInStart() {
+//   yield takeLatest(UserActionTypes.EMAIL_SIGN_IN_START, signInWithEmail);
+// }
+
+// export function* isUserAuthenticated() {
+//   try {
+//     const user = yield getCurrentUser();
+//     if (!user) {
+//       yield put(unauthorizedUser());
+//       return;
+//     }
+//     let token = yield user.getIdToken();
+//     localStorage.setItem("token", token);
+//     window.sessionStorage.setItem(`lastTokenRefreshTime`, new Date());
+
+//     yield put(
+//       signInSuccess({
+//         uid: user.uid,
+//         email: user.email,
+//         displayName: user.displayName,
+//         authorized: true
+//       })
+//     );
+//   } catch (error) {
+//     yield put(signInFailure(error));
+//   }
+// }
+
+// export function* onCheckUserSession() {
+//   yield takeLatest(UserActionTypes.CHECK_USER_SESSION, isUserAuthenticated);
+// }
+
+// export function* signOutStart() {
+//   try {
+//     yield auth.signOut();
+//     yield put(signOutSuccess());
+//     localStorage.removeItem("token");
+//   } catch (error) {
+//     yield put(signOutFailure(error.message));
+//   }
+// }
+
+// export function* onSignOutStart() {
+//   yield takeLatest(UserActionTypes.SIGN_OUT_START, signOutStart);
+// }
+
+export function* messagingSagas() {
+  yield all([
+    // call(onGoogleSignInStart),
+    // call(onEmailSignInStart),
+    // call(onCheckUserSession),
+    // call(onSignOutStart)
+    // call(onEmailSignUpStart),
+    // call(onEmailSignUpSuccess)
+  ]);
+}
diff --git a/client/src/redux/messaging/messaging.selectors.js b/client/src/redux/messaging/messaging.selectors.js
new file mode 100644
index 000000000..65e17529d
--- /dev/null
+++ b/client/src/redux/messaging/messaging.selectors.js
@@ -0,0 +1,8 @@
+import { createSelector } from "reselect";
+
+const selectMessaging = state => state.messaging;
+
+export const selectChatVisible = createSelector(
+  [selectMessaging],
+  messaging => messaging.visible
+);
diff --git a/client/src/redux/messaging/messaging.types.js b/client/src/redux/messaging/messaging.types.js
new file mode 100644
index 000000000..6beaf6102
--- /dev/null
+++ b/client/src/redux/messaging/messaging.types.js
@@ -0,0 +1,5 @@
+const MessagingActionTypes = {
+  TOGGLE_CHAT_VISIBLE: "TOGGLE_CHAT_VISIBLE",
+  SET_CHAT_VISIBLE: "SET_CHAT_VISIBLE"
+};
+export default MessagingActionTypes;
diff --git a/client/src/redux/root.reducer.js b/client/src/redux/root.reducer.js
index a219a04af..47720506d 100644
--- a/client/src/redux/root.reducer.js
+++ b/client/src/redux/root.reducer.js
@@ -3,6 +3,7 @@ import { persistReducer } from "redux-persist";
 import storage from "redux-persist/lib/storage";
 
 import userReducer from "./user/user.reducer";
+import messagingReducer from "./messaging/messaging.reducer";
 // import cartReducer from './cart/cart.reducer';
 // import directoryReducer from './directory/directory.reducer';
 // import shopReducer from './shop/shop.reducer';
@@ -15,7 +16,8 @@ const persistConfig = {
 };
 
 const rootReducer = combineReducers({
-  user: userReducer
+  user: userReducer,
+  messaging: messagingReducer
   //   cart: cartReducer,
   //   directory: directoryReducer,
   //   shop: shopReducer
diff --git a/client/src/redux/root.saga.js b/client/src/redux/root.saga.js
index 03f871ee8..532b2e050 100644
--- a/client/src/redux/root.saga.js
+++ b/client/src/redux/root.saga.js
@@ -3,9 +3,10 @@ import { all, call } from "redux-saga/effects";
 //List of all Sagas
 // import { shopSagas } from "./shop/shop.sagas";
 import { userSagas } from "./user/user.sagas";
+import { messagingSagas } from "./messaging/messaging.sagas";
 //import { cartSagas } from "./cart/cart.sagas";
 
 export default function* rootSaga() {
   //All starts all the Sagas concurrently.
-  yield all([call(userSagas)]);
+  yield all([call(userSagas), call(messagingSagas)]);
 }
diff --git a/client/src/redux/user/user.actions.js b/client/src/redux/user/user.actions.js
index 90cd48c41..86188a8d5 100644
--- a/client/src/redux/user/user.actions.js
+++ b/client/src/redux/user/user.actions.js
@@ -38,3 +38,13 @@ export const setUserLanguage = language => ({
   type: UserActionTypes.SET_USER_LANGUAGE,
   payload: language
 });
+
+export const updateUserDetails = userDetails => ({
+  type: UserActionTypes.UPDATE_USER_DETAILS,
+  payload: userDetails
+});
+
+export const updateUserDetailsSuccess = userDetails => ({
+  type: UserActionTypes.UPDATE_USER_DETAILS_SUCCESS,
+  payload: userDetails
+});
diff --git a/client/src/redux/user/user.reducer.js b/client/src/redux/user/user.reducer.js
index 89a6eb41c..da9e28988 100644
--- a/client/src/redux/user/user.reducer.js
+++ b/client/src/redux/user/user.reducer.js
@@ -33,10 +33,17 @@ const userReducer = (state = INITIAL_STATE, action) => {
         ...state,
         language: action.payload
       };
+    case UserActionTypes.UPDATE_USER_DETAILS_SUCCESS:
+      return {
+        ...state,
+        currentUser: {
+          ...state.currentUser,
+          ...action.payload //Spread current user details in.
+        }
+      };
     case UserActionTypes.SIGN_IN_FAILURE:
     case UserActionTypes.SIGN_OUT_FAILURE:
     case UserActionTypes.EMAIL_SIGN_UP_FAILURE:
-      console.log("Reduced getting called.");
       return {
         ...state,
         error: action.payload
diff --git a/client/src/redux/user/user.sagas.js b/client/src/redux/user/user.sagas.js
index 9a7db1526..1756cfe71 100644
--- a/client/src/redux/user/user.sagas.js
+++ b/client/src/redux/user/user.sagas.js
@@ -1,6 +1,17 @@
 import { all, call, put, takeLatest } from "redux-saga/effects";
-import { auth, getCurrentUser } from "../../firebase/firebase.utils";
-import { signInFailure, signInSuccess, signOutFailure, signOutSuccess, unauthorizedUser } from "./user.actions";
+import {
+  auth,
+  getCurrentUser,
+  updateCurrentUser
+} from "../../firebase/firebase.utils";
+import {
+  signInFailure,
+  signInSuccess,
+  signOutFailure,
+  signOutSuccess,
+  unauthorizedUser,
+  updateUserDetailsSuccess
+} from "./user.actions";
 import UserActionTypes from "./user.types";
 
 // export function* getSnapshotFromUserAuth(userAuth) {
@@ -74,6 +85,18 @@ export function* onSignOutStart() {
   yield takeLatest(UserActionTypes.SIGN_OUT_START, signOutStart);
 }
 
+export function* onUpdateUserDetails() {
+  yield takeLatest(UserActionTypes.UPDATE_USER_DETAILS, updateUserDetails);
+}
+export function* updateUserDetails(userDetails) {
+  try {
+    yield updateCurrentUser(userDetails.payload);
+    yield put(updateUserDetailsSuccess(userDetails.payload));
+  } catch (error) {
+    //yield put(signOutFailure(error.message));
+    //TODO: error handling
+  }
+}
 
 export function* userSagas() {
   yield all([
@@ -81,6 +104,7 @@ export function* userSagas() {
     call(onEmailSignInStart),
     call(onCheckUserSession),
     call(onSignOutStart),
+    call(onUpdateUserDetails)
     // call(onEmailSignUpStart),
     // call(onEmailSignUpSuccess)
   ]);
diff --git a/client/src/redux/user/user.types.js b/client/src/redux/user/user.types.js
index d4d2c2919..860f46e5a 100644
--- a/client/src/redux/user/user.types.js
+++ b/client/src/redux/user/user.types.js
@@ -12,6 +12,8 @@ const UserActionTypes = {
   EMAIL_SIGN_UP_SUCCESS: "EMAIL_SIGN_UP_SUCCESS",
   EMAIL_SIGN_UP_FAILURE: "EMAIL_SIGN_UP_FAILURE",
   UNAUTHORIZED_USER: "UNAUTHORIZED_USER",
-  SET_USER_LANGUAGE: "SET_USER_LANGUAGE"
+  SET_USER_LANGUAGE: "SET_USER_LANGUAGE",
+  UPDATE_USER_DETAILS: "UPDATE_USER_DETAILS",
+  UPDATE_USER_DETAILS_SUCCESS: "UPDATE_USER_DETAILS_SUCCESS"
 };
 export default UserActionTypes;
diff --git a/client/src/translations/en_us/common.json b/client/src/translations/en_us/common.json
index fea8428bb..fbe47e21d 100644
--- a/client/src/translations/en_us/common.json
+++ b/client/src/translations/en_us/common.json
@@ -272,6 +272,9 @@
 		"user": {
 			"actions": {
 				"signout": "Sign Out"
+			},
+			"fields": {
+				"displayname": "Display Name"
 			}
 		},
 		"vehicles": {
diff --git a/client/src/translations/es/common.json b/client/src/translations/es/common.json
index 721511590..7b8b37721 100644
--- a/client/src/translations/es/common.json
+++ b/client/src/translations/es/common.json
@@ -272,6 +272,9 @@
 		"user": {
 			"actions": {
 				"signout": "desconectar"
+			},
+			"fields": {
+				"displayname": "Nombre para mostrar"
 			}
 		},
 		"vehicles": {
diff --git a/client/src/translations/fr/common.json b/client/src/translations/fr/common.json
index 45c50354a..5a5903129 100644
--- a/client/src/translations/fr/common.json
+++ b/client/src/translations/fr/common.json
@@ -272,6 +272,9 @@
 		"user": {
 			"actions": {
 				"signout": "Déconnexion"
+			},
+			"fields": {
+				"displayname": "Afficher un nom"
 			}
 		},
 		"vehicles": {
diff --git a/hasura/migrations/1580845008791_create_table_public_employees/down.yaml b/hasura/migrations/1580845008791_create_table_public_employees/down.yaml
new file mode 100644
index 000000000..a02ec7b09
--- /dev/null
+++ b/hasura/migrations/1580845008791_create_table_public_employees/down.yaml
@@ -0,0 +1,3 @@
+- args:
+    sql: DROP TABLE "public"."employees"
+  type: run_sql
diff --git a/hasura/migrations/1580845008791_create_table_public_employees/up.yaml b/hasura/migrations/1580845008791_create_table_public_employees/up.yaml
new file mode 100644
index 000000000..938539268
--- /dev/null
+++ b/hasura/migrations/1580845008791_create_table_public_employees/up.yaml
@@ -0,0 +1,21 @@
+- args:
+    sql: CREATE EXTENSION IF NOT EXISTS pgcrypto;
+  type: run_sql
+- args:
+    sql: "CREATE TABLE \"public\".\"employees\"(\"id\" uuid NOT NULL DEFAULT gen_random_uuid(),
+      \"created_at\" timestamptz NOT NULL DEFAULT now(), \"updated_at\" timestamptz
+      NOT NULL DEFAULT now(), \"first_name\" text NOT NULL, \"last_name\" text NOT
+      NULL, \"employee_number\" text, \"shopid\" uuid NOT NULL, \"active\" boolean
+      NOT NULL DEFAULT true, PRIMARY KEY (\"id\") , FOREIGN KEY (\"shopid\") REFERENCES
+      \"public\".\"bodyshops\"(\"id\") ON UPDATE cascade ON DELETE cascade);\nCREATE
+      OR REPLACE FUNCTION \"public\".\"set_current_timestamp_updated_at\"()\nRETURNS
+      TRIGGER AS $$\nDECLARE\n  _new record;\nBEGIN\n  _new := NEW;\n  _new.\"updated_at\"
+      = NOW();\n  RETURN _new;\nEND;\n$$ LANGUAGE plpgsql;\nCREATE TRIGGER \"set_public_employees_updated_at\"\nBEFORE
+      UPDATE ON \"public\".\"employees\"\nFOR EACH ROW\nEXECUTE PROCEDURE \"public\".\"set_current_timestamp_updated_at\"();\nCOMMENT
+      ON TRIGGER \"set_public_employees_updated_at\" ON \"public\".\"employees\" \nIS
+      'trigger to set value of column \"updated_at\" to current timestamp on row update';\n"
+  type: run_sql
+- args:
+    name: employees
+    schema: public
+  type: add_existing_table_or_view
diff --git a/hasura/migrations/1580845024748_track_all_relationships/down.yaml b/hasura/migrations/1580845024748_track_all_relationships/down.yaml
new file mode 100644
index 000000000..603fdf200
--- /dev/null
+++ b/hasura/migrations/1580845024748_track_all_relationships/down.yaml
@@ -0,0 +1,12 @@
+- args:
+    relationship: employees
+    table:
+      name: bodyshops
+      schema: public
+  type: drop_relationship
+- args:
+    relationship: bodyshop
+    table:
+      name: employees
+      schema: public
+  type: drop_relationship
diff --git a/hasura/migrations/1580845024748_track_all_relationships/up.yaml b/hasura/migrations/1580845024748_track_all_relationships/up.yaml
new file mode 100644
index 000000000..02e5b8af4
--- /dev/null
+++ b/hasura/migrations/1580845024748_track_all_relationships/up.yaml
@@ -0,0 +1,20 @@
+- args:
+    name: employees
+    table:
+      name: bodyshops
+      schema: public
+    using:
+      foreign_key_constraint_on:
+        column: shopid
+        table:
+          name: employees
+          schema: public
+  type: create_array_relationship
+- args:
+    name: bodyshop
+    table:
+      name: employees
+      schema: public
+    using:
+      foreign_key_constraint_on: shopid
+  type: create_object_relationship
diff --git a/hasura/migrations/1580845064503_update_permission_user_public_table_employees/down.yaml b/hasura/migrations/1580845064503_update_permission_user_public_table_employees/down.yaml
new file mode 100644
index 000000000..8ce6d7380
--- /dev/null
+++ b/hasura/migrations/1580845064503_update_permission_user_public_table_employees/down.yaml
@@ -0,0 +1,6 @@
+- args:
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: drop_insert_permission
diff --git a/hasura/migrations/1580845064503_update_permission_user_public_table_employees/up.yaml b/hasura/migrations/1580845064503_update_permission_user_public_table_employees/up.yaml
new file mode 100644
index 000000000..6c9cf3410
--- /dev/null
+++ b/hasura/migrations/1580845064503_update_permission_user_public_table_employees/up.yaml
@@ -0,0 +1,30 @@
+- args:
+    permission:
+      allow_upsert: true
+      check:
+        bodyshop:
+          associations:
+            _and:
+            - user:
+                authid:
+                  _eq: X-Hasura-User-Id
+            - active:
+                _eq: true
+      columns:
+      - active
+      - employee_number
+      - first_name
+      - last_name
+      - created_at
+      - updated_at
+      - id
+      - shopid
+      localPresets:
+      - key: ""
+        value: ""
+      set: {}
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: create_insert_permission
diff --git a/hasura/migrations/1580845070982_update_permission_user_public_table_employees/down.yaml b/hasura/migrations/1580845070982_update_permission_user_public_table_employees/down.yaml
new file mode 100644
index 000000000..c044718f0
--- /dev/null
+++ b/hasura/migrations/1580845070982_update_permission_user_public_table_employees/down.yaml
@@ -0,0 +1,6 @@
+- args:
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: drop_select_permission
diff --git a/hasura/migrations/1580845070982_update_permission_user_public_table_employees/up.yaml b/hasura/migrations/1580845070982_update_permission_user_public_table_employees/up.yaml
new file mode 100644
index 000000000..d891ef226
--- /dev/null
+++ b/hasura/migrations/1580845070982_update_permission_user_public_table_employees/up.yaml
@@ -0,0 +1,27 @@
+- args:
+    permission:
+      allow_aggregations: false
+      columns:
+      - active
+      - employee_number
+      - first_name
+      - last_name
+      - created_at
+      - updated_at
+      - id
+      - shopid
+      filter:
+        bodyshop:
+          associations:
+            _and:
+            - user:
+                authid:
+                  _eq: X-Hasura-User-Id
+            - active:
+                _eq: true
+      limit: null
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: create_select_permission
diff --git a/hasura/migrations/1580845078647_update_permission_user_public_table_employees/down.yaml b/hasura/migrations/1580845078647_update_permission_user_public_table_employees/down.yaml
new file mode 100644
index 000000000..c3a42c539
--- /dev/null
+++ b/hasura/migrations/1580845078647_update_permission_user_public_table_employees/down.yaml
@@ -0,0 +1,6 @@
+- args:
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: drop_update_permission
diff --git a/hasura/migrations/1580845078647_update_permission_user_public_table_employees/up.yaml b/hasura/migrations/1580845078647_update_permission_user_public_table_employees/up.yaml
new file mode 100644
index 000000000..962c508c1
--- /dev/null
+++ b/hasura/migrations/1580845078647_update_permission_user_public_table_employees/up.yaml
@@ -0,0 +1,29 @@
+- args:
+    permission:
+      columns:
+      - active
+      - employee_number
+      - first_name
+      - last_name
+      - created_at
+      - updated_at
+      - id
+      - shopid
+      filter:
+        bodyshop:
+          associations:
+            _and:
+            - user:
+                authid:
+                  _eq: X-Hasura-User-Id
+            - active:
+                _eq: true
+      localPresets:
+      - key: ""
+        value: ""
+      set: {}
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: create_update_permission
diff --git a/hasura/migrations/1580845085318_update_permission_user_public_table_employees/down.yaml b/hasura/migrations/1580845085318_update_permission_user_public_table_employees/down.yaml
new file mode 100644
index 000000000..6a7312d7e
--- /dev/null
+++ b/hasura/migrations/1580845085318_update_permission_user_public_table_employees/down.yaml
@@ -0,0 +1,6 @@
+- args:
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: drop_delete_permission
diff --git a/hasura/migrations/1580845085318_update_permission_user_public_table_employees/up.yaml b/hasura/migrations/1580845085318_update_permission_user_public_table_employees/up.yaml
new file mode 100644
index 000000000..a8d773013
--- /dev/null
+++ b/hasura/migrations/1580845085318_update_permission_user_public_table_employees/up.yaml
@@ -0,0 +1,16 @@
+- args:
+    permission:
+      filter:
+        bodyshop:
+          associations:
+            _and:
+            - user:
+                authid:
+                  _eq: X-Hasura-User-Id
+            - active:
+                _eq: true
+    role: user
+    table:
+      name: employees
+      schema: public
+  type: create_delete_permission