Fix Formatting issues

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

client/src/components/header/header.component.jsx

@@ -26,35 +26,26 @@ import Icon, {
   UnorderedListOutlined,
   UserOutlined
 } from "@ant-design/icons";
-import {useSplitTreatments} from "@splitsoftware/splitio-react";
-import {Layout, Menu, Switch, Tooltip} from "antd";
-import React, {useEffect, useState} from "react";
-import {useTranslation} from "react-i18next";
-import {BsKanban} from "react-icons/bs";
-import {
-  FaCalendarAlt,
-  FaCarCrash,
-  FaCreditCard,
-  FaFileInvoiceDollar,
-  FaTasks
-} from "react-icons/fa";
-import {GiPayMoney, GiPlayerTime, GiSettingsKnobs} from "react-icons/gi";
-import {IoBusinessOutline} from "react-icons/io5";
-import {RiSurveyLine} from "react-icons/ri";
-import {connect} from "react-redux";
-import {Link} from "react-router-dom";
-import {createStructuredSelector} from "reselect";
-import {
-  selectRecentItems,
-  selectSelectedHeader
-} from "../../redux/application/application.selectors";
-import {setModalContext} from "../../redux/modals/modals.actions";
-import {signOutStart} from "../../redux/user/user.actions";
-import {selectBodyshop, selectCurrentUser} from "../../redux/user/user.selectors";
-import {FiLogOut} from "react-icons/fi";
-import {checkBeta, handleBeta, setBeta} from "../../utils/betaHandler";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
+import { Layout, Menu, Switch, Tooltip } from "antd";
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { BsKanban } from "react-icons/bs";
+import { FaCalendarAlt, FaCarCrash, FaCreditCard, FaFileInvoiceDollar, FaTasks } from "react-icons/fa";
+import { GiPayMoney, GiPlayerTime, GiSettingsKnobs } from "react-icons/gi";
+import { IoBusinessOutline } from "react-icons/io5";
+import { RiSurveyLine } from "react-icons/ri";
+import { connect } from "react-redux";
+import { Link } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
+import { selectRecentItems, selectSelectedHeader } from "../../redux/application/application.selectors";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { signOutStart } from "../../redux/user/user.actions";
+import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
+import { FiLogOut } from "react-icons/fi";
+import { checkBeta, handleBeta, setBeta } from "../../utils/betaHandler";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
-import {HasFeatureAccess} from "../feature-wrapper/feature-wrapper.component";
+import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
@@ -64,53 +55,68 @@ const mapStateToProps = createStructuredSelector({
 });
 
 const mapDispatchToProps = (dispatch) => ({
-  setBillEnterContext: (context) => dispatch(setModalContext({
-    context: context,
-    modal: "billEnter"
-  })),
-  setTimeTicketContext: (context) => dispatch(setModalContext({
-    context: context,
-    modal: "timeTicket"
-  })),
-  setPaymentContext: (context) => dispatch(setModalContext({context: context, modal: "payment"})),
-  setReportCenterContext: (context) => dispatch(setModalContext({
-    context: context,
-    modal: "reportCenter"
-  })),
+  setBillEnterContext: (context) =>
+    dispatch(
+      setModalContext({
+        context: context,
+        modal: "billEnter"
+      })
+    ),
+  setTimeTicketContext: (context) =>
+    dispatch(
+      setModalContext({
+        context: context,
+        modal: "timeTicket"
+      })
+    ),
+  setPaymentContext: (context) => dispatch(setModalContext({ context: context, modal: "payment" })),
+  setReportCenterContext: (context) =>
+    dispatch(
+      setModalContext({
+        context: context,
+        modal: "reportCenter"
+      })
+    ),
   signOutStart: () => dispatch(signOutStart()),
-  setCardPaymentContext: (context) => dispatch(setModalContext({
-    context: context,
-    modal: "cardPayment"
-  })),
-  setTaskUpsertContext: (context) => dispatch(setModalContext({
-    context: context,
-    modal: 'taskUpsert'
-  })),
+  setCardPaymentContext: (context) =>
+    dispatch(
+      setModalContext({
+        context: context,
+        modal: "cardPayment"
+      })
+    ),
+  setTaskUpsertContext: (context) =>
+    dispatch(
+      setModalContext({
+        context: context,
+        modal: "taskUpsert"
+      })
+    )
 });
 
 function Header({
-                  handleMenuClick,
-                  currentUser,
-                  bodyshop,
-                  selectedHeader,
-                  signOutStart,
-                  setBillEnterContext,
-                  setTimeTicketContext,
-                  setPaymentContext,
-                  setReportCenterContext,
-                  recentItems,
-                  setCardPaymentContext,
-                  setTaskUpsertContext,
-                }) {
+  handleMenuClick,
+  currentUser,
+  bodyshop,
+  selectedHeader,
+  signOutStart,
+  setBillEnterContext,
+  setTimeTicketContext,
+  setPaymentContext,
+  setReportCenterContext,
+  recentItems,
+  setCardPaymentContext,
+  setTaskUpsertContext
+}) {
   const {
-    treatments: {ImEXPay, DmsAp, Simple_Inventory}
+    treatments: { ImEXPay, DmsAp, Simple_Inventory }
   } = useSplitTreatments({
     attributes: {},
     names: ["ImEXPay", "DmsAp", "Simple_Inventory"],
     splitKey: bodyshop && bodyshop.imexshopid
   });
   const [betaSwitch, setBetaSwitch] = useState(false);
-  const {t} = useTranslation();
+  const { t } = useTranslation();
 
   useEffect(() => {
     const isBeta = checkBeta();
@@ -129,18 +135,18 @@ function Header({
     InstanceRenderManager({
       imex: true,
       rome: true,
-      promanager: HasFeatureAccess({featureName: "bills", bodyshop})
+      promanager: HasFeatureAccess({ featureName: "bills", bodyshop })
     })
   ) {
     accountingChildren.push(
       {
         key: "bills",
-        icon: <Icon component={FaFileInvoiceDollar}/>,
+        icon: <Icon component={FaFileInvoiceDollar} />,
         label: <Link to="/manage/bills">{t("menus.header.bills")}</Link>
       },
       {
         key: "enterbills",
-        icon: <Icon component={GiPayMoney}/>,
+        icon: <Icon component={GiPayMoney} />,
         label: t("menus.header.enterbills"),
         onClick: () => {
           setBillEnterContext({
@@ -159,7 +165,7 @@ function Header({
       },
       {
         key: "inventory",
-        icon: <Icon component={FaFileInvoiceDollar}/>,
+        icon: <Icon component={FaFileInvoiceDollar} />,
         label: <Link to="/manage/inventory">{t("menus.header.inventory")}</Link>
       }
     );
@@ -168,7 +174,7 @@ function Header({
     InstanceRenderManager({
       imex: true,
       rome: true,
-      promanager: HasFeatureAccess({featureName: "payments", bodyshop})
+      promanager: HasFeatureAccess({ featureName: "payments", bodyshop })
     })
   ) {
     accountingChildren.push(
@@ -177,12 +183,12 @@ function Header({
       },
       {
         key: "allpayments",
-        icon: <BankFilled/>,
+        icon: <BankFilled />,
         label: <Link to="/manage/payments">{t("menus.header.allpayments")}</Link>
       },
       {
         key: "enterpayments",
-        icon: <Icon component={FaCreditCard}/>,
+        icon: <Icon component={FaCreditCard} />,
         label: t("menus.header.enterpayment"),
         onClick: () => {
           setPaymentContext({
@@ -197,7 +203,7 @@ function Header({
   if (ImEXPay.treatment === "on") {
     accountingChildren.push({
       key: "entercardpayments",
-      icon: <Icon component={FaCreditCard}/>,
+      icon: <Icon component={FaCreditCard} />,
       label: t("menus.header.entercardpayment"),
       onClick: () => {
         setCardPaymentContext({
@@ -212,7 +218,7 @@ function Header({
     InstanceRenderManager({
       imex: true,
       rome: true,
-      promanager: HasFeatureAccess({featureName: "timetickets", bodyshop})
+      promanager: HasFeatureAccess({ featureName: "timetickets", bodyshop })
     })
   ) {
     accountingChildren.push(
@@ -221,7 +227,7 @@ function Header({
       },
       {
         key: "timetickets",
-        icon: <FieldTimeOutlined/>,
+        icon: <FieldTimeOutlined />,
         label: <Link to="/manage/timetickets">{t("menus.header.timetickets")}</Link>
       }
     );
@@ -229,14 +235,14 @@ function Header({
     if (bodyshop?.md_tasks_presets?.use_approvals) {
       accountingChildren.push({
         key: "ttapprovals",
-        icon: <FieldTimeOutlined/>,
+        icon: <FieldTimeOutlined />,
         label: <Link to="/manage/ttapprovals">{t("menus.header.ttapprovals")}</Link>
       });
     }
     accountingChildren.push(
       {
         key: "entertimetickets",
-        icon: <Icon component={GiPlayerTime}/>,
+        icon: <Icon component={GiPlayerTime} />,
         label: t("menus.header.entertimeticket"),
         onClick: () => {
           setTimeTicketContext({
@@ -258,8 +264,7 @@ function Header({
   const accountingExportChildren = [
     {
       key: "receivables",
-      label: <Link
-        to="/manage/accounting/receivables">{t("menus.header.accounting-receivables")}</Link>
+      label: <Link to="/manage/accounting/receivables">{t("menus.header.accounting-receivables")}</Link>
     }
   ];
 
@@ -291,12 +296,12 @@ function Header({
     InstanceRenderManager({
       imex: true,
       rome: true,
-      promanager: HasFeatureAccess({featureName: "export", bodyshop})
+      promanager: HasFeatureAccess({ featureName: "export", bodyshop })
     })
   ) {
     accountingChildren.push({
       key: "accountingexport",
-      icon: <ExportOutlined/>,
+      icon: <ExportOutlined />,
       label: t("menus.header.export"),
       children: accountingExportChildren
     });
@@ -305,44 +310,44 @@ function Header({
   const menuItems = [
     {
       key: "home",
-      icon: <HomeFilled/>,
+      icon: <HomeFilled />,
       label: <Link to="/manage/">{t("menus.header.home")}</Link>
     },
     {
       key: "schedule",
-      icon: <Icon component={FaCalendarAlt}/>,
+      icon: <Icon component={FaCalendarAlt} />,
       label: <Link to="/manage/schedule">{t("menus.header.schedule")}</Link>
     },
     {
       key: "jobssubmenu",
       id: "header-jobs",
-      icon: <Icon component={FaCarCrash}/>,
+      icon: <Icon component={FaCarCrash} />,
       label: t("menus.header.jobs"),
       children: [
         {
           key: "activejobs",
-          icon: <FileFilled/>,
+          icon: <FileFilled />,
           label: <Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>
         },
         {
           key: "readyjobs",
-          icon: <CheckCircleOutlined/>,
+          icon: <CheckCircleOutlined />,
           label: <Link to="/manage/jobs/ready">{t("menus.header.readyjobs")}</Link>
         },
         {
           key: "parts-queue",
-          icon: <ToolFilled/>,
+          icon: <ToolFilled />,
           label: <Link to="/manage/partsqueue">{t("menus.header.parts-queue")}</Link>
         },
         {
           key: "availablejobs",
           id: "header-jobs-available",
-          icon: <ImportOutlined/>,
+          icon: <ImportOutlined />,
           label: <Link to="/manage/available">{t("menus.header.availablejobs")}</Link>
         },
         {
           key: "newjob",
-          icon: <FileAddOutlined/>,
+          icon: <FileAddOutlined />,
           label: <Link to="/manage/jobs/new">{t("menus.header.newjob")}</Link>
         },
         {
@@ -350,7 +355,7 @@ function Header({
         },
         {
           key: "alljobs",
-          icon: <UnorderedListOutlined/>,
+          icon: <UnorderedListOutlined />,
           label: <Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>
         },
         {
@@ -358,54 +363,54 @@ function Header({
         },
         {
           key: "productionlist",
-          icon: <ScheduleOutlined/>,
+          icon: <ScheduleOutlined />,
           label: <Link to="/manage/production/list">{t("menus.header.productionlist")}</Link>
         },
         ...(InstanceRenderManager({
           imex: true,
           rome: true,
-          promanager: HasFeatureAccess({featureName: "visualboard", bodyshop})
+          promanager: HasFeatureAccess({ featureName: "visualboard", bodyshop })
         })
           ? [
-            {
-              key: "productionboard",
-              icon: <Icon component={BsKanban}/>,
-              label: <Link to="/manage/production/board">{t("menus.header.productionboard")}</Link>
-            }
-          ]
+              {
+                key: "productionboard",
+                icon: <Icon component={BsKanban} />,
+                label: <Link to="/manage/production/board">{t("menus.header.productionboard")}</Link>
+              }
+            ]
           : []),
 
         ...(InstanceRenderManager({
           imex: true,
           rome: true,
-          promanager: HasFeatureAccess({featureName: "scoreboard", bodyshop})
+          promanager: HasFeatureAccess({ featureName: "scoreboard", bodyshop })
         })
           ? [
-            {
-              type: "divider"
-            },
-            {
-              key: "scoreboard",
-              icon: <LineChartOutlined/>,
-              label: <Link to="/manage/scoreboard">{t("menus.header.scoreboard")}</Link>
-            }
-          ]
+              {
+                type: "divider"
+              },
+              {
+                key: "scoreboard",
+                icon: <LineChartOutlined />,
+                label: <Link to="/manage/scoreboard">{t("menus.header.scoreboard")}</Link>
+              }
+            ]
           : [])
       ]
     },
     {
       key: "customers",
-      icon: <UserOutlined/>,
+      icon: <UserOutlined />,
       label: t("menus.header.customers"),
       children: [
         {
           key: "owners",
-          icon: <TeamOutlined/>,
+          icon: <TeamOutlined />,
           label: <Link to="/manage/owners">{t("menus.header.owners")}</Link>
         },
         {
           key: "vehicles",
-          icon: <CarFilled/>,
+          icon: <CarFilled />,
           label: <Link to="/manage/vehicles">{t("menus.header.vehicles")}</Link>
         }
       ]
@@ -416,108 +421,106 @@ function Header({
       promanager: false // HasFeatureAccess({ featureName: 'courtesycars', bodyshop }),
     })
       ? [
-        {
-          key: "ccs",
-          icon: <CarFilled/>,
-          label: t("menus.header.courtesycars"),
-          children: [
-            {
-              key: "courtesycarsall",
-              icon: <CarFilled/>,
-              label: <Link to="/manage/courtesycars">{t("menus.header.courtesycars-all")}</Link>
-            },
-            {
-              key: "contracts",
-              icon: <FileFilled/>,
-              label: <Link
-                to="/manage/courtesycars/contracts">{t("menus.header.courtesycars-contracts")}</Link>
-            },
-            {
-              key: "newcontract",
-              icon: <FileAddFilled/>,
-              label: <Link
-                to="/manage/courtesycars/contracts/new">{t("menus.header.courtesycars-newcontract")}</Link>
-            }
-          ]
-        }
-      ]
+          {
+            key: "ccs",
+            icon: <CarFilled />,
+            label: t("menus.header.courtesycars"),
+            children: [
+              {
+                key: "courtesycarsall",
+                icon: <CarFilled />,
+                label: <Link to="/manage/courtesycars">{t("menus.header.courtesycars-all")}</Link>
+              },
+              {
+                key: "contracts",
+                icon: <FileFilled />,
+                label: <Link to="/manage/courtesycars/contracts">{t("menus.header.courtesycars-contracts")}</Link>
+              },
+              {
+                key: "newcontract",
+                icon: <FileAddFilled />,
+                label: <Link to="/manage/courtesycars/contracts/new">{t("menus.header.courtesycars-newcontract")}</Link>
+              }
+            ]
+          }
+        ]
       : []),
 
     ...(accountingChildren.length > 0
       ? [
-        {
-          key: "accounting",
-          icon: <DollarCircleFilled/>,
-          label: t("menus.header.accounting"),
-          children: accountingChildren
-        }
-      ]
+          {
+            key: "accounting",
+            icon: <DollarCircleFilled />,
+            label: t("menus.header.accounting"),
+            children: accountingChildren
+          }
+        ]
       : []),
     {
       key: "phonebook",
-      icon: <PhoneOutlined/>,
+      icon: <PhoneOutlined />,
       label: <Link to="/manage/phonebook">{t("menus.header.phonebook")}</Link>
     },
     ...(InstanceRenderManager({
       imex: true,
       rome: true,
-      promanager: HasFeatureAccess({featureName: "media", bodyshop})
+      promanager: HasFeatureAccess({ featureName: "media", bodyshop })
     })
       ? [
-        {
-          key: "temporarydocs",
-          icon: <PaperClipOutlined/>,
-          label: <Link to="/manage/temporarydocs">{t("menus.header.temporarydocs")}</Link>
-        }
-      ]
+          {
+            key: "temporarydocs",
+            icon: <PaperClipOutlined />,
+            label: <Link to="/manage/temporarydocs">{t("menus.header.temporarydocs")}</Link>
+          }
+        ]
       : []),
     {
-      key: 'tasks',
-      id: 'tasks',
-      icon: <FaTasks/>,
-      label: t('menus.header.tasks'),
+      key: "tasks",
+      id: "tasks",
+      icon: <FaTasks />,
+      label: t("menus.header.tasks"),
       children: [
         {
-          key: 'createTask',
-          icon: <PlusCircleOutlined/>,
-          label: t('menus.header.create_task'),
+          key: "createTask",
+          icon: <PlusCircleOutlined />,
+          label: t("menus.header.create_task"),
           onClick: () => {
             setTaskUpsertContext({
               actions: {},
-              context: {},
+              context: {}
             });
-          },
+          }
         },
         {
-          key: 'mytasks',
-          icon: <FaTasks/>,
-          label: <Link to="/manage/tasks/mytasks">{t('menus.header.my_tasks')}</Link>,
+          key: "mytasks",
+          icon: <FaTasks />,
+          label: <Link to="/manage/tasks/mytasks">{t("menus.header.my_tasks")}</Link>
         },
         {
-          key: 'all_tasks',
-          icon: <FaTasks/>,
-          label: <Link to="/manage/tasks/alltasks">{t('menus.header.all_tasks')}</Link>,
+          key: "all_tasks",
+          icon: <FaTasks />,
+          label: <Link to="/manage/tasks/alltasks">{t("menus.header.all_tasks")}</Link>
         }
       ]
     },
     {
-      key: 'shopsubmenu',
-      icon: <SettingOutlined/>,
+      key: "shopsubmenu",
+      icon: <SettingOutlined />,
       label: t("menus.header.shop"),
       children: [
         {
           key: "shop",
-          icon: <Icon component={GiSettingsKnobs}/>,
+          icon: <Icon component={GiSettingsKnobs} />,
           label: <Link to="/manage/shop?tab=info">{t("menus.header.shop_config")}</Link>
         },
         {
           key: "dashboard",
-          icon: <DashboardFilled/>,
+          icon: <DashboardFilled />,
           label: <Link to="/manage/dashboard">{t("menus.header.dashboard")}</Link>
         },
         {
           key: "reportcenter",
-          icon: <BarChartOutlined/>,
+          icon: <BarChartOutlined />,
           label: t("menus.header.reportcenter"),
           onClick: () => {
             setReportCenterContext({
@@ -528,21 +531,21 @@ function Header({
         },
         {
           key: "shop-vendors",
-          icon: <Icon component={IoBusinessOutline}/>,
+          icon: <Icon component={IoBusinessOutline} />,
           label: <Link to="/manage/shop/vendors">{t("menus.header.shop_vendors")}</Link>
         },
         ...(InstanceRenderManager({
           imex: true,
           rome: true,
-          promanager: HasFeatureAccess({featureName: "csi", bodyshop})
+          promanager: HasFeatureAccess({ featureName: "csi", bodyshop })
         })
           ? [
-            {
-              key: "shop-csi",
-              icon: <Icon component={RiSurveyLine}/>,
-              label: <Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>
-            }
-          ]
+              {
+                key: "shop-csi",
+                icon: <Icon component={RiSurveyLine} />,
+                label: <Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>
+              }
+            ]
           : [])
       ]
     },
@@ -552,14 +555,14 @@ function Header({
       children: [
         {
           key: "signout",
-          icon: <Icon component={FiLogOut}/>,
+          icon: <Icon component={FiLogOut} />,
           danger: true,
           label: t("user.actions.signout"),
           onClick: () => signOutStart()
         },
         {
           key: "help",
-          icon: <Icon component={QuestionCircleFilled}/>,
+          icon: <Icon component={QuestionCircleFilled} />,
           label: t("menus.header.help"),
           onClick: () => {
             window.open(
@@ -585,19 +588,19 @@ function Header({
         ...(InstanceRenderManager({
           imex: true,
           rome: true,
-          promanager: HasFeatureAccess({featureName: "timetickets", bodyshop})
+          promanager: HasFeatureAccess({ featureName: "timetickets", bodyshop })
         })
           ? [
-            {
-              key: "shiftclock",
-              icon: <Icon component={GiPlayerTime}/>,
-              label: <Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>
-            }
-          ]
+              {
+                key: "shiftclock",
+                icon: <Icon component={GiPlayerTime} />,
+                label: <Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>
+              }
+            ]
           : []),
         {
           key: "profile",
-          icon: <UserOutlined/>,
+          icon: <UserOutlined />,
           label: <Link to="/manage/profile">{t("menus.currentuser.profile")}</Link>
         }
         // {
@@ -631,7 +634,7 @@ function Header({
     },
     {
       key: "recent",
-      icon: <ClockCircleFilled/>,
+      icon: <ClockCircleFilled />,
       children: recentItems.map((i, idx) => ({
         key: idx,
         label: <Link to={i.url}>{i.label}</Link>
@@ -645,7 +648,7 @@ function Header({
     imex: () => {
       menuItems.push({
         key: "beta-switch",
-        style: {marginLeft: "auto"},
+        style: { marginLeft: "auto" },
         label: (
           <Tooltip
             title={`A more modern ${InstanceRenderManager({
@@ -654,9 +657,9 @@ function Header({
               promanager: t("titles.promanager")
             })} is ready for you to try! You can switch back at any time.`}
           >
-            <InfoCircleOutlined/>
-            <span style={{marginRight: 8}}>Try the new app</span>
-            <Switch checked={betaSwitch} onChange={betaSwitchChange}/>
+            <InfoCircleOutlined />
+            <span style={{ marginRight: 8 }}>Try the new app</span>
+            <Switch checked={betaSwitch} onChange={betaSwitchChange} />
           </Tooltip>
         )
       });