BOD-17 Added return car modal.

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

@@ -1,20 +1,50 @@
+import { Button, Typography } from "antd";
 import React from "react";
-import ContractFormComponent from "../../components/contract-form/contract-form.component";
 import { useTranslation } from "react-i18next";
-import { Button } from "antd";
-import ContractJobBlock from "../../components/contract-job-block/contract-job-block.component";
+import { connect } from "react-redux";
 import ContractCourtesyCarBlock from "../../components/contract-courtesy-car-block/contract-courtesy-car-block.component";
+import ContractFormComponent from "../../components/contract-form/contract-form.component";
+import ContractJobBlock from "../../components/contract-job-block/contract-job-block.component";
+import { setModalContext } from "../../redux/modals/modals.actions";
 
-export default function ContractDetailPage({ job, courtesyCar }) {
+const mapDispatchToProps = dispatch => ({
+  setCourtesyCarReturnModalContext: context =>
+    dispatch(setModalContext({ context: context, modal: "courtesyCarReturn" }))
+});
+
+export function ContractDetailPage({
+  contract,
+  job,
+  courtesyCar,
+  setCourtesyCarReturnModalContext,
+  refetch
+}) {
   const { t } = useTranslation();
   return (
     <div>
+      <Typography.Title>{`Agreement ${(contract && contract.agreementnumber) ||
+        ""}`}</Typography.Title>
       <Button type="primary" htmlType="submit">
         {t("general.actions.save")}
       </Button>
+      <Button
+        disabled={contract && contract.status !== "contracts.status.out"}
+        onClick={() => {
+          setCourtesyCarReturnModalContext({
+            actions: { refetch },
+            context: {
+              contractId: contract.id,
+              courtesyCarId: courtesyCar.id
+            }
+          });
+        }}
+      >
+        {t("courtesycars.actions.return")}
+      </Button>
       <ContractJobBlock job={job} />
       <ContractCourtesyCarBlock courtesyCar={courtesyCar} />
       <ContractFormComponent />
     </div>
   );
 }
+export default connect(null, mapDispatchToProps)(ContractDetailPage);