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}