Fix Formatting issues

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/job-detail-lines/job-lines-expander.component.jsx

@@ -1,17 +1,17 @@
-import {useQuery} from "@apollo/client";
-import {Col, Divider, Row, Skeleton, Space, Timeline, Typography} from "antd";
+import { useQuery } from "@apollo/client";
+import { Col, Divider, Row, Skeleton, Space, Timeline, Typography } from "antd";
 import React from "react";
-import {useTranslation} from "react-i18next";
-import {Link} from "react-router-dom";
-import {GET_JOB_LINE_ORDERS} from "../../graphql/jobs.queries";
+import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
+import { GET_JOB_LINE_ORDERS } from "../../graphql/jobs.queries";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
-import {DateFormatter} from "../../utils/DateFormatter";
+import { DateFormatter } from "../../utils/DateFormatter";
 import AlertComponent from "../alert/alert.component";
 
-import {connect} from "react-redux";
-import {createStructuredSelector} from "reselect";
-import {selectBodyshop, selectCurrentUser} from "../../redux/user/user.selectors";
-import {QUERY_JOBLINE_TASKS_PAGINATED} from "../../graphql/tasks.queries.js";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
+import { QUERY_JOBLINE_TASKS_PAGINATED } from "../../graphql/tasks.queries.js";
 import TaskListContainer from "../task-list/task-list.container.jsx";
 
 const mapStateToProps = createStructuredSelector({
@@ -23,9 +23,9 @@ const mapDispatchToProps = (dispatch) => ({
 });
 export default connect(mapStateToProps, mapDispatchToProps)(JobLinesExpander);
 
-export function JobLinesExpander({jobline, jobid, bodyshop, currentUser}) {
-  const {t} = useTranslation();
-  const {loading, error, data} = useQuery(GET_JOB_LINE_ORDERS, {
+export function JobLinesExpander({ jobline, jobid, bodyshop, currentUser }) {
+  const { t } = useTranslation();
+  const { loading, error, data } = useQuery(GET_JOB_LINE_ORDERS, {
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",
     variables: {
@@ -33,8 +33,8 @@ export function JobLinesExpander({jobline, jobid, bodyshop, currentUser}) {
     }
   });
 
-  if (loading) return <Skeleton/>;
-  if (error) return <AlertComponent message={error.message} type="error"/>;
+  if (loading) return <Skeleton />;
+  if (error) return <AlertComponent message={error.message} type="error" />;
 
   return (
     <Row>
@@ -44,23 +44,23 @@ export function JobLinesExpander({jobline, jobid, bodyshop, currentUser}) {
           items={
             data.parts_order_lines.length > 0
               ? data.parts_order_lines.map((line) => ({
-                key: line.id,
-                children: (
-                  <Space split={<Divider type="vertical"/>} wrap>
-                    <Link to={`/manage/jobs/${jobid}?partsorderid=${line.parts_order.id}`}>
-                      {line.parts_order.order_number}
-                    </Link>
-                    <DateFormatter>{line.parts_order.order_date}</DateFormatter>
-                    {line.parts_order.vendor.name}
-                  </Space>
-                )
-              }))
+                  key: line.id,
+                  children: (
+                    <Space split={<Divider type="vertical" />} wrap>
+                      <Link to={`/manage/jobs/${jobid}?partsorderid=${line.parts_order.id}`}>
+                        {line.parts_order.order_number}
+                      </Link>
+                      <DateFormatter>{line.parts_order.order_date}</DateFormatter>
+                      {line.parts_order.vendor.name}
+                    </Space>
+                  )
+                }))
               : [
-                {
-                  key: "no-orders",
-                  children: t("parts_orders.labels.notyetordered")
-                }
-              ]
+                  {
+                    key: "no-orders",
+                    children: t("parts_orders.labels.notyetordered")
+                  }
+                ]
           }
         />{" "}
       </Col>
@@ -70,33 +70,33 @@ export function JobLinesExpander({jobline, jobid, bodyshop, currentUser}) {
           items={
             data.billlines.length > 0
               ? data.billlines.map((line) => ({
-                key: line.id,
-                children: (
-                  <Row wrap>
-                    <Col span={4}>
-                      <Link to={`/manage/jobs/${jobid}?tab=partssublet&billid=${line.bill.id}`}>
-                        {line.bill.invoice_number}
-                      </Link>
-                    </Col>
-                    <Col span={4}>
+                  key: line.id,
+                  children: (
+                    <Row wrap>
+                      <Col span={4}>
+                        <Link to={`/manage/jobs/${jobid}?tab=partssublet&billid=${line.bill.id}`}>
+                          {line.bill.invoice_number}
+                        </Link>
+                      </Col>
+                      <Col span={4}>
                         <span>
                           {`${t("billlines.fields.actual_price")}: `}
                           <CurrencyFormatter>{line.actual_price}</CurrencyFormatter>
                         </span>
-                    </Col>
-                    <Col span={4}>
+                      </Col>
+                      <Col span={4}>
                         <span>
                           {`${t("billlines.fields.actual_cost")}: `}
                           <CurrencyFormatter>{line.actual_cost}</CurrencyFormatter>
                         </span>
-                    </Col>
-                    <Col span={4}>
-                      <DateFormatter>{line.bill.date}</DateFormatter>
-                    </Col>
-                    <Col span={4}> {line.bill.vendor.name}</Col>
-                  </Row>
-                )
-              }))
+                      </Col>
+                      <Col span={4}>
+                        <DateFormatter>{line.bill.date}</DateFormatter>
+                      </Col>
+                      <Col span={4}> {line.bill.vendor.name}</Col>
+                    </Row>
+                  )
+                }))
               : [
                   {
                     key: "no-orders",
@@ -112,31 +112,35 @@ export function JobLinesExpander({jobline, jobid, bodyshop, currentUser}) {
           items={
             data.parts_dispatch_lines.length > 0
               ? data.parts_dispatch_lines.map((line) => ({
-                key: line.id,
-                children: (
-                  <Space split={<Divider type="vertical"/>} wrap>
-                    <Link
-                      to={`/manage/jobs/${jobid}?partsorderid=${line.id}`}>{line.parts_dispatch.number}</Link>
-                    {bodyshop.employees.find((e) => e.id === line.parts_dispatch.employeeid)?.first_name}
-                    <Space>
-                      {t("parts_dispatch_lines.fields.accepted_at")}
-                      <DateFormatter>{line.accepted_at}</DateFormatter>
+                  key: line.id,
+                  children: (
+                    <Space split={<Divider type="vertical" />} wrap>
+                      <Link to={`/manage/jobs/${jobid}?partsorderid=${line.id}`}>{line.parts_dispatch.number}</Link>
+                      {bodyshop.employees.find((e) => e.id === line.parts_dispatch.employeeid)?.first_name}
+                      <Space>
+                        {t("parts_dispatch_lines.fields.accepted_at")}
+                        <DateFormatter>{line.accepted_at}</DateFormatter>
+                      </Space>
                     </Space>
-                  </Space>
-                )
-              }))
+                  )
+                }))
               : {
-                key: "dispatch-lines",
-                children: t("parts_orders.labels.notyetordered")
-              }
+                  key: "dispatch-lines",
+                  children: t("parts_orders.labels.notyetordered")
+                }
           }
         />
       </Col>
       <Col md={24} lg={24}>
-        <TaskListContainer currentUser={currentUser} bodyshop={bodyshop} parentJobId={jobid}
-                           relationshipType={'joblineid'} relationshipId={jobline.id}
-                           query={QUERY_JOBLINE_TASKS_PAGINATED}
-                           titleTranslation='tasks.titles.job_tasks'/>
+        <TaskListContainer
+          currentUser={currentUser}
+          bodyshop={bodyshop}
+          parentJobId={jobid}
+          relationshipType={"joblineid"}
+          relationshipId={jobline.id}
+          query={QUERY_JOBLINE_TASKS_PAGINATED}
+          titleTranslation="tasks.titles.job_tasks"
+        />
       </Col>
     </Row>
   );

client/src/components/job-detail-lines/job-lines.component.jsx

@@ -42,7 +42,7 @@ import JobSendPartPriceChangeComponent from "../job-send-parts-price-change/job-
 import PartsOrderModalContainer from "../parts-order-modal/parts-order-modal.container";
 import JobLinesExpander from "./job-lines-expander.component";
 import JobLinesPartPriceChange from "./job-lines-part-price-change.component";
-import {FaTasks} from "react-icons/fa";
+import { FaTasks } from "react-icons/fa";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -54,7 +54,7 @@ const mapDispatchToProps = (dispatch) => ({
   setJobLineEditContext: (context) => dispatch(setModalContext({ context: context, modal: "jobLineEdit" })),
   setPartsOrderContext: (context) => dispatch(setModalContext({ context: context, modal: "partsOrder" })),
   setBillEnterContext: (context) => dispatch(setModalContext({ context: context, modal: "billEnter" })),
-  setTaskUpsertContext: (context) => dispatch(setModalContext({context, modal: 'taskUpsert'})),
+  setTaskUpsertContext: (context) => dispatch(setModalContext({ context, modal: "taskUpsert" }))
 });
 
 export function JobLinesComponent({
@@ -334,15 +334,18 @@ export function JobLinesComponent({
               >
                 <EditFilled />
               </Button>
-              <Button title={t('tasks.buttons.create')} onClick={() => {
-                setTaskUpsertContext({
-                  context: {
-                    jobid: job.id,
-                    joblineid: record.id
-                  }
-                });
-              }}>
-                <FaTasks/>
+              <Button
+                title={t("tasks.buttons.create")}
+                onClick={() => {
+                  setTaskUpsertContext({
+                    context: {
+                      jobid: job.id,
+                      joblineid: record.id
+                    }
+                  });
+                }}
+              >
+                <FaTasks />
               </Button>
               <Button
                 disabled={jobRO}
@@ -457,7 +460,7 @@ export function JobLinesComponent({
               disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
               onClick={() => {
                 setBillEnterContext({
-                  actions: {refetch: refetch },
+                  actions: { refetch: refetch },
                   context: {
                     disableInvNumber: true,
                     job: { id: job.id },
@@ -465,7 +468,7 @@ export function JobLinesComponent({
                       vendorid: bodyshop.inhousevendorid,
                       invoice_number: "ih",
                       isinhouse: true,
-                      date:  dayjs(),
+                      date: dayjs(),
                       total: 0,
                       billlines: selectedLines.map((p) => {
                         return {