Added financial fields.

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

@@ -1,20 +1,20 @@
-import { Form, Icon, Tabs, Alert, Button } from "antd";
+import { Alert, Button, Form, Icon, Tabs } from "antd";
 import React, { useContext } from "react";
 import { useTranslation } from "react-i18next";
 import {
+  FaHardHat,
   FaInfo,
   FaRegStickyNote,
-  FaShieldAlt,
-  FaHardHat
+  FaShieldAlt
 } from "react-icons/fa";
 import JobLinesContainer from "../../components/job-lines/job-lines.container.component";
 import JobsDetailClaims from "../../components/jobs-detail-claims/jobs-detail-claims.component";
+import JobsDetailFinancials from "../../components/jobs-detail-financial/jobs-detail-financial.component";
 import JobsDetailHeader from "../../components/jobs-detail-header/jobs-detail-header.component";
+import JobsDetailInsurance from "../../components/jobs-detail-insurance/jobs-detail-insurance.component";
 import JobsDocumentsContainer from "../../components/jobs-documents/jobs-documents.container";
 import JobNotesContainer from "../../components/jobs-notes/jobs-notes.container";
-import JobsRatesContainer from "../../components/jobs-rates/jobs-rates.container";
 import JobDetailFormContext from "./jobs-detail.page.context";
-import JobsDetailInsurance from "../../components/jobs-detail-insurance/jobs-detail-insurance.component";
 
 export default function JobsDetailPage({
   job,
@@ -60,7 +60,7 @@ export default function JobsDetailPage({
         />
       ) : null}
 
-      <Tabs defaultActiveKey='claimdetail'>
+      <Tabs defaultActiveKey="claimdetail">
         <Tabs.TabPane
           tab={
             <span>
@@ -68,7 +68,8 @@ export default function JobsDetailPage({
               {t("menus.jobsdetail.claimdetail")}
             </span>
           }
-          key='claimdetail'>
+          key="claimdetail"
+        >
           <JobsDetailClaims job={job} />
         </Tabs.TabPane>
 
@@ -79,40 +80,44 @@ export default function JobsDetailPage({
               {t("menus.jobsdetail.insurance")}
             </span>
           }
-          key='insurance'>
+          key="insurance"
+        >
           <JobsDetailInsurance job={job} />
         </Tabs.TabPane>
 
         <Tabs.TabPane
           tab={
             <span>
-              <Icon type='bars' />
+              <Icon type="bars" />
               {t("menus.jobsdetail.repairdata")}
             </span>
           }
-          key='repairdata'>
+          key="repairdata"
+        >
           <JobLinesContainer jobId={job.id} />
         </Tabs.TabPane>
 
         <Tabs.TabPane
           tab={
             <span>
-              <Icon type='dollar' />
+              <Icon type="dollar" />
               {t("menus.jobsdetail.financials")}
             </span>
           }
-          key='financials'>
-          <JobsRatesContainer />
+          key="financials"
+        >
+          <JobsDetailFinancials job={job} />
         </Tabs.TabPane>
 
         <Tabs.TabPane
           tab={
             <span>
-              <Icon type='tool' />
+              <Icon type="tool" />
               {t("menus.jobsdetail.partssublet")}
             </span>
           }
-          key='partssublet'>
+          key="partssublet"
+        >
           Partssublet
         </Tabs.TabPane>
 
@@ -123,29 +128,32 @@ export default function JobsDetailPage({
               {t("menus.jobsdetail.labor")}
             </span>
           }
-          key='labor'>
+          key="labor"
+        >
           Labor
         </Tabs.TabPane>
 
         <Tabs.TabPane
           tab={
             <span>
-              <Icon type='calendar' />
+              <Icon type="calendar" />
               {t("menus.jobsdetail.dates")}
             </span>
           }
-          key='dates'>
+          key="dates"
+        >
           Dates
         </Tabs.TabPane>
 
         <Tabs.TabPane
           tab={
             <span>
-              <Icon type='file-image' />
+              <Icon type="file-image" />
               {t("jobs.labels.documents")}
             </span>
           }
-          key='#documents'>
+          key="#documents"
+        >
           <JobsDocumentsContainer jobId={job.id} />
         </Tabs.TabPane>
         <Tabs.TabPane
@@ -155,7 +163,8 @@ export default function JobsDetailPage({
               {t("jobs.labels.notes")}
             </span>
           }
-          key='#notes'>
+          key="#notes"
+        >
           <JobNotesContainer jobId={job.id} />
         </Tabs.TabPane>
       </Tabs>