IO-2568 Button Padding in Print Center Label Modal

Signed-off-by: Allan Carr <allan.carr@thinkimex.com>

client/src/components/bill-detail-edit/bill-detail-edit-component.jsx

@@ -1,5 +1,5 @@
 import { useMutation, useQuery } from "@apollo/client";
-import { Button, Form, PageHeader, Popconfirm, Space } from "antd";
+import { Button, Divider, Form, PageHeader, Popconfirm, Space } from "antd";
 import moment from "moment";
 import queryString from "query-string";
 import React, { useState } from "react";
@@ -208,7 +208,7 @@ export function BillDetailEditcontainer({
             layout="vertical"
           >
             <BillFormContainer form={form} billEdit disabled={exported} />
-
+            <Divider orientation="left">{t("general.labels.media")}</Divider>
             {bodyshop.uselocalmediaserver ? (
               <JobsDocumentsLocalGallery
                 job={{ id: data ? data.bills_by_pk.jobid : null }}

client/src/components/bill-detail-edit/bill-detail-edit-return.component.jsx

@@ -173,7 +173,11 @@ export function BillDetailEditReturn({
         </Form>
       </Modal>
       <Button
-        disabled={data.bills_by_pk.is_credit_memo || disabled}
+        disabled={
+          data.bills_by_pk.is_credit_memo ||
+          data.bills_by_pk.isinhouse ||
+          disabled
+        }
         onClick={() => {
           setVisible(true);
         }}

client/src/components/bill-form/bill-form.component.jsx

@@ -504,10 +504,11 @@ export function BillFormComponent({
           billEdit={billEdit}
         />
       )}
-
+      <Divider orientation="left" style={{ display: billEdit ? "none" : null }}>
+        {t("documents.labels.upload")}
+      </Divider>
       <Form.Item
         name="upload"
-        label="Upload"
         style={{ display: billEdit ? "none" : null }}
         valuePropName="fileList"
         getValueFromEvent={(e) => {

client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx

@@ -61,6 +61,10 @@ export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
           text: t("courtesycars.status.in"),
           value: "courtesycars.status.in",
         },
+        {
+          text: t("courtesycars.status.inservice"),
+          value: "courtesycars.status.inservice",
+        },
         {
           text: t("courtesycars.status.out"),
           value: "courtesycars.status.out",
@@ -74,7 +78,7 @@ export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
           value: "courtesycars.status.leasereturn",
         },
       ],
-      onFilter: (value, record) => value.includes(record.status),
+      onFilter: (value, record) => record.status === value,
       sortOrder:
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
       render: (text, record) => {
@@ -178,7 +182,7 @@ export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
       title: t("courtesycars.fields.fuel"),
       dataIndex: "fuel",
       key: "fuel",
-      sorter: (a, b) => alphaSort(a.fuel, b.fuel),
+      sorter: (a, b) => a.fuel - b.fuel,
       sortOrder:
         state.sortedInfo.columnKey === "fuel" && state.sortedInfo.order,
       render: (text, record) => {
@@ -187,12 +191,14 @@ export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
             return t("courtesycars.labels.fuel.full");
           case 88:
             return t("courtesycars.labels.fuel.78");
+          case 75:
+            return t("courtesycars.labels.fuel.34");
           case 63:
             return t("courtesycars.labels.fuel.58");
           case 50:
             return t("courtesycars.labels.fuel.12");
           case 38:
-            return t("courtesycars.labels.fuel.34");
+            return t("courtesycars.labels.fuel.38");
           case 25:
             return t("courtesycars.labels.fuel.14");
           case 13:

client/src/components/dashboard-components/job-lifecycle/job-lifecycle-dashboard.component.jsx

@@ -0,0 +1,169 @@
+import {Card, Table, Tag} from "antd";
+import LoadingSkeleton from "../../loading-skeleton/loading-skeleton.component";
+import {useTranslation} from "react-i18next";
+import React, {useEffect, useState} from "react";
+import moment from "moment";
+import DashboardRefreshRequired from "../refresh-required.component";
+import axios from "axios";
+
+const fortyFiveDaysAgo = () => moment().subtract(45, 'days').toLocaleString();
+
+export default function JobLifecycleDashboardComponent({data, bodyshop, ...cardProps}) {
+    const {t} = useTranslation();
+    const [loading, setLoading] = useState(false);
+    const [lifecycleData, setLifecycleData] = useState(null);
+
+    useEffect(() => {
+        async function getLifecycleData() {
+            if (data && data.job_lifecycle) {
+                setLoading(true);
+                const response = await axios.post("/job/lifecycle", {
+                    jobids: data.job_lifecycle.map(x => x.id),
+                    statuses: bodyshop.md_ro_statuses
+                });
+                setLifecycleData(response.data.durations);
+                setLoading(false);
+            }
+        }
+
+        getLifecycleData().catch(e => {
+            console.error(`Error in getLifecycleData: ${e}`);
+        })
+    }, [data, bodyshop]);
+
+    const columns = [
+        {
+            title: t('job_lifecycle.columns.status'),
+            dataIndex: 'status',
+            bgColor: 'red',
+            key: 'status',
+            render: (text, record) => {
+                return <Tag color={record.color}>{record.status}</Tag>
+            }
+        },
+        {
+            title: t('job_lifecycle.columns.human_readable'),
+            dataIndex: 'humanReadable',
+            key: 'humanReadable',
+        },
+        {
+            title: t('job_lifecycle.columns.status_count'),
+            key: 'statusCount',
+            render: (text, record) => {
+                return lifecycleData.statusCounts[record.status];
+            }
+        },
+        {
+            title: t('job_lifecycle.columns.percentage'),
+            dataIndex: 'percentage',
+            key: 'percentage',
+            render: (text, record) => {
+                return record.percentage.toFixed(2) + '%';
+            }
+        },
+    ];
+
+    if (!data) return null;
+
+    if (!data.job_lifecycle || !lifecycleData) return <DashboardRefreshRequired {...cardProps} />;
+
+    const extra = `${t('job_lifecycle.content.calculated_based_on')} ${lifecycleData.jobs} ${t('job_lifecycle.content.jobs_in_since')} ${fortyFiveDaysAgo()}`
+
+    return (
+        <Card title={t("job_lifecycle.titles.dashboard")} {...cardProps}>
+            <LoadingSkeleton loading={loading}>
+                <div style={{overflow: 'scroll', height: "100%"}}>
+                    <div id="bar-container" style={{
+                        display: 'flex',
+                        width: '100%',
+                        height: '100px',
+                        textAlign: 'center',
+                        borderRadius: '5px',
+                        borderWidth: '5px',
+                        borderStyle: 'solid',
+                        borderColor: '#f0f2f5',
+                        margin: 0,
+                        padding: 0
+                    }}>
+                        {lifecycleData.summations.map((key, index, array) => {
+                            const isFirst = index === 0;
+                            const isLast = index === array.length - 1;
+                            return (
+                                <div key={key.status} style={{
+                                    overflow: 'hidden',
+                                    display: 'flex',
+                                    flexDirection: 'column',
+                                    justifyContent: 'center',
+                                    alignItems: 'center',
+                                    margin: 0,
+                                    padding: 0,
+
+                                    borderTop: '1px solid #f0f2f5',
+                                    borderBottom: '1px solid #f0f2f5',
+                                    borderLeft: isFirst ? '1px solid #f0f2f5' : undefined,
+                                    borderRight: isLast ? '1px solid #f0f2f5' : undefined,
+
+                                    backgroundColor: key.color,
+                                    width: `${key.percentage}%`
+                                }}
+                                     aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
+                                     title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
+                                >
+
+                                    {key.percentage > 15 ?
+                                        <>
+                                            <div>{key.roundedPercentage}</div>
+                                            <div style={{
+                                                backgroundColor: '#f0f2f5',
+                                                borderRadius: '5px',
+                                                paddingRight: '2px',
+                                                paddingLeft: '2px',
+                                                fontSize: '0.8rem',
+                                            }}>
+                                                {key.status}
+                                            </div>
+                                        </>
+                                        : null}
+                                </div>
+                            );
+                        })}
+                    </div>
+                    <Card extra={extra} type='inner' title={t('job_lifecycle.content.legend_title')}
+                          style={{marginTop: '10px'}}>
+                        <div>
+                            {lifecycleData.summations.map((key) => (
+                                <Tag color={key.color} style={{width: '13vh', padding: '4px', margin: '4px'}}>
+                                    <div
+                                        aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
+                                        title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
+                                        style={{
+                                            backgroundColor: '#f0f2f5',
+                                            color: '#000',
+                                            padding: '4px',
+                                            textAlign: 'center'
+                                        }}>
+                                        {key.status} [{lifecycleData.statusCounts[key.status]}] ({key.roundedPercentage})
+                                    </div>
+                                </Tag>
+                            ))}
+                        </div>
+                    </Card>
+                    <Card style={{marginTop: "5px"}} type='inner' title={t("job_lifecycle.titles.top_durations")}>
+                        <Table size="small" pagination={false} columns={columns}
+                               dataSource={lifecycleData.summations.sort((a, b) => b.value - a.value).slice(0, 3)}/>
+                    </Card>
+                </div>
+            </LoadingSkeleton>
+        </Card>
+    );
+}
+
+export const JobLifecycleDashboardGQL = `
+job_lifecycle: jobs(where: {
+    actual_in: {
+        _gte: "${moment().subtract(45, 'days').toISOString()}"
+    }
+}) {
+    id
+    actual_in
+} `;

client/src/components/dashboard-grid/dashboard-grid.component.jsx

@@ -1,380 +1,391 @@
-import Icon, { SyncOutlined } from "@ant-design/icons";
+import Icon, {SyncOutlined} from "@ant-design/icons";
-import { gql, useMutation, useQuery } from "@apollo/client";
+import {gql, useMutation, useQuery} from "@apollo/client";
-import { Button, Dropdown, Menu, PageHeader, Space, notification } from "antd";
+import {Button, Dropdown, Menu, notification, PageHeader, Space} from "antd";
 import i18next from "i18next";
 import _ from "lodash";
 import moment from "moment";
-import React, { useState } from "react";
+import React, {useState} from "react";
-import { Responsive, WidthProvider } from "react-grid-layout";
+import {Responsive, WidthProvider} from "react-grid-layout";
-import { useTranslation } from "react-i18next";
+import {useTranslation} from "react-i18next";
-import { MdClose } from "react-icons/md";
+import {MdClose} from "react-icons/md";
-import { connect } from "react-redux";
+import {connect} from "react-redux";
-import { createStructuredSelector } from "reselect";
+import {createStructuredSelector} from "reselect";
-import { logImEXEvent } from "../../firebase/firebase.utils";
+import {logImEXEvent} from "../../firebase/firebase.utils";
-import { UPDATE_DASHBOARD_LAYOUT } from "../../graphql/user.queries";
+import {UPDATE_DASHBOARD_LAYOUT} from "../../graphql/user.queries";
-import {
+import {selectBodyshop, selectCurrentUser,} from "../../redux/user/user.selectors";
-  selectBodyshop,
-  selectCurrentUser,
-} from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
 import DashboardMonthlyEmployeeEfficiency, {
-  DashboardMonthlyEmployeeEfficiencyGql,
+    DashboardMonthlyEmployeeEfficiencyGql,
 } from "../dashboard-components/monthly-employee-efficiency/monthly-employee-efficiency.component";
 import DashboardMonthlyJobCosting from "../dashboard-components/monthly-job-costing/monthly-job-costing.component";
 import DashboardMonthlyLaborSales from "../dashboard-components/monthly-labor-sales/monthly-labor-sales.component";
 import DashboardMonthlyPartsSales from "../dashboard-components/monthly-parts-sales/monthly-parts-sales.component";
 import DashboardMonthlyRevenueGraph, {
-  DashboardMonthlyRevenueGraphGql,
+    DashboardMonthlyRevenueGraphGql,
 } from "../dashboard-components/monthly-revenue-graph/monthly-revenue-graph.component";
 import DashboardProjectedMonthlySales, {
-  DashboardProjectedMonthlySalesGql,
+    DashboardProjectedMonthlySalesGql,
 } from "../dashboard-components/pojected-monthly-sales/projected-monthly-sales.component";
-import DashboardTotalProductionDollars from "../dashboard-components/total-production-dollars/total-production-dollars.component";
+import DashboardTotalProductionDollars
+    from "../dashboard-components/total-production-dollars/total-production-dollars.component";
 import DashboardTotalProductionHours, {
-  DashboardTotalProductionHoursGql,
+    DashboardTotalProductionHoursGql,
 } from "../dashboard-components/total-production-hours/total-production-hours.component";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 //Combination of the following:
 // /node_modules/react-grid-layout/css/styles.css
 // /node_modules/react-resizable/css/styles.css
 import DashboardScheduledInToday, {
-  DashboardScheduledInTodayGql,
+    DashboardScheduledInTodayGql,
 } from "../dashboard-components/scheduled-in-today/scheduled-in-today.component";
 import DashboardScheduledOutToday, {
-  DashboardScheduledOutTodayGql,
+    DashboardScheduledOutTodayGql,
 } from "../dashboard-components/scheduled-out-today/scheduled-out-today.component";
+import JobLifecycleDashboardComponent, {
+    JobLifecycleDashboardGQL
+} from "../dashboard-components/job-lifecycle/job-lifecycle-dashboard.component";
 import "./dashboard-grid.styles.scss";
-import { GenerateDashboardData } from "./dashboard-grid.utils";
+import {GenerateDashboardData} from "./dashboard-grid.utils";
 
 const ResponsiveReactGridLayout = WidthProvider(Responsive);
 
 const mapStateToProps = createStructuredSelector({
-  currentUser: selectCurrentUser,
+    currentUser: selectCurrentUser,
-  bodyshop: selectBodyshop,
+    bodyshop: selectBodyshop,
 });
 const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
+    //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
 
-export function DashboardGridComponent({ currentUser, bodyshop }) {
+export function DashboardGridComponent({currentUser, bodyshop}) {
-  const { t } = useTranslation();
+    const {t} = useTranslation();
-  const [state, setState] = useState({
+    const [state, setState] = useState({
-    ...(bodyshop.associations[0].user.dashboardlayout
+        ...(bodyshop.associations[0].user.dashboardlayout
-      ? bodyshop.associations[0].user.dashboardlayout
+            ? bodyshop.associations[0].user.dashboardlayout
-      : { items: [], layout: {}, layouts: [] }),
+            : {items: [], layout: {}, layouts: []}),
-  });
-
-  const { loading, error, data, refetch } = useQuery(
-    createDashboardQuery(state),
-    { fetchPolicy: "network-only", nextFetchPolicy: "network-only" }
-  );
-
-  const [updateLayout] = useMutation(UPDATE_DASHBOARD_LAYOUT);
-
-  const handleLayoutChange = async (layout, layouts) => {
-    logImEXEvent("dashboard_change_layout");
-
-    setState({ ...state, layout, layouts });
-
-    const result = await updateLayout({
-      variables: {
-        email: currentUser.email,
-        layout: { ...state, layout, layouts },
-      },
     });
-    if (!!result.errors) {
-      notification["error"]({
-        message: t("dashboard.errors.updatinglayout", {
-          message: JSON.stringify(result.errors),
-        }),
-      });
-    }
-  };
-  const handleRemoveComponent = (key) => {
-    logImEXEvent("dashboard_remove_component", { name: key });
-    const idxToRemove = state.items.findIndex((i) => i.i === key);
 
-    const items = _.cloneDeep(state.items);
+    const {loading, error, data, refetch} = useQuery(
+        createDashboardQuery(state),
+        {fetchPolicy: "network-only", nextFetchPolicy: "network-only"}
+    );
 
-    items.splice(idxToRemove, 1);
+    const [updateLayout] = useMutation(UPDATE_DASHBOARD_LAYOUT);
-    setState({ ...state, items });
-  };
 
-  const handleAddComponent = (e) => {
+    const handleLayoutChange = async (layout, layouts) => {
-    logImEXEvent("dashboard_add_component", { name: e });
+        logImEXEvent("dashboard_change_layout");
-    setState({
-      ...state,
-      items: [
-        ...state.items,
-        {
-          i: e.key,
-          x: (state.items.length * 2) % (state.cols || 12),
-          y: 99, // puts it at the bottom
-          w: componentList[e.key].w || 2,
-          h: componentList[e.key].h || 2,
-        },
-      ],
-    });
-  };
 
-  const dashboarddata = React.useMemo(
+        setState({...state, layout, layouts});
-    () => GenerateDashboardData(data),
-    [data]
-  );
-  const existingLayoutKeys = state.items.map((i) => i.i);
-  const addComponentOverlay = (
-    <Menu onClick={handleAddComponent}>
-      {Object.keys(componentList).map((key) => (
-        <Menu.Item
-          key={key}
-          value={key}
-          disabled={existingLayoutKeys.includes(key)}
-        >
-          {componentList[key].label}
-        </Menu.Item>
-      ))}
-    </Menu>
-  );
 
-  if (error) return <AlertComponent message={error.message} type="error" />;
+        const result = await updateLayout({
-
+            variables: {
-  return (
+                email: currentUser.email,
-    <div>
+                layout: {...state, layout, layouts},
-      <PageHeader
+            },
-        extra={
+        });
-          <Space>
+        if (!!result.errors) {
-            <Button onClick={() => refetch()}>
+            notification["error"]({
-              <SyncOutlined />
+                message: t("dashboard.errors.updatinglayout", {
-            </Button>
+                    message: JSON.stringify(result.errors),
-            <Dropdown overlay={addComponentOverlay} trigger={["click"]}>
+                }),
-              <Button>{t("dashboard.actions.addcomponent")}</Button>
+            });
-            </Dropdown>
-          </Space>
         }
-      />
+    };
+    const handleRemoveComponent = (key) => {
+        logImEXEvent("dashboard_remove_component", {name: key});
+        const idxToRemove = state.items.findIndex((i) => i.i === key);
 
-      <ResponsiveReactGridLayout
+        const items = _.cloneDeep(state.items);
-        className="layout"
+
-        breakpoints={{ lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 }}
+        items.splice(idxToRemove, 1);
-        cols={{ lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 }}
+        setState({...state, items});
-        width="100%"
+    };
-        layouts={state.layouts}
+
-        onLayoutChange={handleLayoutChange}
+    const handleAddComponent = (e) => {
-        //   onBreakpointChange={onBreakpointChange}
+        logImEXEvent("dashboard_add_component", {name: e});
-      >
+        setState({
-        {state.items.map((item, index) => {
+            ...state,
-          const TheComponent = componentList[item.i].component;
+            items: [
-          return (
+                ...state.items,
-            <div
+                {
-              key={item.i}
+                    i: e.key,
-              data-grid={{
+                    x: (state.items.length * 2) % (state.cols || 12),
-                ...item,
+                    y: 99, // puts it at the bottom
-                minH: componentList[item.i].minH || 1,
+                    w: componentList[e.key].w || 2,
-                minW: componentList[item.i].minW || 1,
+                    h: componentList[e.key].h || 2,
-              }}
+                },
+            ],
+        });
+    };
+
+    const dashboarddata = React.useMemo(
+        () => GenerateDashboardData(data),
+        [data]
+    );
+    const existingLayoutKeys = state.items.map((i) => i.i);
+    const addComponentOverlay = (
+        <Menu onClick={handleAddComponent}>
+            {Object.keys(componentList).map((key) => (
+                <Menu.Item
+                    key={key}
+                    value={key}
+                    disabled={existingLayoutKeys.includes(key)}
+                >
+                    {componentList[key].label}
+                </Menu.Item>
+            ))}
+        </Menu>
+    );
+
+    if (error) return <AlertComponent message={error.message} type="error"/>;
+
+    return (
+        <div>
+            <PageHeader
+                extra={
+                    <Space>
+                        <Button onClick={() => refetch()}>
+                            <SyncOutlined/>
+                        </Button>
+                        <Dropdown overlay={addComponentOverlay} trigger={["click"]}>
+                            <Button>{t("dashboard.actions.addcomponent")}</Button>
+                        </Dropdown>
+                    </Space>
+                }
+            />
+
+            <ResponsiveReactGridLayout
+                className="layout"
+                breakpoints={{lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0}}
+                cols={{lg: 12, md: 10, sm: 6, xs: 4, xxs: 2}}
+                width="100%"
+                layouts={state.layouts}
+                onLayoutChange={handleLayoutChange}
+                //   onBreakpointChange={onBreakpointChange}
             >
-              <LoadingSkeleton loading={loading}>
+                {state.items.map((item, index) => {
-                <Icon
+                    const TheComponent = componentList[item.i].component;
-                  component={MdClose}
+                    return (
-                  key={item.i}
+                        <div
-                  style={{
+                            key={item.i}
-                    position: "absolute",
+                            data-grid={{
-                    zIndex: "2",
+                                ...item,
-                    right: ".25rem",
+                                minH: componentList[item.i].minH || 1,
-                    top: ".25rem",
+                                minW: componentList[item.i].minW || 1,
-                    cursor: "pointer",
+                            }}
-                  }}
+                        >
-                  onClick={() => handleRemoveComponent(item.i)}
+                            <LoadingSkeleton loading={loading}>
-                />
+                                <Icon
-                <TheComponent className="dashboard-card" data={dashboarddata} />
+                                    component={MdClose}
-              </LoadingSkeleton>
+                                    key={item.i}
-            </div>
+                                    style={{
-          );
+                                        position: "absolute",
-        })}
+                                        zIndex: "2",
-      </ResponsiveReactGridLayout>
+                                        right: ".25rem",
-    </div>
+                                        top: ".25rem",
-  );
+                                        cursor: "pointer",
+                                    }}
+                                    onClick={() => handleRemoveComponent(item.i)}
+                                />
+                                <TheComponent className="dashboard-card" bodyshop={bodyshop} data={dashboarddata}/>
+                            </LoadingSkeleton>
+                        </div>
+                    );
+                })}
+            </ResponsiveReactGridLayout>
+        </div>
+    );
 }
 
 export default connect(
-  mapStateToProps,
+    mapStateToProps,
-  mapDispatchToProps
+    mapDispatchToProps
 )(DashboardGridComponent);
 
 const componentList = {
-  ProductionDollars: {
+    ProductionDollars: {
-    label: i18next.t("dashboard.titles.productiondollars"),
+        label: i18next.t("dashboard.titles.productiondollars"),
-    component: DashboardTotalProductionDollars,
+        component: DashboardTotalProductionDollars,
-    gqlFragment: null,
+        gqlFragment: null,
-    w: 1,
+        w: 1,
-    h: 1,
+        h: 1,
-    minW: 2,
+        minW: 2,
-    minH: 1,
+        minH: 1,
-  },
+    },
-  ProductionHours: {
+    ProductionHours: {
-    label: i18next.t("dashboard.titles.productionhours"),
+        label: i18next.t("dashboard.titles.productionhours"),
-    component: DashboardTotalProductionHours,
+        component: DashboardTotalProductionHours,
-    gqlFragment: DashboardTotalProductionHoursGql,
+        gqlFragment: DashboardTotalProductionHoursGql,
-    w: 3,
+        w: 3,
-    h: 1,
+        h: 1,
-    minW: 3,
+        minW: 3,
-    minH: 1,
+        minH: 1,
-  },
+    },
-  ProjectedMonthlySales: {
+    ProjectedMonthlySales: {
-    label: i18next.t("dashboard.titles.projectedmonthlysales"),
+        label: i18next.t("dashboard.titles.projectedmonthlysales"),
-    component: DashboardProjectedMonthlySales,
+        component: DashboardProjectedMonthlySales,
-    gqlFragment: DashboardProjectedMonthlySalesGql,
+        gqlFragment: DashboardProjectedMonthlySalesGql,
-    w: 2,
+        w: 2,
-    h: 1,
+        h: 1,
-    minW: 2,
+        minW: 2,
-    minH: 1,
+        minH: 1,
-  },
+    },
-  MonthlyRevenueGraph: {
+    MonthlyRevenueGraph: {
-    label: i18next.t("dashboard.titles.monthlyrevenuegraph"),
+        label: i18next.t("dashboard.titles.monthlyrevenuegraph"),
-    component: DashboardMonthlyRevenueGraph,
+        component: DashboardMonthlyRevenueGraph,
-    gqlFragment: DashboardMonthlyRevenueGraphGql,
+        gqlFragment: DashboardMonthlyRevenueGraphGql,
-    w: 4,
+        w: 4,
-    h: 2,
+        h: 2,
-    minW: 4,
+        minW: 4,
-    minH: 2,
+        minH: 2,
-  },
+    },
-  MonthlyJobCosting: {
+    MonthlyJobCosting: {
-    label: i18next.t("dashboard.titles.monthlyjobcosting"),
+        label: i18next.t("dashboard.titles.monthlyjobcosting"),
-    component: DashboardMonthlyJobCosting,
+        component: DashboardMonthlyJobCosting,
-    gqlFragment: null,
+        gqlFragment: null,
-    minW: 6,
+        minW: 6,
-    minH: 3,
+        minH: 3,
-    w: 6,
+        w: 6,
-    h: 3,
+        h: 3,
-  },
+    },
-  MonthlyPartsSales: {
+    MonthlyPartsSales: {
-    label: i18next.t("dashboard.titles.monthlypartssales"),
+        label: i18next.t("dashboard.titles.monthlypartssales"),
-    component: DashboardMonthlyPartsSales,
+        component: DashboardMonthlyPartsSales,
-    gqlFragment: null,
+        gqlFragment: null,
-    minW: 2,
+        minW: 2,
-    minH: 2,
+        minH: 2,
-    w: 2,
+        w: 2,
-    h: 2,
+        h: 2,
-  },
+    },
-  MonthlyLaborSales: {
+    MonthlyLaborSales: {
-    label: i18next.t("dashboard.titles.monthlylaborsales"),
+        label: i18next.t("dashboard.titles.monthlylaborsales"),
-    component: DashboardMonthlyLaborSales,
+        component: DashboardMonthlyLaborSales,
-    gqlFragment: null,
+        gqlFragment: null,
-    minW: 2,
+        minW: 2,
-    minH: 2,
+        minH: 2,
-    w: 2,
+        w: 2,
-    h: 2,
+        h: 2,
-  },
+    },
-  MonthlyEmployeeEfficency: {
+    // Typo in Efficency should be Efficiency, but changing it would reset users dashboard settings
-    label: i18next.t("dashboard.titles.monthlyemployeeefficiency"),
+    MonthlyEmployeeEfficency: {
-    component: DashboardMonthlyEmployeeEfficiency,
+        label: i18next.t("dashboard.titles.monthlyemployeeefficiency"),
-    gqlFragment: DashboardMonthlyEmployeeEfficiencyGql,
+        component: DashboardMonthlyEmployeeEfficiency,
-    minW: 2,
+        gqlFragment: DashboardMonthlyEmployeeEfficiencyGql,
-    minH: 2,
+        minW: 2,
-    w: 2,
+        minH: 2,
-    h: 2,
+        w: 2,
-  },
+        h: 2,
-  ScheduleInToday: {
+    },
-    label: i18next.t("dashboard.titles.scheduledintoday"),
+    ScheduleInToday: {
-    component: DashboardScheduledInToday,
+        label: i18next.t("dashboard.titles.scheduledintoday"),
-    gqlFragment: DashboardScheduledInTodayGql,
+        component: DashboardScheduledInToday,
-    minW: 6,
+        gqlFragment: DashboardScheduledInTodayGql,
-    minH: 2,
+        minW: 6,
-    w: 10,
+        minH: 2,
-    h: 3,
+        w: 10,
-  },
+        h: 3,
-  ScheduleOutToday: {
+    },
-    label: i18next.t("dashboard.titles.scheduledouttoday"),
+    ScheduleOutToday: {
-    component: DashboardScheduledOutToday,
+        label: i18next.t("dashboard.titles.scheduledouttoday"),
-    gqlFragment: DashboardScheduledOutTodayGql,
+        component: DashboardScheduledOutToday,
-    minW: 6,
+        gqlFragment: DashboardScheduledOutTodayGql,
-    minH: 2,
+        minW: 6,
-    w: 10,
+        minH: 2,
-    h: 3,
+        w: 10,
-  },
+        h: 3,
+    },
+    JobLifecycle: {
+        label: i18next.t("dashboard.titles.joblifecycle"),
+        component: JobLifecycleDashboardComponent,
+        gqlFragment: JobLifecycleDashboardGQL,
+        minW: 6,
+        minH: 3,
+        w: 6,
+        h: 3,
+    },
 };
 
 const createDashboardQuery = (state) => {
-  const componentBasedAdditions =
+    const componentBasedAdditions =
-    state &&
+        state &&
-    Array.isArray(state.layout) &&
+        Array.isArray(state.layout) &&
-    state.layout
+        state.layout
-      .map((item, index) => componentList[item.i].gqlFragment || "")
+            .map((item, index) => componentList[item.i].gqlFragment || "")
-      .join("");
+            .join("");
-  return gql`
+    return gql`
-    query QUERY_DASHBOARD_DETAILS { ${componentBasedAdditions || ""} 
+        query QUERY_DASHBOARD_DETAILS { ${componentBasedAdditions || ""}
-      monthly_sales: jobs(where: {_and: [
+            monthly_sales: jobs(where: {_and: [
-        { voided: {_eq: false}},
+                { voided: {_eq: false}},
-        {date_invoiced: {_gte: "${moment()
+                {date_invoiced: {_gte: "${moment()
           .startOf("month")
-          .startOf("day")
+                .startOf("day")
-          .toISOString()}"}}, {date_invoiced: {_lte: "${moment()
+                .toISOString()}"}}, {date_invoiced: {_lte: "${moment()
     .endOf("month")
     .endOf("day")
     .toISOString()}"}}]}) {
       id
-      ro_number
+                ro_number
-      date_invoiced
+                date_invoiced
-      job_totals
+                job_totals
-      rate_la1
+                rate_la1
-      rate_la2
+                rate_la2
-      rate_la3
+                rate_la3
-      rate_la4
+                rate_la4
-      rate_laa
+                rate_laa
-      rate_lab
+                rate_lab
-      rate_lad
+                rate_lad
-      rate_lae
+                rate_lae
-      rate_laf
+                rate_laf
-      rate_lag
+                rate_lag
-      rate_lam
+                rate_lam
-      rate_lar
+                rate_lar
-      rate_las
+                rate_las
-      rate_lau
+                rate_lau
-      rate_ma2s
+                rate_ma2s
-      rate_ma2t
+                rate_ma2t
-      rate_ma3s
+                rate_ma3s
-      rate_mabl
+                rate_mabl
-      rate_macs
+                rate_macs
-      rate_mahw
+                rate_mahw
-      rate_mapa
+                rate_mapa
-      rate_mash
+                rate_mash
-      rate_matd
+                rate_matd
-      joblines(where: { removed: { _eq: false } }) {
+                joblines(where: { removed: { _eq: false } }) {
-        id
+                    id
-        mod_lbr_ty
+                    mod_lbr_ty
-        mod_lb_hrs
+                    mod_lb_hrs
-        act_price
+                    act_price
-        part_qty
+                    part_qty
-        part_type
+                    part_type
-      }
+                }
-    }
+                }
-    production_jobs: jobs(where: { inproduction: { _eq: true } }) {
+                production_jobs: jobs(where: { inproduction: { _eq: true } }) {
-      id
+                    id
-      ro_number
+                    ro_number
-      ins_co_nm
+                    ins_co_nm
-      job_totals
+                    job_totals
-      joblines(where: { removed: { _eq: false } }) {
+                    joblines(where: { removed: { _eq: false } }) {
-        id
+                    id
-        mod_lbr_ty
+                    mod_lbr_ty
-        mod_lb_hrs
+                    mod_lb_hrs
-        act_price
+                    act_price
-        part_qty
+                    part_qty
-        part_type
+                    part_type
-      }
+                }
-      labhrs: joblines_aggregate(where: { mod_lbr_ty: { _neq: "LAR" }, removed: { _eq: false } }) {
+                labhrs: joblines_aggregate(where: { mod_lbr_ty: { _neq: "LAR" }, removed: { _eq: false } }) {
-        aggregate {
+                    aggregate {
-          sum {
+                        sum {
-            mod_lb_hrs
+                            mod_lb_hrs
-          }
+                        }
-        }
+                    }
-      }
+                }
-      larhrs: joblines_aggregate(where: { mod_lbr_ty: { _eq: "LAR" }, removed: { _eq: false } }) {
+                larhrs: joblines_aggregate(where: { mod_lbr_ty: { _eq: "LAR" }, removed: { _eq: false } }) {
-        aggregate {
+                    aggregate {
-          sum {
+                        sum {
-            mod_lb_hrs
+                            mod_lb_hrs
-          }
+                        }
-        }
+                    }
-      }
+                }
-    }
+                }
-  }`;
+            }`;
 };

client/src/components/job-detail-cards/job-detail-cards.totals.component.jsx

@@ -18,10 +18,8 @@ export default function JobDetailCardsTotalsComponent({ loading, data }) {
           />
           <Statistic
             className="imex-flex-row__margin-large"
-            title={t("jobs.fields.ded_amt")}
+            title={t("jobs.fields.customerowing")}
-            value={Dinero({
+            value={Dinero(data.job_totals.totals.custPayable.total).toFormat()}
-              amount: Math.round((data.ded_amt || 0) * 100),
-            }).toFormat()}
           />
           <Statistic
             className="imex-flex-row__margin-large"

client/src/components/job-employee-assignments/job-employee-assignments.component.jsx

@@ -23,7 +23,6 @@ export function JobEmployeeAssignments({
   jobRO,
   body,
   refinish,
-
   prep,
   csr,
   handleAdd,
@@ -78,7 +77,7 @@ export function JobEmployeeAssignments({
               setVisibility(false);
             }}
           >
-            Assign
+            {t("allocations.actions.assign")}
           </Button>
           <Button onClick={() => setVisibility(false)}>Close</Button>
         </Space>

client/src/components/job-employee-assignments/job-employee-assignments.container.jsx

@@ -43,13 +43,13 @@ export function JobEmployeeAssignmentsContainer({
     });
     if (refetch) refetch();
 
-    insertAuditTrail({
+    if (!!!result.errors) {
-      jobid: job.id,
+      insertAuditTrail({
-      operation: AuditTrailMapping.jobassignmentchange(operation, name),
+        jobid: job.id,
-      type: "jobassignmentchange",
+        operation: AuditTrailMapping.jobassignmentchange(operation, name),
-    });
+        type: "jobassignmentchange",
-
+      });
-    if (!!result.errors) {
+    } else {
       notification["error"]({
         message: t("jobs.errors.assigning", {
           message: JSON.stringify(result.errors),
@@ -67,18 +67,19 @@ export function JobEmployeeAssignmentsContainer({
       variables: { jobId: job.id, job: { [empAssignment]: null } },
     });
 
-    if (!!result.errors) {
+    if (!!!result.errors) {
+      insertAuditTrail({
+        jobid: job.id,
+        operation: AuditTrailMapping.jobassignmentremoved(operation),
+        type: "jobassignmentremoved",
+      });
+    } else {
       notification["error"]({
         message: t("jobs.errors.assigning", {
           message: JSON.stringify(result.errors),
         }),
       });
     }
-    insertAuditTrail({
-      jobid: job.id,
-      operation: AuditTrailMapping.jobassignmentremoved(operation),
-      type: "jobassignmentremoved",
-    });
     setLoading(false);
   };
 

client/src/components/job-reconciliation-bills-table/job-reconciliation-bills-table.component.jsx

@@ -82,7 +82,7 @@ export default function JobReconciliationBillsTable({
         state.sortedInfo.order,
 
       render: (text, record) => (
-        <Checkbox disabled checked={record.bill.is_credit_memo} />
+        <Checkbox checked={record.bill.is_credit_memo} />
       ),
     },
   ];

client/src/components/jobs-create-jobs-info/jobs-create-jobs-info.component.jsx

@@ -1,4 +1,12 @@
-import { Collapse, Form, Input, InputNumber, Select, Switch } from "antd";
+import {
+  Collapse,
+  Form,
+  Input,
+  InputNumber,
+  Select,
+  Space,
+  Switch,
+} from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -10,6 +18,8 @@ import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import FormItemPhone, {
   PhoneItemFormatterValidation,
 } from "../form-items-formatted/phone-form-item.component";
+import JobsDetailChangeEstimator from "../jobs-detail-change-estimator/jobs-detail-change-estimator.component";
+import JobsDetailChangeFilehandler from "../jobs-detail-change-filehandler/jobs-detail-change-filehandler.component";
 import JobsDetailRatesChangeButton from "../jobs-detail-rates-change-button/jobs-detail-rates-change-button.component";
 import JobsDetailRatesParts from "../jobs-detail-rates/jobs-detail-rates.parts.component";
 import JobsMarkPstExempt from "../jobs-mark-pst-exempt/jobs-mark-pst-exempt.component";
@@ -25,6 +35,15 @@ const mapDispatchToProps = (dispatch) => ({
 export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
   const { t } = useTranslation();
   const { getFieldValue } = form;
+
+  const handleInsCoChange = (value) => {
+    const selectedCompany = bodyshop.md_ins_cos.find((s) => s.name === value);
+    if (selectedCompany) {
+      form.setFieldValue("ins_addr1", selectedCompany.street1);
+      form.setFieldValue("ins_city", selectedCompany.city);
+    }
+  };
+
   return (
     <div>
       <Collapse defaultActiveKey="insurance">
@@ -34,26 +53,20 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
           forceRender
         >
           <LayoutFormRow>
-            <Form.Item label={t("jobs.fields.ins_co_id")} name="ins_co_id">
+            <Form.Item label={t("jobs.fields.clm_no")} name="clm_no">
               <Input />
             </Form.Item>
             <Form.Item label={t("jobs.fields.policy_no")} name="policy_no">
               <Input />
             </Form.Item>
-            <Form.Item label={t("jobs.fields.clm_no")} name="clm_no">
-              <Input />
-            </Form.Item>
             <Form.Item
               label={t("jobs.fields.regie_number")}
               name="regie_number"
             >
               <Input />
             </Form.Item>
-            <Form.Item label={t("jobs.fields.loss_date")} name="loss_date">
-              <FormDatePicker />
-            </Form.Item>
             <Form.Item label={t("jobs.fields.ins_co_nm")} name="ins_co_nm">
-              <Select>
+              <Select onChange={handleInsCoChange}>
                 {bodyshop.md_ins_cos.map((s) => (
                   <Select.Option key={s.name} value={s.name}>
                     {s.name}
@@ -67,7 +80,15 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
             <Form.Item label={t("jobs.fields.ins_city")} name="ins_city">
               <Input />
             </Form.Item>
-            <Form.Item label={t("jobs.fields.ins_ct_ln")} name="ins_ct_ln">
+            <Form.Item
+              label={
+                <Space>
+                  {t("jobs.fields.ins_ct_ln")}
+                  <JobsDetailChangeFilehandler form={form} />
+                </Space>
+              }
+              name="ins_ct_ln"
+            >
               <Input />
             </Form.Item>
             <Form.Item label={t("jobs.fields.ins_ct_fn")} name="ins_ct_fn">
@@ -95,11 +116,24 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
             >
               <FormItemEmail email={getFieldValue("ins_ea")} />
             </Form.Item>
-
+            <Form.Item label={t("jobs.fields.loss_date")} name="loss_date">
+              <FormDatePicker />
+            </Form.Item>
+            <Form.Item label={t("jobs.fields.kmin")} name="kmin">
+              <Input />
+            </Form.Item>
             <Form.Item label={t("jobs.fields.est_co_nm")} name="est_co_nm">
               <Input />
             </Form.Item>
-            <Form.Item label={t("jobs.fields.est_ct_fn")} name="est_ct_fn">
+            <Form.Item
+              label={
+                <Space>
+                  {t("jobs.fields.est_ct_fn")}
+                  <JobsDetailChangeEstimator form={form} />
+                </Space>
+              }
+              name="est_ct_fn"
+            >
               <Input />
             </Form.Item>
             <Form.Item label={t("jobs.fields.est_ct_ln")} name="est_ct_ln">

client/src/components/jobs-detail-general/jobs-detail-general.component.jsx

@@ -37,6 +37,15 @@ const lossColDamage = { sm: { span: 24 }, md: { span: 6 }, lg: { span: 4 } };
 export function JobsDetailGeneral({ bodyshop, jobRO, job, form }) {
   const { getFieldValue } = form;
   const { t } = useTranslation();
+
+  const handleInsCoChange = (value) => {
+    const selectedCompany = bodyshop.md_ins_cos.find((s) => s.name === value);
+    if (selectedCompany) {
+      form.setFieldValue("ins_addr1", selectedCompany.street1);
+      form.setFieldValue("ins_city", selectedCompany.city);
+    }
+  };
+
   return (
     <div>
       <FormRow header={t("jobs.forms.claiminfo")}>
@@ -71,7 +80,7 @@ export function JobsDetailGeneral({ bodyshop, jobRO, job, form }) {
         </Form.Item>
 
         <Form.Item label={t("jobs.fields.ins_co_nm")} name="ins_co_nm">
-          <Select disabled={jobRO}>
+          <Select disabled={jobRO} onChange={handleInsCoChange}>
             {bodyshop.md_ins_cos.map((s) => (
               <Select.Option key={s.name} value={s.name}>
                 {s.name}

client/src/components/jobs-detail-header/jobs-detail-header.component.jsx

@@ -4,7 +4,8 @@ import {
   PauseCircleOutlined,
   WarningFilled,
 } from "@ant-design/icons";
-import { Card, Col, Row, Space, Tag, Tooltip } from "antd";
+import { Card, Col, Divider, Row, Space, Tag, Tooltip } from "antd";
+import moment from "moment";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -62,6 +63,13 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
   ${job.v_make_desc || ""} 
   ${job.v_model_desc || ""}`.trim();
 
+  const bodyHrs = job.joblines
+    .filter((j) => j.mod_lbr_ty !== "LAR")
+    .reduce((acc, val) => acc + val.mod_lb_hrs, 0);
+  const refinishHrs = job.joblines
+    .filter((line) => line.mod_lbr_ty === "LAR")
+    .reduce((acc, val) => acc + val.mod_lb_hrs, 0);
+
   const ownerTitle = OwnerNameDisplayFunction(job).trim();
 
   return (
@@ -93,7 +101,13 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
                 {job.status === bodyshop.md_ro_statuses.default_scheduled &&
                 job.scheduled_in ? (
                   <Tag>
-                    <DateTimeFormatter>{job.scheduled_in}</DateTimeFormatter>
+                    <Link
+                      to={`/manage/schedule?date=${moment(
+                        job.scheduled_in
+                      ).format("YYYY-MM-DD")}`}
+                    >
+                      <DateTimeFormatter>{job.scheduled_in}</DateTimeFormatter>
+                    </Link>
                   </Tag>
                 ) : null}
               </Space>
@@ -211,6 +225,12 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
                 {job.owner?.tax_number || ""}
               </DataLabel>
             )}
+            <DataLabel
+              label={t("owners.fields.note")}
+              valueStyle={{ overflow: "hidden", textOverflow: "ellipsis" }}
+            >
+              {job.owner?.note || ""}
+            </DataLabel>
           </div>
         </Card>
       </Col>
@@ -299,6 +319,11 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
         >
           <div>
             <JobEmployeeAssignments job={job} />
+            <Divider style={{ margin: ".5rem" }} />
+            <DataLabel label={t("jobs.labels.labor_hrs")}>
+              {bodyHrs.toFixed(1)} / {refinishHrs.toFixed(1)} /{" "}
+              {(bodyHrs + refinishHrs).toFixed(1)}
+            </DataLabel>
           </div>
         </Card>
       </Col>

client/src/components/owner-detail-jobs/owner-detail-jobs.component.jsx

@@ -24,7 +24,7 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) {
   const handleTableChange = (pagination, filters, sorter) => {
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
-  
+
   const columns = [
     {
       title: t("jobs.fields.ro_number"),
@@ -44,6 +44,15 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) {
       title: t("jobs.fields.vehicle"),
       dataIndex: "vehicleid",
       key: "vehicleid",
+      sorter: (a, b) =>
+        alphaSort(
+          `${a.v_model_yr || ""} ${a.v_make_desc || ""} ${
+            a.v_model_desc || ""
+          }`,
+          `${b.v_model_yr || ""} ${b.v_make_desc || ""} ${b.v_model_desc || ""}`
+        ),
+      sortOrder:
+        state.sortedInfo.columnKey === "vehicleid" && state.sortedInfo.order,
       render: (text, record) =>
         record.vehicleid ? (
           <Link to={`/manage/vehicles/${record.vehicleid}`}>
@@ -67,9 +76,15 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) {
       title: t("jobs.fields.status"),
       dataIndex: "status",
       key: "status",
-      sorter: (a, b) => statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses),
+      sorter: (a, b) =>
+        statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses),
       sortOrder:
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
+      filters: bodyshop.md_ro_statuses.statuses.map((status) => ({
+        text: status,
+        value: status,
+      })),
+      onFilter: (value, record) => value.includes(record.status),
     },
 
     {

client/src/components/parts-queue-list/parts-queue.list.component.jsx

@@ -95,15 +95,13 @@ export function PartsQueueListComponent({ bodyshop }) {
   };
 
   const handleOnRowClick = (record) => {
-    if (record) {
+    if (record?.id) {
-      if (record.id) {
+      history.replace({
-        history.push({
+        search: queryString.stringify({
-          search: queryString.stringify({
+          ...searchParams,
-            ...searchParams,
+          selected: record.id,
-            selected: record.id,
+        }),
-          }),
+      });
-        });
-      }
     }
   };
 
@@ -350,6 +348,13 @@ export function PartsQueueListComponent({ bodyshop }) {
           selectedRowKeys: [selected],
           type: "radio",
         }}
+        onRow={(record, rowIndex) => {
+          return {
+            onClick: (event) => {
+              handleOnRowClick(record);
+            },
+          };
+        }}
       />
     </Card>
   );

client/src/components/payment-mark-export-button/payment-mark-export-button-component.jsx

@@ -1,13 +1,13 @@
-import React from "react";
-import { Button, notification } from "antd";
 import { useMutation } from "@apollo/client";
+import { Button, notification } from "antd";
+import React from "react";
 import { useTranslation } from "react-i18next";
-import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
-import { setModalContext } from "../../redux/modals/modals.actions";
 import { connect } from "react-redux";
-import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
-import { selectCurrentUser } from "../../redux/user/user.selectors";
 import { createStructuredSelector } from "reselect";
+import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
+import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { selectCurrentUser } from "../../redux/user/user.selectors";
 
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
@@ -46,7 +46,6 @@ const PaymentMarkForExportButton = ({
         ],
       },
     });
-
     const paymentUpdateResponse = await updatePayment({
       variables: {
         paymentId: payment.id,
@@ -55,16 +54,12 @@ const PaymentMarkForExportButton = ({
         },
       },
     });
-
     if (!!!paymentUpdateResponse.errors) {
       notification.open({
         type: "success",
         key: "paymentsuccessmarkforexport",
         message: t("payments.successes.markexported"),
       });
-
-      if (refetch) refetch();
-
       setPaymentContext({
         actions: {
           refetch,
@@ -74,6 +69,12 @@ const PaymentMarkForExportButton = ({
           exportedat: today,
         },
       });
+
+      if (refetch)
+        refetch(
+          paymentUpdateResponse &&
+            paymentUpdateResponse.data.update_payments.returning[0]
+        );
     } else {
       notification["error"]({
         message: t("payments.errors.exporting", {

client/src/components/payment-modal/payment-modal.container.jsx

@@ -1,5 +1,4 @@
 import { useMutation } from "@apollo/client";
-
 import { Button, Form, Modal, notification, Space } from "antd";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -19,8 +18,8 @@ import {
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 import PaymentForm from "../payment-form/payment-form.component";
-import PaymentReexportButton from "../payment-reexport-button/payment-reexport-button.component";
 import PaymentMarkForExportButton from "../payment-mark-export-button/payment-mark-export-button-component";
+import PaymentReexportButton from "../payment-reexport-button/payment-reexport-button.component";
 
 const mapStateToProps = createStructuredSelector({
   paymentModal: selectPayment,
@@ -159,7 +158,7 @@ function PaymentModalContainer({
       }}
       afterClose={() => form.resetFields()}
       footer={
-        <span>
+        <Space>
           <Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
           <Button loading={loading} onClick={() => form.submit()}>
             {t("general.actions.save")}
@@ -175,7 +174,7 @@ function PaymentModalContainer({
               {t("general.actions.saveandnew")}
             </Button>
           )}
-        </span>
+        </Space>
       }
     >
       {!context || (context && !context.id) ? null : (
@@ -194,7 +193,6 @@ function PaymentModalContainer({
         autoComplete={"off"}
         form={form}
         layout="vertical"
-        initialValues={context || {}}
         disabled={context?.exportedat}
       >
         <PaymentForm form={form} />

client/src/components/payment-reexport-button/payment-reexport-button.component.jsx

@@ -1,10 +1,10 @@
-import React from "react";
-import { Button, notification } from "antd";
-import { useTranslation } from "react-i18next";
-import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
 import { useMutation } from "@apollo/client";
-import { setModalContext } from "../../redux/modals/modals.actions";
+import { Button, notification } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
+import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
+import { setModalContext } from "../../redux/modals/modals.actions";
 
 const mapDispatchToProps = (dispatch) => ({
   setPaymentContext: (context) =>
@@ -24,16 +24,12 @@ const PaymentReexportButton = ({ payment, refetch, setPaymentContext }) => {
         },
       },
     });
-
     if (!!!paymentUpdateResponse.errors) {
       notification.open({
         type: "success",
         key: "paymentsuccessexport",
         message: t("payments.successes.markreexported"),
       });
-
-      if (refetch) refetch();
-
       setPaymentContext({
         actions: {
           refetch,
@@ -43,6 +39,11 @@ const PaymentReexportButton = ({ payment, refetch, setPaymentContext }) => {
           exportedat: null,
         },
       });
+      if (refetch)
+        refetch(
+          paymentUpdateResponse &&
+            paymentUpdateResponse.data.update_payments.returning[0]
+        );
     } else {
       notification["error"]({
         message: t("payments.errors.exporting", {

client/src/components/print-center-jobs-labels/print-center-jobs-labels.component.jsx

@@ -6,6 +6,7 @@ import {
   notification,
   Popover,
   Radio,
+  Space,
 } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -115,10 +116,16 @@ export function PrintCenterJobsLabels({ bodyshop, jobId }) {
         >
           <InputNumber min={1} precision={0} max={99} />
         </Form.Item>
-        <Button type="primary" loading={loading} onClick={handleOk}>
+        <div style={{ display: "flex", justifyContent: "flex-end" }}>
-          {t("general.actions.print")}
+          <Space>
-        </Button>
+            <Button type="primary" loading={loading} onClick={handleOk}>
-        <Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
+              {t("general.actions.print")}
+            </Button>
+            <Button onClick={handleCancel}>
+              {t("general.actions.cancel")}
+            </Button>
+          </Space>
+        </div>
       </Form>
     </Card>
   );

client/src/components/production-board-kanban/production-board-kanban.utils.js

@@ -18,8 +18,8 @@ const sortByParentId = (arr) => {
   //console.log("sortByParentId -> byParentsIdsList", byParentsIdsList);
 
   while (byParentsIdsList[parentId]) {
-    sortedList.push(byParentsIdsList[parentId][0]);
+    sortedList.push(...byParentsIdsList[parentId]); //Spread in the whole list in case several items have the same parents. 
-    parentId = byParentsIdsList[parentId][0].id;
+    parentId = byParentsIdsList[parentId][byParentsIdsList[parentId].length -1].id; //Grab the ID from the last one.
   }
 
   if (byParentsIdsList["null"])

client/src/components/production-list-columns/production-list-columns.data.js

@@ -1,7 +1,6 @@
 import { BranchesOutlined, PauseCircleOutlined } from "@ant-design/icons";
 import { Checkbox, Space, Tooltip } from "antd";
 import i18n from "i18next";
-import moment from "moment";
 import { Link } from "react-router-dom";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { TimeFormatter } from "../../utils/DateFormatter";
@@ -190,17 +189,12 @@ const r = ({ technician, state, activeStatuses, data, bodyshop }) => {
         state.sortedInfo.columnKey === "date_next_contact" &&
         state.sortedInfo.order,
       render: (text, record) => (
-        <span
+        <ProductionListDate
-          style={{
+          record={record}
-            color:
+          field="date_next_contact"
-              record.date_next_contact &&
+          pastIndicator
-              moment(record.date_next_contact).isBefore(moment())
+          time
-                ? "red"
+        />
-                : "",
-          }}
-        >
-          <ProductionListDate record={record} field="date_next_contact" time />
-        </span>
       ),
     },
     {
@@ -308,7 +302,7 @@ const r = ({ technician, state, activeStatuses, data, bodyshop }) => {
       onFilter: (value, record) =>
         value.includes(record.special_coverage_policy),
       render: (text, record) => (
-        <Checkbox disabled checked={record.special_coverage_policy} />
+        <Checkbox checked={record.special_coverage_policy} />
       ),
     },
 

client/src/components/shop-info/shop-info.responsibilitycenters.component.jsx

@@ -5,6 +5,7 @@ import {
   Input,
   InputNumber,
   Select,
+  Space,
   Switch,
   Typography,
 } from "antd";
@@ -17,6 +18,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { useTreatments } from "@splitsoftware/splitio-react";
+import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 
 const SelectorDiv = styled.div`
   .ant-form-item .ant-select {
@@ -191,7 +193,7 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
           </LayoutFormRow>
           <LayoutFormRow header={t("bodyshop.labels.dms.cdk.payers")}>
             <Form.List name={["cdk_configuration", "payers"]}>
-              {(fields, { add, remove }) => {
+              {(fields, { add, remove, move }) => {
                 return (
                   <div>
                     {fields.map((field, index) => (
@@ -249,11 +251,18 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
                             </Select>
                           </Form.Item>
 
-                          <DeleteFilled
+                          <Space align="center">
-                            onClick={() => {
+                            <DeleteFilled
-                              remove(field.name);
+                              onClick={() => {
-                            }}
+                                remove(field.name);
-                          />
+                              }}
+                            />
+                            <FormListMoveArrows
+                              move={move}
+                              index={index}
+                              total={fields.length}
+                            />
+                          </Space>
                         </LayoutFormRow>
                       </Form.Item>
                     ))}
@@ -345,7 +354,7 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
         id="costs"
       >
         <Form.List name={["md_responsibility_centers", "costs"]}>
-          {(fields, { add, remove }) => {
+          {(fields, { add, remove, move }) => {
             return (
               <div>
                 {fields.map((field, index) => (
@@ -462,12 +471,18 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
                           <Input onBlur={handleBlur} />
                         </Form.Item>
                       )}
-
+                      <Space align="center">
-                      <DeleteFilled
+                        <DeleteFilled
-                        onClick={() => {
+                          onClick={() => {
-                          remove(field.name);
+                            remove(field.name);
-                        }}
+                          }}
-                      />
+                        />
+                        <FormListMoveArrows
+                          move={move}
+                          index={index}
+                          total={fields.length}
+                        />
+                      </Space>
                     </LayoutFormRow>
                   </Form.Item>
                 ))}
@@ -493,7 +508,7 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
         id="profits"
       >
         <Form.List name={["md_responsibility_centers", "profits"]}>
-          {(fields, { add, remove }) => {
+          {(fields, { add, remove, move }) => {
             return (
               <div>
                 {fields.map((field, index) => (
@@ -595,11 +610,18 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
                           <Input onBlur={handleBlur} />
                         </Form.Item>
                       )}
-                      <DeleteFilled
+                      <Space align="center">
-                        onClick={() => {
+                        <DeleteFilled
-                          remove(field.name);
+                          onClick={() => {
-                        }}
+                            remove(field.name);
-                      />
+                          }}
+                        />
+                        <FormListMoveArrows
+                          move={move}
+                          index={index}
+                          total={fields.length}
+                        />
+                      </Space>
                     </LayoutFormRow>
                   </Form.Item>
                 ))}

client/src/components/shop-info/shop-info.rostatus.component.jsx

@@ -39,8 +39,23 @@ export function ShopInfoROStatusComponent({ bodyshop, form }) {
     form.getFieldValue(["md_ro_statuses", "statuses"]) || []
   );
 
+  const [productionStatus, setProductionStatus] = useState(
+    (
+      form.getFieldValue(["md_ro_statuses", "production_statuses"]) || []
+    ).concat(
+      form.getFieldValue(["md_ro_statuses", "additional_board_statuses"]) || []
+    ) || []
+  );
+
   const handleBlur = () => {
     setOptions(form.getFieldValue(["md_ro_statuses", "statuses"]));
+    setProductionStatus(
+      form
+        .getFieldValue(["md_ro_statuses", "production_statuses"])
+        .concat(
+          form.getFieldValue(["md_ro_statuses", "additional_board_statuses"])
+        )
+    );
   };
 
   return (
@@ -346,7 +361,7 @@ export function ShopInfoROStatusComponent({ bodyshop, form }) {
                               ]}
                             >
                               <Select>
-                                {options.map((item, idx) => (
+                                {productionStatus.map((item, idx) => (
                                   <Select.Option key={idx} value={item}>
                                     {item}
                                   </Select.Option>

client/src/components/vehicle-detail-jobs/vehicle-detail-jobs.component.jsx

@@ -7,7 +7,9 @@ import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { alphaSort, statusSort } from "../../utils/sorters";
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import OwnerNameDisplay, {
+  OwnerNameDisplayFunction,
+} from "../owner-name-display/owner-name-display.component";
 import VehicleDetailUpdateJobsComponent from "../vehicle-detail-update-jobs/vehicle-detail-update-jobs.component";
 
 const mapStateToProps = createStructuredSelector({
@@ -45,6 +47,10 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) {
       title: t("jobs.fields.owner"),
       dataIndex: "owner",
       key: "owner",
+      sorter: (a, b) =>
+        alphaSort(OwnerNameDisplayFunction(a), OwnerNameDisplayFunction(b)),
+      sortOrder:
+        state.sortedInfo.columnKey === "owner" && state.sortedInfo.order,
       render: (text, record) => (
         <Link to={`/manage/owners/${record.owner.id}`}>
           <OwnerNameDisplay ownerObject={record} />
@@ -63,9 +69,15 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) {
       title: t("jobs.fields.status"),
       dataIndex: "status",
       key: "status",
-      sorter: (a, b) => statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses),
+      sorter: (a, b) =>
+        statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses),
       sortOrder:
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
+      filters: bodyshop.md_ro_statuses.statuses.map((status) => ({
+        text: status,
+        value: status,
+      })),
+      onFilter: (value, record) => value.includes(record.status),
     },
 
     {

client/src/components/vehicles-list/vehicles-list.component.jsx

@@ -4,8 +4,9 @@ import queryString from "query-string";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
+import { pageLimit } from "../../utils/config";
 import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
-import {pageLimit} from "../../utils/config";
+import { alphaSort } from './../../utils/sorters';
 export default function VehiclesListComponent({
   loading,
   vehicles,
@@ -31,6 +32,8 @@ export default function VehiclesListComponent({
       title: t("vehicles.fields.v_vin"),
       dataIndex: "v_vin",
       key: "v_vin",
+      sorter: (a, b) => alphaSort(a.v_vin, b.v_vin),
+      sortOrder: state.sortedInfo.columnKey === "v_vin" && state.sortedInfo.order,
       render: (text, record) => (
         <Link to={"/manage/vehicles/" + record.id}>
           <VehicleVinDisplay>{record.v_vin || "N/A"}</VehicleVinDisplay>
@@ -51,8 +54,10 @@ export default function VehiclesListComponent({
     },
     {
       title: t("vehicles.fields.plate_no"),
-      dataIndex: "plate",
+      dataIndex: "plate_no",
-      key: "plate",
+      key: "plate_no",
+      sorter: (a, b) => alphaSort(a.plate_no, b.plate_no),
+      sortOrder: state.sortedInfo.columnKey === "plate_no" && state.sortedInfo.order,
       render: (text, record) => {
         return (
           <span>{`${record.plate_st || ""} | ${record.plate_no || ""}`}</span>

client/src/graphql/jobs.queries.js

@@ -704,6 +704,7 @@ export const GET_JOB_BY_PK = gql`
       other_amount_payable
       owner {
         id
+        note
         ownr_fn
         ownr_ln
         ownr_co_nm

client/src/graphql/vehicles.queries.js

@@ -31,6 +31,7 @@ export const QUERY_VEHICLE_BY_ID = gql`
       jobs(order_by: { date_open: desc }) {
         id
         ro_number
+        ownr_co_nm
         ownr_fn
         ownr_ln
         owner {

client/src/pages/bills/bills.page.component.jsx

@@ -13,8 +13,8 @@ import { setModalContext } from "../../redux/modals/modals.actions";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter } from "../../utils/DateFormatter";
 import { TemplateList } from "../../utils/TemplateConstants";
+import { pageLimit } from "../../utils/config";
 import { alphaSort, dateSort } from "../../utils/sorters";
-import {pageLimit} from "../../utils/config";
 
 const mapDispatchToProps = (dispatch) => ({
   setPartsOrderContext: (context) =>
@@ -125,9 +125,7 @@ export function BillsListPage({
       sortOrder:
         state.sortedInfo.columnKey === "is_credit_memo" &&
         state.sortedInfo.order,
-      render: (text, record) => (
+      render: (text, record) => <Checkbox checked={record.is_credit_memo} />,
-        <Checkbox disabled checked={record.is_credit_memo} />
-      ),
     },
     {
       title: t("bills.fields.exported"),
@@ -136,7 +134,7 @@ export function BillsListPage({
       sorter: (a, b) => a.exported - b.exported,
       sortOrder:
         state.sortedInfo.columnKey === "exported" && state.sortedInfo.order,
-      render: (text, record) => <Checkbox disabled checked={record.exported} />,
+      render: (text, record) => <Checkbox checked={record.exported} />,
     },
     {
       title: t("general.labels.actions"),

client/src/pages/export-logs/export-logs.page.component.jsx

@@ -167,9 +167,7 @@ export function ExportLogsPageComponent({ bodyshop }) {
         { text: "False", value: false },
       ],
       onFilter: (value, record) => record.successful === value,
-      render: (text, record) => (
+      render: (text, record) => <Checkbox checked={record.successful} />,
-        <Checkbox disabled checked={record.successful} />
-      ),
     },
     {
       title: t("general.labels.message"),

client/src/translations/en_us/common.json

@@ -259,6 +259,7 @@
 				"saving": "Error encountered while saving. {{message}}"
 			},
 			"fields": {
+				"ReceivableCustomField": "QBO Receivable Custom Field {{number}}",
 				"address1": "Address 1",
 				"address2": "Address 2",
 				"appt_alt_transport": "Appointment Alternative Transportation Options",
@@ -477,7 +478,6 @@
 						"editaccess": "Users -> Edit access"
 					}
 				},
-				"ReceivableCustomField": "QBO Receivable Custom Field {{number}}",
 				"responsibilitycenter": "Responsibility Center",
 				"responsibilitycenter_accountdesc": "Account Description",
 				"responsibilitycenter_accountitem": "Item",
@@ -608,7 +608,7 @@
 				"dms": {
 					"cdk": {
 						"controllist": "Control Number List",
-						"payers": "CDK Payers"
+						"payers": "Payers"
 					},
 					"cdk_dealerid": "CDK Dealer ID",
 					"pbs_serialnumber": "PBS Serial Number",
@@ -844,8 +844,8 @@
 				"notconfigured": "You do not have any current CSI Question Sets configured.",
 				"notfoundsubtitle": "We were unable to find a survey using the link you provided. Please ensure the URL is correct or reach out to your shop for more help.",
 				"notfoundtitle": "No survey found.",
-				"surveycompletetitle": "Survey previously completed",
+				"surveycompletesubtitle": "This survey was already completed on {{date}}.",
-				"surveycompletesubtitle": "This survey was already completed on {{date}}."
+				"surveycompletetitle": "Survey previously completed"
 			},
 			"fields": {
 				"completedon": "Completed On",
@@ -854,13 +854,13 @@
 				"validuntil": "Valid Until"
 			},
 			"labels": {
+				"copyright": "Copyright © $t(titles.app). All Rights Reserved.",
+				"greeting": "Hi {{name}}!",
+				"intro": "At {{shopname}}, we value your feedback. We would love to hear what you have to say. Please fill out the form below.",
 				"nologgedinuser": "Please log out of $t(titles.app)",
 				"nologgedinuser_sub": "Users of $t(titles.app) cannot complete CSI surveys while logged in. Please log out and try again.",
 				"noneselected": "No response selected.",
-				"title": "Customer Satisfaction Survey",
+				"title": "Customer Satisfaction Survey"
-				"greeting": "Hi {{name}}!",
-				"intro": "At {{shopname}}, we value your feedback. We would love to hear what you have to say. Please fill out the form below.",
-				"copyright": "Copyright © $t(titles.app). All Rights Reserved."
 			},
 			"successes": {
 				"created": "CSI created successfully.",
@@ -898,7 +898,8 @@
 				"scheduledindate": "Sheduled In Today: {{date}}",
 				"scheduledintoday": "Sheduled In Today",
 				"scheduledoutdate": "Sheduled Out Today: {{date}}",
-				"scheduledouttoday": "Sheduled Out Today"
+				"scheduledouttoday": "Sheduled Out Today",
+				"joblifecycle": "Job Lifecycle"
 			}
 		},
 		"dms": {
@@ -1113,6 +1114,7 @@
 				"loadingshop": "Loading shop data...",
 				"loggingin": "Authorizing...",
 				"markedexported": "Manually marked as exported.",
+				"media": "Media",
 				"message": "Message",
 				"monday": "Monday",
 				"na": "N/A",
@@ -1236,7 +1238,15 @@
 				"relative_end": "Relative End",
 				"relative_start": "Relative Start",
 				"start": "Start",
-				"value": "Value"
+				"value": "Value",
+				"status": "Status",
+				"percentage": "Percentage",
+				"human_readable": "Human Readable",
+				"status_count": "In Status"
+			},
+			"titles": {
+				"dashboard": "Job Lifecycle",
+				"top_durations": "Top Durations"
 			},
 			"content": {
 				"current_status_accumulated_time": "Current Status Accumulated Time",
@@ -1248,7 +1258,9 @@
 				"title": "Job Lifecycle Component",
 				"title_durations": "Historical Status Durations",
 				"title_loading": "Loading",
-				"title_transitions": "Transitions"
+				"title_transitions": "Transitions",
+				"calculated_based_on": "Calculated based on",
+				"jobs_in_since": "Jobs in since"
 			},
 			"errors": {
 				"fetch": "Error getting Job Lifecycle Data"
@@ -1561,7 +1573,7 @@
 				"federal_tax_payable": "Federal Tax Payable",
 				"federal_tax_rate": "Federal Tax Rate",
 				"ins_addr1": "Insurance Co. Address",
-				"ins_city": "Insurance City",
+				"ins_city": "Insurance Co. City",
 				"ins_co_id": "Insurance Co. ID",
 				"ins_co_nm": "Insurance Company Name",
 				"ins_co_nm_short": "Ins.  Co.",
@@ -1823,6 +1835,7 @@
 				"job": "Job Details",
 				"jobcosting": "Job Costing",
 				"jobtotals": "Job Totals",
+				"labor_hrs": "B/P/T Hrs",
 				"labor_rates_subtotal": "Labor Rates Subtotal",
 				"laborallocations": "Labor Allocations",
 				"labortotals": "Labor Totals",
@@ -2417,6 +2430,7 @@
 				"invoice_total_payable": "Invoice (Total Payable)",
 				"iou_form": "IOU Form",
 				"job_costing_ro": "Job Costing",
+				"job_lifecycle_ro": "Job Lifecycle",
 				"job_notes": "Job Notes",
 				"key_tag": "Key Tag",
 				"labels": {
@@ -2583,17 +2597,17 @@
 			},
 			"labels": {
 				"advanced_filters": "Advanced Filters and Sorters",
-				"advanced_filters_show": "Show",
-				"advanced_filters_hide": "Hide",
-				"advanced_filters_filters": "Filters",
-				"advanced_filters_sorters": "Sorters",
-				"advanced_filters_filter_field": "Field",
-				"advanced_filters_sorter_field": "Field",
-				"advanced_filters_true": "True",
 				"advanced_filters_false": "False",
-				"advanced_filters_sorter_direction": "Direction",
+				"advanced_filters_filter_field": "Field",
 				"advanced_filters_filter_operator": "Operator",
 				"advanced_filters_filter_value": "Value",
+				"advanced_filters_filters": "Filters",
+				"advanced_filters_hide": "Hide",
+				"advanced_filters_show": "Show",
+				"advanced_filters_sorter_direction": "Direction",
+				"advanced_filters_sorter_field": "Field",
+				"advanced_filters_sorters": "Sorters",
+				"advanced_filters_true": "True",
 				"dates": "Dates",
 				"employee": "Employee",
 				"filterson": "Filters on {{object}}: {{field}}",
@@ -2675,6 +2689,8 @@
 				"job_costing_ro_date_summary": "Job Costing by RO - Summary",
 				"job_costing_ro_estimator": "Job Costing by Estimator",
 				"job_costing_ro_ins_co": "Job Costing by RO Source",
+				"job_lifecycle_date_detail": "Job Lifecycle by Date - Detail",
+				"job_lifecycle_date_summary": "Job Lifecycle by Date - Summary",
 				"jobs_completed_not_invoiced": "Jobs Completed not Invoiced",
 				"jobs_invoiced_not_exported": "Jobs Invoiced not Exported",
 				"jobs_reconcile": "Parts/Sublet/Labor Reconciliation",

client/src/translations/es/common.json

@@ -259,6 +259,7 @@
 				"saving": ""
 			},
 			"fields": {
+				"ReceivableCustomField": "",
 				"address1": "",
 				"address2": "",
 				"appt_alt_transport": "",
@@ -477,7 +478,6 @@
 						"editaccess": ""
 					}
 				},
-				"ReceivableCustomField": "",
 				"responsibilitycenter": "",
 				"responsibilitycenter_accountdesc": "",
 				"responsibilitycenter_accountitem": "",
@@ -844,8 +844,8 @@
 				"notconfigured": "",
 				"notfoundsubtitle": "",
 				"notfoundtitle": "",
-				"surveycompletetitle": "",
+				"surveycompletesubtitle": "",
-				"surveycompletesubtitle": ""
+				"surveycompletetitle": ""
 			},
 			"fields": {
 				"completedon": "",
@@ -854,13 +854,13 @@
 				"validuntil": ""
 			},
 			"labels": {
+				"copyright": "",
+				"greeting": "",
+				"intro": "",
 				"nologgedinuser": "",
 				"nologgedinuser_sub": "",
 				"noneselected": "",
-				"title": "",
+				"title": ""
-				"greeting": "",
-				"intro": "",
-				"copyright": ""
 			},
 			"successes": {
 				"created": "",
@@ -898,7 +898,8 @@
 				"scheduledindate": "",
 				"scheduledintoday": "",
 				"scheduledoutdate": "",
-				"scheduledouttoday": ""
+				"scheduledouttoday": "",
+				"joblifecycle": ""
 			}
 		},
 		"dms": {
@@ -1236,7 +1237,15 @@
 				"relative_end": "",
 				"relative_start": "",
 				"start": "",
-				"value": ""
+				"value": "",
+				"status": "",
+				"percentage": "",
+				"human_readable": "",
+				"status_count": ""
+			},
+			"titles": {
+				"dashboard": "",
+				"top_durations": ""
 			},
 			"content": {
 				"current_status_accumulated_time": "",
@@ -1248,7 +1257,9 @@
 				"title": "",
 				"title_durations": "",
 				"title_loading": "",
-				"title_transitions": ""
+				"title_transitions": "",
+				"calculated_based_on": "",
+				"jobs_in_since": ""
 			},
 			"errors": {
 				"fetch": "Error al obtener los datos del ciclo de vida del trabajo"
@@ -1823,6 +1834,7 @@
 				"job": "",
 				"jobcosting": "",
 				"jobtotals": "",
+				"labor_hrs": "",
 				"labor_rates_subtotal": "",
 				"laborallocations": "",
 				"labortotals": "",
@@ -2417,6 +2429,7 @@
 				"invoice_total_payable": "",
 				"iou_form": "",
 				"job_costing_ro": "",
+				"job_lifecycle_ro": "",
 				"job_notes": "",
 				"key_tag": "",
 				"labels": {
@@ -2583,17 +2596,17 @@
 			},
 			"labels": {
 				"advanced_filters": "",
-				"advanced_filters_show": "",
-				"advanced_filters_hide": "",
-				"advanced_filters_filters": "",
-				"advanced_filters_sorters": "",
-				"advanced_filters_filter_field": "",
-				"advanced_filters_sorter_field": "",
-				"advanced_filters_true": "",
 				"advanced_filters_false": "",
-				"advanced_filters_sorter_direction": "",
+				"advanced_filters_filter_field": "",
 				"advanced_filters_filter_operator": "",
 				"advanced_filters_filter_value": "",
+				"advanced_filters_filters": "",
+				"advanced_filters_hide": "",
+				"advanced_filters_show": "",
+				"advanced_filters_sorter_direction": "",
+				"advanced_filters_sorter_field": "",
+				"advanced_filters_sorters": "",
+				"advanced_filters_true": "",
 				"dates": "",
 				"employee": "",
 				"filterson": "",
@@ -2675,6 +2688,8 @@
 				"job_costing_ro_date_summary": "",
 				"job_costing_ro_estimator": "",
 				"job_costing_ro_ins_co": "",
+				"job_lifecycle_date_detail": "",
+				"job_lifecycle_date_summary": "",
 				"jobs_completed_not_invoiced": "",
 				"jobs_invoiced_not_exported": "",
 				"jobs_reconcile": "",

client/src/translations/fr/common.json

@@ -259,6 +259,7 @@
 				"saving": ""
 			},
 			"fields": {
+				"ReceivableCustomField": "",
 				"address1": "",
 				"address2": "",
 				"appt_alt_transport": "",
@@ -477,7 +478,6 @@
 						"editaccess": ""
 					}
 				},
-				"ReceivableCustomField": "",
 				"responsibilitycenter": "",
 				"responsibilitycenter_accountdesc": "",
 				"responsibilitycenter_accountitem": "",
@@ -844,8 +844,8 @@
 				"notconfigured": "",
 				"notfoundsubtitle": "",
 				"notfoundtitle": "",
-				"surveycompletetitle": "",
+				"surveycompletesubtitle": "",
-				"surveycompletesubtitle": ""
+				"surveycompletetitle": ""
 			},
 			"fields": {
 				"completedon": "",
@@ -854,13 +854,13 @@
 				"validuntil": ""
 			},
 			"labels": {
+				"copyright": "",
+				"greeting": "",
+				"intro": "",
 				"nologgedinuser": "",
 				"nologgedinuser_sub": "",
 				"noneselected": "",
-				"title": "",
+				"title": ""
-				"greeting": "",
-				"intro": "",
-				"copyright": ""
 			},
 			"successes": {
 				"created": "",
@@ -1236,7 +1236,15 @@
 				"relative_end": "",
 				"relative_start": "",
 				"start": "",
-				"value": ""
+				"value": "",
+				"status": "",
+				"percentage": "",
+				"human_readable": "",
+				"status_count": ""
+			},
+			"titles": {
+				"dashboard": "",
+				"top_durations": ""
 			},
 			"content": {
 				"current_status_accumulated_time": "",
@@ -1248,7 +1256,10 @@
 				"title": "",
 				"title_durations": "",
 				"title_loading": "",
-				"title_transitions": ""
+				"title_transitions": "",
+				"calculated_based_on": "",
+				"jobs_in_since": "",
+				"joblifecycle": ""
 			},
 			"errors": {
 				"fetch": "Erreur lors de l'obtention des données du cycle de vie des tâches"
@@ -1823,6 +1834,7 @@
 				"job": "",
 				"jobcosting": "",
 				"jobtotals": "",
+				"labor_hrs": "",
 				"labor_rates_subtotal": "",
 				"laborallocations": "",
 				"labortotals": "",
@@ -2417,6 +2429,7 @@
 				"invoice_total_payable": "",
 				"iou_form": "",
 				"job_costing_ro": "",
+				"job_lifecycle_ro": "",
 				"job_notes": "",
 				"key_tag": "",
 				"labels": {
@@ -2583,17 +2596,17 @@
 			},
 			"labels": {
 				"advanced_filters": "",
-				"advanced_filters_show": "",
-				"advanced_filters_hide": "",
-				"advanced_filters_filters": "",
-				"advanced_filters_sorters": "",
-				"advanced_filters_filter_field": "",
-				"advanced_filters_sorter_field": "",
-				"advanced_filters_true": "",
 				"advanced_filters_false": "",
-				"advanced_filters_sorter_direction": "",
+				"advanced_filters_filter_field": "",
 				"advanced_filters_filter_operator": "",
 				"advanced_filters_filter_value": "",
+				"advanced_filters_filters": "",
+				"advanced_filters_hide": "",
+				"advanced_filters_show": "",
+				"advanced_filters_sorter_direction": "",
+				"advanced_filters_sorter_field": "",
+				"advanced_filters_sorters": "",
+				"advanced_filters_true": "",
 				"dates": "",
 				"employee": "",
 				"filterson": "",
@@ -2675,6 +2688,8 @@
 				"job_costing_ro_date_summary": "",
 				"job_costing_ro_estimator": "",
 				"job_costing_ro_ins_co": "",
+				"job_lifecycle_date_detail": "",
+				"job_lifecycle_date_summary": "",
 				"jobs_completed_not_invoiced": "",
 				"jobs_invoiced_not_exported": "",
 				"jobs_reconcile": "",

client/src/utils/TemplateConstants.js

@@ -514,6 +514,14 @@ export const TemplateList = (type, context) => {
             group: "financial",
             dms: true,
           },
+          job_lifecycle_ro: {
+            title: i18n.t("printcenter.jobs.job_lifecycle_ro"),
+            description: "",
+            subject: i18n.t("printcenter.jobs.job_lifecycle_ro"),
+            key: "job_lifecycle_ro",
+            disabled: false,
+            group: "post",
+          },
         }
       : {}),
     ...(!type || type === "job_special"
@@ -2048,6 +2056,30 @@ export const TemplateList = (type, context) => {
             datedisable: true,
             group: "customers",
           },
+          job_lifecycle_date_detail: {
+            title: i18n.t("reportcenter.templates.job_lifecycle_date_detail"),
+            subject: i18n.t("reportcenter.templates.job_lifecycle_date_detail"),
+            key: "job_lifecycle_date_detail",
+            //idtype: "vendor",
+            disabled: false,
+            rangeFilter: {
+              object: i18n.t("reportcenter.labels.objects.jobs"),
+              field: i18n.t("jobs.fields.date_invoiced"),
+            },
+            group: "jobs",
+          },
+          job_lifecycle_date_summary: {
+            title: i18n.t("reportcenter.templates.job_lifecycle_date_summary"),
+            subject: i18n.t("reportcenter.templates.job_lifecycle_date_summary"),
+            key: "job_lifecycle_date_summary",
+            //idtype: "vendor",
+            disabled: false,
+            rangeFilter: {
+              object: i18n.t("reportcenter.labels.objects.jobs"),
+              field: i18n.t("jobs.fields.date_invoiced"),
+            },
+            group: "jobs",
+          },
         }
       : {}),
     ...(!type || type === "courtesycarcontract"

hasura/metadata/tables.yaml

@@ -569,6 +569,13 @@
           table:
             name: parts_orders
             schema: public
+    - name: tasks
+      using:
+        foreign_key_constraint_on:
+          column: billid
+          table:
+            name: tasks
+            schema: public
   insert_permissions:
     - role: user
       permission:
@@ -818,6 +825,13 @@
           table:
             name: inventory
             schema: public
+    - name: ioevents
+      using:
+        foreign_key_constraint_on:
+          column: bodyshopid
+          table:
+            name: ioevents
+            schema: public
     - name: jobs
       using:
         foreign_key_constraint_on:
@@ -846,6 +860,13 @@
           table:
             name: phonebook
             schema: public
+    - name: tasks
+      using:
+        foreign_key_constraint_on:
+          column: bodyshopid
+          table:
+            name: tasks
+            schema: public
     - name: timetickets
       using:
         foreign_key_constraint_on:
@@ -2675,6 +2696,13 @@
 - table:
     name: ioevents
     schema: public
+  object_relationships:
+    - name: bodyshop
+      using:
+        foreign_key_constraint_on: bodyshopid
+    - name: user
+      using:
+        foreign_key_constraint_on: useremail
 - table:
     name: job_ar_schema
     schema: public
@@ -2824,6 +2852,13 @@
           table:
             name: parts_order_lines
             schema: public
+    - name: tasks
+      using:
+        foreign_key_constraint_on:
+          column: joblineid
+          table:
+            name: tasks
+            schema: public
   insert_permissions:
     - role: user
       permission:
@@ -3311,6 +3346,13 @@
           table:
             name: scoreboard
             schema: public
+    - name: tasks
+      using:
+        foreign_key_constraint_on:
+          column: jobid
+          table:
+            name: tasks
+            schema: public
     - name: timetickets
       using:
         foreign_key_constraint_on:
@@ -4200,7 +4242,7 @@
         interval_sec: 10
         num_retries: 0
         timeout_sec: 60
-      webhook: https://worktest.home.irony.online
+      webhook_from_env: HASURA_API_URL
       headers:
         - name: event-secret
           value_from_env: EVENT_SECRET
@@ -5008,6 +5050,13 @@
           table:
             name: parts_order_lines
             schema: public
+    - name: tasks
+      using:
+        foreign_key_constraint_on:
+          column: partsorderid
+          table:
+            name: tasks
+            schema: public
   insert_permissions:
     - role: user
       permission:
@@ -5623,6 +5672,129 @@
                         _eq: X-Hasura-User-Id
                   - active:
                       _eq: true
+- table:
+    name: tasks
+    schema: public
+  object_relationships:
+    - name: bill
+      using:
+        foreign_key_constraint_on: billid
+    - name: bodyshop
+      using:
+        foreign_key_constraint_on: bodyshopid
+    - name: job
+      using:
+        foreign_key_constraint_on: jobid
+    - name: jobline
+      using:
+        foreign_key_constraint_on: joblineid
+    - name: parts_order
+      using:
+        foreign_key_constraint_on: partsorderid
+    - name: user
+      using:
+        foreign_key_constraint_on: assigned_to
+    - name: userByCreatedBy
+      using:
+        foreign_key_constraint_on: created_by
+  insert_permissions:
+    - role: user
+      permission:
+        check:
+          bodyshop:
+            associations:
+              _and:
+                - user:
+                    authid:
+                      _eq: X-Hasura-User-Id
+                - active:
+                    _eq: true
+        columns:
+          - completed
+          - deleted
+          - priority
+          - assigned_to
+          - created_by
+          - description
+          - title
+          - completed_at
+          - created_at
+          - deleted_at
+          - due_date
+          - remind_at
+          - updated_at
+          - billid
+          - bodyshopid
+          - id
+          - jobid
+          - joblineid
+          - partsorderid
+  select_permissions:
+    - role: user
+      permission:
+        columns:
+          - completed
+          - deleted
+          - priority
+          - assigned_to
+          - created_by
+          - description
+          - title
+          - completed_at
+          - created_at
+          - deleted_at
+          - due_date
+          - remind_at
+          - updated_at
+          - billid
+          - bodyshopid
+          - id
+          - jobid
+          - joblineid
+          - partsorderid
+        filter:
+          bodyshop:
+            associations:
+              _and:
+                - user:
+                    authid:
+                      _eq: X-Hasura-User-Id
+                - active:
+                    _eq: true
+        allow_aggregations: true
+  update_permissions:
+    - role: user
+      permission:
+        columns:
+          - completed
+          - deleted
+          - priority
+          - assigned_to
+          - created_by
+          - description
+          - title
+          - completed_at
+          - created_at
+          - deleted_at
+          - due_date
+          - remind_at
+          - updated_at
+          - billid
+          - bodyshopid
+          - id
+          - jobid
+          - joblineid
+          - partsorderid
+        filter:
+          bodyshop:
+            associations:
+              _and:
+                - user:
+                    authid:
+                      _eq: X-Hasura-User-Id
+                - active:
+                    _eq: true
+        check: null
 - table:
     name: timetickets
     schema: public
@@ -6006,6 +6178,13 @@
           table:
             name: exportlog
             schema: public
+    - name: ioevents
+      using:
+        foreign_key_constraint_on:
+          column: useremail
+          table:
+            name: ioevents
+            schema: public
     - name: messages
       using:
         foreign_key_constraint_on:
@@ -6034,6 +6213,20 @@
           table:
             name: parts_orders
             schema: public
+    - name: tasks
+      using:
+        foreign_key_constraint_on:
+          column: assigned_to
+          table:
+            name: tasks
+            schema: public
+    - name: tasksByCreatedBy
+      using:
+        foreign_key_constraint_on:
+          column: created_by
+          table:
+            name: tasks
+            schema: public
     - name: timetickets
       using:
         foreign_key_constraint_on:

hasura/migrations/1710532848432_create_table_public_tasks/down.sql

@@ -0,0 +1 @@
+DROP TABLE "public"."tasks";

hasura/migrations/1710532848432_create_table_public_tasks/up.sql

@@ -0,0 +1,18 @@
+CREATE TABLE "public"."tasks" ("id" uuid NOT NULL DEFAULT gen_random_uuid(), "created_at" timestamptz NOT NULL DEFAULT now(), "updated_at" timestamptz NOT NULL DEFAULT now(), "title" text NOT NULL, "description" Text, "deleted" boolean NOT NULL DEFAULT false, "deleted_at" timestamptz, "due_date" timestamptz, "created_by" text NOT NULL, "assigned_to" Text, "completed" boolean NOT NULL DEFAULT false, "completed_at" timestamptz, "remind_at" timestamptz, "priority" numeric, "bodyshopid" UUID NOT NULL, "jobid" UUID NOT NULL, "joblineid" UUID, "partsorderid" UUID, "billid" UUID, PRIMARY KEY ("id") , FOREIGN KEY ("created_by") REFERENCES "public"."users"("email") ON UPDATE restrict ON DELETE restrict, FOREIGN KEY ("assigned_to") REFERENCES "public"."users"("email") ON UPDATE restrict ON DELETE restrict, FOREIGN KEY ("bodyshopid") REFERENCES "public"."bodyshops"("id") ON UPDATE restrict ON DELETE restrict, FOREIGN KEY ("jobid") REFERENCES "public"."jobs"("id") ON UPDATE cascade ON DELETE cascade, FOREIGN KEY ("joblineid") REFERENCES "public"."joblines"("id") ON UPDATE set null ON DELETE set null, FOREIGN KEY ("partsorderid") REFERENCES "public"."parts_orders"("id") ON UPDATE set null ON DELETE set null, FOREIGN KEY ("billid") REFERENCES "public"."bills"("id") ON UPDATE set null ON DELETE set null);
+CREATE OR REPLACE FUNCTION "public"."set_current_timestamp_updated_at"()
+RETURNS TRIGGER AS $$
+DECLARE
+  _new record;
+BEGIN
+  _new := NEW;
+  _new."updated_at" = NOW();
+  RETURN _new;
+END;
+$$ LANGUAGE plpgsql;
+CREATE TRIGGER "set_public_tasks_updated_at"
+BEFORE UPDATE ON "public"."tasks"
+FOR EACH ROW
+EXECUTE PROCEDURE "public"."set_current_timestamp_updated_at"();
+COMMENT ON TRIGGER "set_public_tasks_updated_at" ON "public"."tasks" 
+IS 'trigger to set value of column "updated_at" to current timestamp on row update';
+CREATE EXTENSION IF NOT EXISTS pgcrypto;

server/data/kaizen.js

@@ -201,19 +201,24 @@ exports.default = async (req, res) => {
     } finally {
       sftp.end();
     }
-    sendServerEmail({
+    // sendServerEmail({
-      subject: `Kaizen Report ${moment().format("MM-DD-YY")}`,
+    //   subject: `Kaizen Report ${moment().format("MM-DD-YY")}`,
-      text: `Errors: ${allErrors.map((e) => JSON.stringify(e, null, 2))}
+    //   text: `Errors: ${allErrors.map((e) => JSON.stringify(e, null, 2))}
-      Uploaded: ${JSON.stringify(
+    //   Uploaded: ${JSON.stringify(
-        allxmlsToUpload.map((x) => ({ filename: x.filename, count: x.count })),
+    //     allxmlsToUpload.map((x) => ({ filename: x.filename, count: x.count })),
-        null,
+    //     null,
-        2
+    //     2
-      )}
+    //   )}
-      `,
+    //   `,
-    });
+    // });
     res.sendStatus(200);
   } catch (error) {
     res.status(200).json(error);
+    sendServerEmail({
+      subject: `Kaizen Report ${moment().format("MM-DD-YY @ HH:mm:ss")}`,
+      text: `Errors: JSON.stringify(error)}
+      All Errors: ${allErrors.map((e) => JSON.stringify(e, null, 2))}`,
+    });
   }
 };
 

server/job/job-lifecycle.js

@@ -3,6 +3,7 @@ const queries = require("../graphql-client/queries");
 const moment = require("moment");
 const durationToHumanReadable = require("../utils/durationToHumanReadable");
 const calculateStatusDuration = require("../utils/calculateStatusDuration");
+const getLifecycleStatusColor = require("../utils/getLifecycleStatusColor");
 
 const jobLifecycle = async (req, res) => {
     // Grab the jobids and statuses from the request body
@@ -28,12 +29,12 @@ const jobLifecycle = async (req, res) => {
             jobIDs,
             transitions: []
         });
-
     }
 
     const transitionsByJobId = _.groupBy(resp.transitions, 'jobid');
 
     const groupedTransitions = {};
+    const allDurations = [];
 
     for (let jobId in transitionsByJobId) {
         let lifecycle = transitionsByJobId[jobId].map(transition => {
@@ -53,15 +54,57 @@ const jobLifecycle = async (req, res) => {
             return transition;
         });
 
+        const durations = calculateStatusDuration(lifecycle, statuses);
+
         groupedTransitions[jobId] = {
-            lifecycle: lifecycle,
+            lifecycle,
-            durations: calculateStatusDuration(lifecycle, statuses),
+            durations
         };
+
+        if (durations?.summations) {
+            allDurations.push(durations.summations);
+        }
     }
 
+    const finalSummations = [];
+    const flatGroupedAllDurations = _.groupBy(allDurations.flat(),'status');
+
+    const finalStatusCounts = Object.keys(flatGroupedAllDurations).reduce((acc, status) => {
+        acc[status] = flatGroupedAllDurations[status].length;
+        return acc;
+    }, {});
+    // Calculate total value of all statuses
+    const finalTotal = Object.values(flatGroupedAllDurations).reduce((total, statusArr) => {
+        return total + statusArr.reduce((acc, curr) => acc + curr.value, 0);
+    }, 0);
+
+    Object.keys(flatGroupedAllDurations).forEach(status => {
+        const value = flatGroupedAllDurations[status].reduce((acc, curr) => acc + curr.value, 0);
+        const humanReadable = durationToHumanReadable(moment.duration(value));
+        const percentage = (value / finalTotal) * 100;
+        const color = getLifecycleStatusColor(status);
+        const roundedPercentage = `${Math.round(percentage)}%`;
+        finalSummations.push({
+            status,
+            value,
+            humanReadable,
+            percentage,
+            color,
+            roundedPercentage
+        });
+    });
+
     return res.status(200).json({
         jobIDs,
         transition: groupedTransitions,
+        durations: {
+            jobs: jobIDs.length,
+            summations: finalSummations,
+            totalStatuses: finalSummations.length,
+            total: finalTotal,
+            statusCounts: finalStatusCounts,
+            humanReadable:  durationToHumanReadable(moment.duration(finalTotal))
+        }
     });
 }
 

server/utils/calculateStatusDuration.js

@@ -1,15 +1,7 @@
 const durationToHumanReadable = require("./durationToHumanReadable");
 const moment = require("moment");
+const getLifecycleStatusColor = require("./getLifecycleStatusColor");
 const _ = require("lodash");
-const crypto = require('crypto');
-
-const getColor = (key) => {
-    const hash = crypto.createHash('sha256');
-    hash.update(key);
-    const hashedKey = hash.digest('hex');
-    const num = parseInt(hashedKey, 16);
-    return '#' + (num % 16777215).toString(16).padStart(6, '0');
-};
 
 const calculateStatusDuration = (transitions, statuses) => {
     let statusDuration = {};
@@ -33,26 +25,16 @@ const calculateStatusDuration = (transitions, statuses) => {
         if (!transition.prev_value) {
             statusDuration[transition.value] = {
                 value: duration,
-                humanReadable: transition.duration_readable
+                humanReadable: durationToHumanReadable(moment.duration(duration))
             };
-        } else if (!transition.next_value) {
+        }  else {
             if (statusDuration[transition.value]) {
                 statusDuration[transition.value].value += duration;
-                statusDuration[transition.value].humanReadable = transition.duration_readable;
+                statusDuration[transition.value].humanReadable = durationToHumanReadable(moment.duration(statusDuration[transition.value].value));
             } else {
                 statusDuration[transition.value] = {
                     value: duration,
-                    humanReadable: transition.duration_readable
+                    humanReadable: durationToHumanReadable(moment.duration(duration))
-                };
-            }
-        } else {
-            if (statusDuration[transition.value]) {
-                statusDuration[transition.value].value += duration;
-                statusDuration[transition.value].humanReadable = transition.duration_readable;
-            } else {
-                statusDuration[transition.value] = {
-                    value: duration,
-                    humanReadable: transition.duration_readable
                 };
             }
         }
@@ -79,7 +61,7 @@ const calculateStatusDuration = (transitions, statuses) => {
                 value,
                 humanReadable,
                 percentage: statusDuration[status].percentage,
-                color: getColor(status),
+                color: getLifecycleStatusColor(status),
                 roundedPercentage: `${Math.round(statusDuration[status].percentage)}%`
             });
         }

server/utils/getLifecycleStatusColor.js

@@ -0,0 +1,11 @@
+const crypto = require('crypto');
+
+const getLifecycleStatusColor = (key) => {
+    const hash = crypto.createHash('sha256');
+    hash.update(key);
+    const hashedKey = hash.digest('hex');
+    const num = parseInt(hashedKey, 16);
+    return '#' + (num % 16777215).toString(16).padStart(6, '0');
+};
+
+module.exports = getLifecycleStatusColor;