Minor fixed + refactored job details screens based on review.

client/src/pages/jobs-detail/jobs-detail.page.component.jsx

@@ -13,39 +13,35 @@ import { useTranslation } from "react-i18next";
 import {
   FaHardHat,
   FaHistory,
-  FaInfo,
   FaRegStickyNote,
   FaShieldAlt,
 } from "react-icons/fa";
 import { connect } from "react-redux";
 import { useHistory, useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
+import FormFieldsChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
 import { CalculateJob } from "../../components/job-totals-table/job-totals.utility";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormFieldsChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
 
 const JobsLinesContainer = lazy(() =>
   import("../../components/job-detail-lines/job-lines.container")
 );
-const JobsDetailClaims = lazy(() =>
-  import("../../components/jobs-detail-claims/jobs-detail-claims.component")
-);
+
 const JobsDetailDatesComponent = lazy(() =>
   import("../../components/jobs-detail-dates/jobs-detail-dates.component")
 );
-const JobsDetailFinancials = lazy(() =>
-  import(
-    "../../components/jobs-detail-financial/jobs-detail-financial.component"
-  )
+const JobsDetailTotals = lazy(() =>
+  import("../../components/jobs-detail-totals/jobs-detail-totals.component")
+);
+const JobsDetailRates = lazy(() =>
+  import("../../components/jobs-detail-rates/jobs-detail-rates.component")
 );
 const JobsDetailHeader = lazy(() =>
   import("../../components/jobs-detail-header/jobs-detail-header.component")
 );
-const JobsDetailInsurance = lazy(() =>
-  import(
-    "../../components/jobs-detail-insurance/jobs-detail-insurance.component"
-  )
+const JobsDetailGeneral = lazy(() =>
+  import("../../components/jobs-detail-general/jobs-detail-general.component")
 );
 const JobsDocumentsGalleryContainer = lazy(() =>
   import(
@@ -157,27 +153,16 @@ export function JobsDetailPage({
           defaultActiveKey={search.tab}
           onChange={(key) => history.push({ search: `?tab=${key}` })}
         >
-          <Tabs.TabPane
-            tab={
-              <span>
-                <Icon component={FaInfo} />
-                {t("menus.jobsdetail.claimdetail")}
-              </span>
-            }
-            key="claimdetail"
-          >
-            <JobsDetailClaims job={job} />
-          </Tabs.TabPane>
           <Tabs.TabPane
             tab={
               <span>
                 <Icon component={FaShieldAlt} />
-                {t("menus.jobsdetail.insurance")}
+                {t("menus.jobsdetail.general")}
               </span>
             }
-            key="insurance"
+            key="general"
           >
-            <JobsDetailInsurance job={job} form={form} />
+            <JobsDetailGeneral job={job} form={form} />
           </Tabs.TabPane>
           <Tabs.TabPane
             tab={
@@ -198,12 +183,23 @@ export function JobsDetailPage({
             tab={
               <span>
                 <DollarCircleOutlined />
-                {t("menus.jobsdetail.financials")}
+                {t("menus.jobsdetail.rates")}
               </span>
             }
-            key="financials"
+            key="rates"
           >
-            <JobsDetailFinancials job={job} />
+            <JobsDetailRates job={job} />
+          </Tabs.TabPane>
+          <Tabs.TabPane
+            tab={
+              <span>
+                <DollarCircleOutlined />
+                {t("menus.jobsdetail.totals")}
+              </span>
+            }
+            key="totals"
+          >
+            <JobsDetailTotals job={job} />
           </Tabs.TabPane>
           <Tabs.TabPane
             tab={

client/src/pages/manage/manage.page.styles.scss

@@ -4,6 +4,7 @@
   padding: 0.25rem 1rem 0rem 1rem;
   border-radius: 4px;
   background: #fff;
+  padding-bottom: 3rem;
 }
 
 .layout-container {

client/src/pages/production-board/production-board.container.jsx

@@ -29,7 +29,7 @@ export function ProductionBoardContainer({ setBreadcrumbs, bodyshop }) {
   }, [t, setBreadcrumbs]);
 
   return (
-    <RbacWrapper action="production-board">
+    <RbacWrapper action="production:board">
       <ProductionBoardComponent />
     </RbacWrapper>
   );

client/src/pages/production-list/production-list.container.jsx

@@ -26,7 +26,7 @@ export function ProductionListContainer({ setBreadcrumbs, bodyshop }) {
   }, [t, setBreadcrumbs]);
 
   return (
-    <RbacWrapper action="production-list">
+    <RbacWrapper action="production:list">
       <ProductionListComponent />
     </RbacWrapper>
   );