Added shift clock framework + login on tech console BOD-97 BOD-188

client/src/components/time-ticket-shift/time-ticket-shift.container.jsx

@@ -0,0 +1,57 @@
+import React from "react";
+import { useQuery } from "react-apollo";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { QUERY_ACTIVE_SHIFT_TIME_TICKETS } from "../../graphql/timetickets.queries";
+import { selectTechnician } from "../../redux/tech/tech.selectors";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import AlertComponent from "../alert/alert.component";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import TimeTicketShiftActive from "../time-ticket-shift-active/time-ticket-shift-active.component";
+import TimeTicketShiftFormContainer from "../time-ticket-shift-form/time-ticket-shift-form.container";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+  technician: selectTechnician,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+
+export function TimeTicketShiftContainer({
+  bodyshop,
+  technician,
+  isTechConsole,
+}) {
+  const { loading, error, data, refetch } = useQuery(
+    QUERY_ACTIVE_SHIFT_TIME_TICKETS,
+    {
+      variables: {
+        employeeId: isTechConsole
+          ? technician.id
+          : bodyshop.associations[0].user.employee.id,
+      },
+    }
+  );
+
+  if (loading) return <LoadingSpinner />;
+  if (error) return <AlertComponent message={error.message} type='error' />;
+
+  return (
+    <div>
+      {data.timetickets.length > 0 ? (
+        <TimeTicketShiftActive
+          timetickets={data ? data.timetickets : []}
+          refetch={refetch}
+        />
+      ) : (
+        <TimeTicketShiftFormContainer isTechConsole={isTechConsole} />
+      )}
+    </div>
+  );
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(TimeTicketShiftContainer);