From db906d9c19985a444f6dfe440f9ef5d4d0e129f1 Mon Sep 17 00:00:00 2001
From: Patrick Fic <>
Date: Thu, 18 Feb 2021 14:55:39 -0800
Subject: [PATCH] Act Comp date required for post prod jobs IO-685

---
 .../jobs-detail-dates.component.jsx           | 35 +++++++++++++++----
 1 file changed, 28 insertions(+), 7 deletions(-)

diff --git a/client/src/components/jobs-detail-dates/jobs-detail-dates.component.jsx b/client/src/components/jobs-detail-dates/jobs-detail-dates.component.jsx
index 8be3391ad..695f6ae97 100644
--- a/client/src/components/jobs-detail-dates/jobs-detail-dates.component.jsx
+++ b/client/src/components/jobs-detail-dates/jobs-detail-dates.component.jsx
@@ -1,20 +1,28 @@
 import { DatePicker, Form, Tooltip } from "antd";
-import React from "react";
+import React, { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
+import { selectBodyshop } from "../../redux/user/user.selectors";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
 import FormRow from "../layout-form-row/layout-form-row.component";
 
 const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly,
+  bodyshop: selectBodyshop,
 });
 
-export function JobsDetailDatesComponent({ jobRO, job }) {
+export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
   const { t } = useTranslation();
 
+  const jobInPostProduction = useMemo(() => {
+    return bodyshop.md_ro_statuses.post_production_statuses.includes(
+      job.status
+    );
+  }, [job.status, bodyshop.md_ro_statuses.post_production_statuses]);
+
   return (
     <div>
       <FormRow header={t("jobs.forms.estdates")}>
@@ -52,12 +60,25 @@ export function JobsDetailDatesComponent({ jobRO, job }) {
         >
           <DateTimePicker disabled={jobRO} />
         </Form.Item>
-        <Form.Item
-          label={t("jobs.fields.actual_completion")}
-          name="actual_completion"
-        >
-          <DateTimePicker disabled={jobRO} />
+        <Form.Item shouldUpdate>
+          {() => {
+            return (
+              <Form.Item
+                label={t("jobs.fields.actual_completion")}
+                name="actual_completion"
+                rules={[
+                  {
+                    required: jobInPostProduction,
+                    message: t("general.validation.required"),
+                  },
+                ]}
+              >
+                <DateTimePicker disabled={jobRO} />
+              </Form.Item>
+            );
+          }}
         </Form.Item>
+
         <Form.Item
           label={t("jobs.fields.scheduled_delivery")}
           name="scheduled_delivery"