add getemployeebyid call N costcenter dropdown

components/Buttons/create-time-ticket-button.component.jsx

@@ -15,6 +15,7 @@ export function AddTimeTicketButton() {
   
   const navigation = useNavigation();
   const { t } = useTranslation();
+  
   return (
     <Button
       mode="text"

components/Selects/select-cost-center.jsx

@@ -15,7 +15,7 @@ import { QUERY_EMPLOYEE_BY_ID } from "../../graphql/employees.queries";
 
 const data = [
   { label: "Item 1", value: "1" },
-  { label: "Item 2", value: "2" },
+  { label: "Item 2", value: "3" },
   { label: "Item 3", value: "3" },
   { label: "Item 4", value: "4" },
   { label: "Item 5", value: "5" },
@@ -30,13 +30,14 @@ const data = [
 //     timeTicketJob: selectCurrentTimeTicketJob,
 //   });
 
-const mapDispatchToProps = {};
+// const mapDispatchToProps = {};
 
 export function SelectCostCenter(props) {
 
 
-  const [value, setValue] = useState(null);
-  const [isFocus, setIsFocus] = useState(false);
+    const [selectorData, setSelectorData] = useState([]);
+    const [value, setValue] = useState(null);
+    const [isFocus, setIsFocus] = useState(false);
 
 
 //   const { loading, error, data } = useQuery(QUERY_EMPLOYEE_BY_ID, {
@@ -54,7 +55,7 @@ export function SelectCostCenter(props) {
         selectedTextStyle={styles.selectedTextStyle}
         inputSearchStyle={styles.inputSearchStyle}
         iconStyle={styles.iconStyle}
-        data={data}
+        data={props.selectorData}
         search
         maxHeight={300}
         labelField="label"
@@ -73,7 +74,7 @@ export function SelectCostCenter(props) {
   );
 }
 
-export default connect(null, mapDispatchToProps)(SelectCostCenter);
+export default connect(null, null)(SelectCostCenter);
 
 const styles = StyleSheet.create({
   container: {

components/screen-ap-time-ticket-list/screen-time-ticket-browser.component.jsx

@@ -12,6 +12,11 @@ import {
 } from "../../redux/employee/employee.selectors";
 import { Button } from "react-native-paper";
 
+//temp
+import { useQuery } from "@apollo/client";
+import ErrorDisplay from "../error-display/error-display.component";
+
+
 const mapStateToProps = createStructuredSelector({
   currentEmployee: selectCurrentEmployee,
   theRates: selectRates,
@@ -21,7 +26,7 @@ const mapStateToProps = createStructuredSelector({
 
 const mapDispatchToProps = (dispatch) => ({
   employeeGetRatesStart: (employeeId) =>
-    dispatch(employeeGetRatesStart({employeeId})),
+    dispatch(employeeGetRatesStart(employeeId)),
 });
 
 export function ScreenTimeTicketBrowser({
@@ -30,7 +35,13 @@ export function ScreenTimeTicketBrowser({
   employeeGetRatesStart,
   signingError
 }) {
+const employeeId = currentEmployee.technician.id;
 
+  // const { error, data } = useQuery(QUERY_EMPLOYEE_BY_ID, {
+  //   variables: { id: currentEmployee.technician.id },
+  // });
+  // const signingErrorMsg = error ? (<ErrorDisplay errorMessage={error.message} />) : null;
+ // const signingErrorMsg = signingError ? (<ErrorDisplay errorMessage={signingError} />) : null;
 
   const getRates = (currentEmployee) => {
     employeeGetRatesStart(currentEmployee.technician.id);
@@ -42,11 +53,11 @@ export function ScreenTimeTicketBrowser({
       <Button
                 mode="outlined"
                 loading={loaderGettingRates}
-                onPress={getRates}
+                onPress={() => getRates(currentEmployee)}
               >
                 <Text>text here</Text>
               </Button>
-              {signingError && <Text>signingError</Text>}
+              {/* {signingErrorMsg} */}
     </View>
   );
 }

components/time-ticket/screen-time-ticket-create.component.jsx

@@ -1,5 +1,5 @@
 import { Formik } from "formik";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { StyleSheet, Text } from "react-native";
 import { useTranslation } from "react-i18next";
 import { View, ScrollView } from "react-native";
@@ -9,18 +9,28 @@ import { Button, Dialog, TextInput } from "react-native-paper";
 import { QUERY_EMPLOYEE_BY_ID } from "../../graphql/employees.queries";
 //import SelectDropdown from 'react-native-select-dropdown';
 import { SelectCostCenter } from "../Selects/select-cost-center";
-import { selectCurrentEmployee } from "../../redux/employee/employee.selectors";
+import {
+  selectCurrentEmployee,
+  selectRates,
+} from "../../redux/employee/employee.selectors";
 import DateTimePickerModal from "react-native-modal-datetime-picker";
 
 //TODO add props needed for call
 const mapStateToProps = createStructuredSelector({
   currentEmployee: selectCurrentEmployee,
+  currentRatesNCostCenters: selectRates,
 });
-const mapDispatchToProps = (dispatch) => ({})
+const mapDispatchToProps = (dispatch) => ({});
+
+export function TimeTicketCreate({
+  currentEmployee,
+  currentRatesNCostCenters,
+}) {
+  const { t } = useTranslation();
 
-export function TimeTicketCreate({currentEmployee}) {
   const [isDatePickerVisible, setDatePickerVisibility] = useState(false);
   const [date2, setDate2] = useState(new Date());
+  const [costCenters, setCostCenters] = useState([]);
 
   const showDatePicker = () => {
     setDatePickerVisibility(true);
@@ -33,14 +43,23 @@ export function TimeTicketCreate({currentEmployee}) {
     //console.warn("A date has been picked: ", date);
     hideDatePicker();
   };
-
-  const { t } = useTranslation();
-
   const formSubmit = (values) => {
     Dialog.alert({ content: <pre>{JSON.stringify(values, null, 2)}</pre> });
     //TODO update with start call for create time ticket
   };
 
+  useEffect(() => {
+    var count = Object.keys(currentRatesNCostCenters).length;
+    let selectDataArray = [];
+    for (let i = 0; i < count; i++) {
+      selectDataArray.push({
+        value: currentRatesNCostCenters[i].cost_center,
+        label: currentRatesNCostCenters[i].cost_center,
+      });
+    }
+    setCostCenters(selectDataArray);
+  }, []);
+
   return (
     <View style={localStyles.content}>
       <ScrollView>
@@ -68,16 +87,10 @@ export function TimeTicketCreate({currentEmployee}) {
               />
 
               {/* Below will be replaced with a Date Picker*/}
-              {/* <TextInput
-                style={localStyles.input}
-                mode="flat"
-                onChangeText={handleChange("ticketdate")}
-                onBlur={handleBlur("ticketdate")}
-                value={values.ticketdate}
-                label={"Ticket Date"}
-              /> */}
+              {/* <TextInput style={localStyles.input} mode="flat" onChangeText={handleChange("ticketdate")} onBlur={handleBlur("ticketdate")} value={values.ticketdate} label={"Ticket Date"} /> */}
               <Button title="TicketDatePickerButton" onPress={showDatePicker}>
-                Ticket Date: {date2.toLocaleDateString()}
+                {" "}
+                Ticket Date: {date2.toLocaleDateString()}{" "}
               </Button>
               <DateTimePickerModal
                 isVisible={isDatePickerVisible}
@@ -96,7 +109,7 @@ export function TimeTicketCreate({currentEmployee}) {
                 label={"Employee"}
               />
 
-              <SelectCostCenter />
+              <SelectCostCenter selectorData={costCenters} />
               {/* Below will be replaced with SelectCostCenter */}
               <TextInput
                 style={localStyles.input}

redux/employee/employee.actions.js

@@ -19,13 +19,13 @@ export const employeeSignOut = () => ({
   type: EmployeeActionTypes.EMPLOYEE_SIGN_OUT,
 });
 
-export const employeeGetRatesStart = (id) => ({
+export const employeeGetRatesStart = (employeeId) => ({
   type: EmployeeActionTypes.EMPLOYEE_GET_RATES_START,
-  payload: id,
+  payload: employeeId,
 });
-export const employeeGetRatesSuccess = (technician) => ({
+export const employeeGetRatesSuccess = (employees_by_pk) => ({
   type: EmployeeActionTypes.EMPLOYEE_GET_RATES_SUCCESS,
-  payload: technician,
+  payload: employees_by_pk,
 });
 export const employeeGetRatesFailure = (error) => ({
   type: EmployeeActionTypes.EMPLOYEE_GET_RATES_FAILURE,

redux/employee/employee.reducer.js

@@ -46,8 +46,7 @@ const employeeReducer = (state = INITIAL_STATE, action) => {
     case EmployeeActionTypes.EMPLOYEE_GET_RATES_SUCCESS:
       return {
         ...state,
-        //currentEmployee: { authorized: true, technician:action.payload },
-        currentEmployee: { rates:action.payload },//TODO check if ...state needed
+        currentEmployee: { ...state.currentEmployee, technician:action.payload },
         gettingRates: false,
         error: null,
       };

redux/employee/employee.sagas.js

@@ -13,6 +13,8 @@ import { logImEXEvent } from "../../firebase/firebase.analytics";
 import { selectBodyshop } from "../user/user.selectors";
 import axios from "axios";
 import { client } from "../../graphql/client";
+import { QUERY_EMPLOYEE_BY_ID } from "../../graphql/employees.queries";
+import { selectCurrentEmployee } from "./employee.selectors";
 
 export function* onSignInEmployeeStart() {
   yield takeLatest(
@@ -43,34 +45,68 @@ export function* signInWithEmployeeId({ payload: { employeeId, pin } }) {
   }
 }
 
+/*
+//Waits for EMPLOYEE_SIGN_IN_SUCCESS when logging in to then call QUERY_EMPLOYEE_BY_ID with the id in payload to override technician with more data like rates and flat_rate
+*/
+export function* onEmployeeSignInSuccessSaga() {
+  yield takeLatest(
+    EmployeeActionTypes.EMPLOYEE_SIGN_IN_SUCCESS,
+    updateEmployeeWithEmployeeId
+  );
+}
+export function* updateEmployeeWithEmployeeId({ payload }) {
+  try {
+    const employeeId = payload.id;
+    // logImEXEvent("redux_update_employee_with_employee_id_attempt", employeeId);
+    const result = yield client.query({ query: QUERY_EMPLOYEE_BY_ID,
+      variables: {
+        id: employeeId,
+      } 
+    });
+    const { employees_by_pk } = result.data;
+    if (employees_by_pk) {
+      yield put(employeeGetRatesSuccess(employees_by_pk));
+    } else {
+      yield put(employeeGetRatesFailure(result.error));
+    }
+  } catch (error) {
+    yield put(employeeGetRatesFailure(error));
+    console.log("Error while getting employee rates.", error);
+    //Sentry.Native.captureException(error);
+  }
+}
+
+
+
 export function* onEmployeeGetRatesStart() {
   yield takeLatest(
     EmployeeActionTypes.EMPLOYEE_GET_RATES_START,
     getRatesWithEmployeeId
   );
 }
-export function* getRatesWithEmployeeId({ payload }) {
+export function* getRatesWithEmployeeId({ payload: employeeId }) {
   try {
-    const response = yield client.query({ query: QUERY_EMPLOYEE_BY_ID,
+    
+    logImEXEvent("redux_employee_get_rates_attempt", employeeId);
+    const result = yield client.query({ query: QUERY_EMPLOYEE_BY_ID,
       variables: {
-        id: payload.id,
+        id: employeeId,
       } 
     });
-    logImEXEvent("redux_employee_get_rates_attempt", payload);
-    const { valid, technician, error } = response.data;
+    const { employees_by_pk } = result.data;
 
-    if (valid) {
-      yield put(employeeGetRatesSuccess(technician));
+    if (employees_by_pk) {
+      yield put(employeeGetRatesSuccess(employees_by_pk));
     } else {
       yield put(employeeGetRatesFailure(error));
     }
   } catch (error) {
     yield put(employeeGetRatesFailure(error));
     console.log("Error while getting employee rates.", error);
-    Sentry.Native.captureException(error);
+    //Sentry.Native.captureException(error);
   }
 }
 
 export function* employeeSagas() {
-  yield all([call(onSignInEmployeeStart), call(employeeGetRatesSuccess)]);
+  yield all([call(onSignInEmployeeStart), call(onEmployeeSignInSuccessSaga), call(onEmployeeGetRatesStart)]);
 }

redux/employee/employee.selectors.js

@@ -16,7 +16,7 @@ export const selectSignInError = createSelector(
 );
 export const selectRates = createSelector(
   [selectEmployee],
-  (employee) => employee.currentEmployee.rates
+  (employee) => employee.currentEmployee.technician.rates
 );
 export const selectGettingRates = createSelector(
   [selectEmployee],