Updated employee login

components/screen-employee-sign-in/screen-employee-sign-in.component.jsx

@@ -5,34 +5,40 @@ import { Button, TextInput } from "react-native-paper";
 import { useTranslation } from "react-i18next";
 
 import { connect } from "react-redux";
-import { signInEmployeeStart } from "../../redux/employee/employee.actions";
+import { employeeSignInStart } from "../../redux/employee/employee.actions";
 import { createStructuredSelector } from "reselect";
 import {
-  selectCurrentEmployee, selectSigningIn
+  selectCurrentEmployee,
+  selectSigningIn,
+  selectSignInError
 } from "../../redux/employee/employee.selectors";
-//TODO JF add props
-const mapStateToProps =  createStructuredSelector({
+
+import ErrorDisplay from "../error-display/error-display.component";
+// import Timer from "../../util/timer";
+
+const mapStateToProps = createStructuredSelector({
   currentEmployee: selectCurrentEmployee,
   signingIn: selectSigningIn,
+  signingError: selectSignInError,
 });
 
-//TODO JF add prop functions to call dispatch with actions
+// JF add prop functions to call dispatch with actions
 const mapDispatchToProps = (dispatch) => ({
-  signInEmployeeStart: (employeeId, pin) =>
-    dispatch(signInEmployeeStart({ employeeId, pin })),
+  employeeSignInStart: (employeeId, pin) => dispatch(employeeSignInStart({ employeeId, pin })),
 });
 
-export function EmployeeSignIn({ signInEmployeeStart, employeeSigningIn }) {
+export function EmployeeSignIn({currentEmployee,signingError, signingIn, employeeSignInStart }) {
   const { t } = useTranslation();
 
-//TODO add call to dispatch action 
+  //TODO add call to dispatch action
   const formSubmit = (values) => {
     const { employeeId, pin } = values;
-    signInEmployeeStart(employeeId, pin);
+    employeeSignInStart(employeeId, pin);
   };
 
   return (
     <View style={localStyles.content}>
+      {/* {currentEmployee ? <Redirect to={`/timeticketbrowser/landing`} /> : null} */}
       <View style={localStyles.signInContainer}>
         <Formik
           initialValues={{ employeeId: "", pin: "" }}
@@ -59,9 +65,12 @@ export function EmployeeSignIn({ signInEmployeeStart, employeeSigningIn }) {
                 value={values.pin}
                 style={[localStyles.input]}
               />
+              {signingError && (
+              <ErrorDisplay errorMessage={signingError} />
+            )}
               <Button
                 mode="outlined"
-                loading={employeeSigningIn}
+                loading={signingIn}
                 onPress={handleSubmit}
               >
                 <Text>{t("employeesignin.actions.employeesignin")}</Text>

redux/employee/employee.actions.js

@@ -1,35 +1,21 @@
 import EmployeeActionTypes from "./employee.types";
 
-export const signInEmployeeStart = (employeeIdAndPin) => ({
-  type: EmployeeActionTypes.SIGN_IN_EMPLOYEE_START,
+export const employeeSignInStart = (employeeIdAndPin) => ({
+  type: EmployeeActionTypes.EMPLOYEE_SIGN_IN_START,
   payload: employeeIdAndPin,
 });
 
-export const signInEmployeeSuccess = (technician) => ({
-  type: EmployeeActionTypes.SIGN_IN_EMPLOYEE_SUCCESS,
+export const employeeSignInSuccess = (technician) => ({
+  type: EmployeeActionTypes.EMPLOYEE_SIGN_IN_SUCCESS,
   payload: technician,
 });
 
-export const signInEmployeeFailure = (error) => ({
-  type: EmployeeActionTypes.SIGN_IN_EMPLOYEE_FAILURE,
+export const employeeSignInFailure = (error) => ({
+  type: EmployeeActionTypes.EMPLOYEE_SIGN_IN_FAILURE,
   payload: error,
 });
 
-export function loginEmployee() {
-  return {
-    type: EmployeeActionTypes.AUTHORIZING_EMPLOYEE_REQUEST,
-    payload:"text"
-  }
-}
-export function loginEmployeeSuccess(technician) {
-  return {
-    type: EmployeeActionTypes.AUTHORIZING_EMPLOYEE_SUCCESS,
-    payload: technician
-  }
-}
-export function loginEmployeeFal(error) {
-  return {
-    type: EmployeeActionTypes.AUTHORIZING_EMPLOYEE_FALURE,
-    error: error
-  }
-}
+export const employeeSignOut = () => ({
+  type: EmployeeActionTypes.EMPLOYEE_SIGN_OUT,
+  payload: error,
+});

redux/employee/employee.reducer.js

@@ -3,30 +3,37 @@ import EmployeeActionTypes from "./employee.types";
 const INITIAL_STATE = {
   currentEmployee: {
     authorized: null,
+    technician: null,
   },
-  employeeSigningIn: false,
+  signingIn: false,
   error: null,
 };
 
 const employeeReducer = (state = INITIAL_STATE, action) => {
   switch (action.type) {
-    case EmployeeActionTypes.SIGN_IN_EMPLOYEE_START:
+    case EmployeeActionTypes.EMPLOYEE_SIGN_IN_START:
       return {
         ...state,
-        employeeSigningIn: true,
+        signingIn: true,
+      };
+    case EmployeeActionTypes.EMPLOYEE_SIGN_IN_SUCCESS:
+      return {
+        ...state,
+        currentEmployee: { authorized: true, technician:action.payload },
+        signingIn: false,
         error: null,
       };
-    case EmployeeActionTypes.SIGN_IN_EMPLOYEE_SUCCESS:
+    case EmployeeActionTypes.EMPLOYEE_SIGN_OUT:
       return {
         ...state,
-        currentEmployee: action.payload,
+        currentEmployee: { authorized: false, technician:null },
         error: null,
       };
-    case EmployeeActionTypes.SIGN_OUT_EMPLOYEE_SUCCESS:
+    case EmployeeActionTypes.EMPLOYEE_SIGN_IN_FAILURE:
       return {
         ...state,
-        currentEmployee: { authorized: false },
-        error: null,
+        signingIn: false,
+        error: action.payload,
       };
     default:
       return state;

redux/employee/employee.sagas.js

@@ -1,8 +1,8 @@
 import EmployeeActionTypes from "./employee.types";
 import {
-  signInEmployeeStart,
-  signInEmployeeSuccess,
-  signInEmployeeFailure,
+  employeeSignInStart,
+  employeeSignInSuccess,
+  employeeSignInFailure,
 } from "./employee.actions";
 import { all, call, put, select, takeLatest } from "redux-saga/effects";
 import { logImEXEvent } from "../../firebase/firebase.analytics";
@@ -11,7 +11,7 @@ import axios from "axios";
 
 export function* onSignInEmployeeStart() {
   yield takeLatest(
-    EmployeeActionTypes.SIGN_IN_EMPLOYEE_START,
+    EmployeeActionTypes.EMPLOYEE_SIGN_IN_START,
     signInWithEmployeeId
   );
 }
@@ -29,12 +29,12 @@ export function* signInWithEmployeeId({ payload: { employeeId, pin } }) {
     const { valid, technician, error } = response.data;
 
     if (valid) {
-      yield put(signInEmployeeSuccess(technician));
+      yield put(employeeSignInSuccess(technician));
     } else {
-      yield put(signInEmployeeFailure(error));
+      yield put(employeeSignInFailure(error));
     }
   } catch (error) {
-    yield put(signInEmployeeFailure(error));
+    yield put(employeeSignInFailure(error));
   }
 }
 

redux/employee/employee.selectors.js

@@ -4,9 +4,13 @@ const selectEmployee = (state) => state.employee;
 
 export const selectCurrentEmployee = createSelector(
     [selectEmployee],
-    (employee) => employee.currentEmployee
+    (employee) => employee.currentEmployee.technician
   );
 export const selectSigningIn = createSelector(
     [selectEmployee],
     (employee) => employee.signingIn
+  );
+  export const selectSignInError = createSelector(
+    [selectEmployee],
+    (employee) => employee.error
   );

redux/employee/employee.types.js

@@ -1,17 +1,13 @@
 const EmployeeActionTypes = {
-    AUTHORIZING_EMPLOYEE_REQUEST:"AUTHORIZING_EMPLOYEE_REQUEST",
-    AUTHORIZING_EMPLOYEE_SUCCESS:"AUTHORIZING_EMPLOYEE_SUCCESS",
-    AUTHORIZING_EMPLOYEE_FAILURE:"AUTHORIZING_EMPLOYEE_FAILURE",
-    SET_CURRENT_EMPLOYEE: "SET_CURRENT_EMPLOYEE",
-    SIGN_IN_EMPLOYEE_SUCCESS: "SIGN_IN_EMPLOYEE_SUCCESS",
-    SIGN_IN_EMPLOYEE_FAILURE: "SIGN_IN_EMPLOYEE_FAILURE",
-    SIGN_IN_EMPLOYEE_START: "SIGN_IN_EMPLOYEE_START",
-    CHECK_EMPLOYEE_SESSION: "CHECK_EMPLOYEE_SESSION",
-    SIGN_OUT_EMPLOYEE_START: "SIGN_OUT_EMPLOYEE_START",
-    SIGN_OUT_EMPLOYEE_SUCCESS: "SIGN_OUT_EMPLOYEE_SUCCESS",
-    SIGN_OUT_EMPLOYEE_FAILURE: "SIGN_OUT_EMPLOYEE_FAILURE",
-    UNAUTHORIZED_EMPLOYEE: "UNAUTHORIZED_EMPLOYEE",
-    UPDATE_EMPLOYEE_DETAILS: "UPDATE_EMPLOYEE_DETAILS",
-    UPDATE_EMPLOYEE_DETAILS_SUCCESS: "UPDATE_EMPLOYEE_DETAILS_SUCCESS",
-  };
-  export default EmployeeActionTypes;
+  EMPLOYEE_SIGN_IN_START: "EMPLOYEE_SIGN_IN_START",
+  EMPLOYEE_SIGN_IN_SUCCESS: "EMPLOYEE_SIGN_IN_SUCCESS",
+  EMPLOYEE_SIGN_IN_FAILURE: "EMPLOYEE_SIGN_IN_FAILURE",
+  EMPLOYEE_AUTHORIZING_REQUEST: "EMPLOYEE_AUTHORIZING_REQUEST",
+  EMPLOYEE_AUTHORIZING_SUCCESS: "EMPLOYEE_AUTHORIZING_SUCCESS",
+  EMPLOYEE_AUTHORIZING_FAILURE: "EMPLOYEE_AUTHORIZING_FAILURE",
+  EMPLOYEE_SIGN_OUT: "EMPLOYEE_SIGN_OUT",
+
+  EMPLOYEE_CHECK_SESSION: "EMPLOYEE_CHECK_SESSION",
+  EMPLOYEE_SET_CURRENT: "EMPLOYEE_SET_CURRENT"
+};
+export default EmployeeActionTypes;