Merged in feature/IO-2853-Production-Board-Date-Modal (pull request #1544)

IO-2853 Production Board Date Modal

Approved-by: Dave Richer

client/src/components/production-list-columns/production-list-columns.date.component.jsx

@@ -1,11 +1,11 @@
 import { useMutation } from "@apollo/client";
-import { Button, Card, Dropdown, TimePicker } from "antd";
-import dayjs from "../../utils/day";
+import { Button, Card, Dropdown, Space, TimePicker } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { DateFormatter } from "../../utils/DateFormatter";
+import dayjs from "../../utils/day";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";
 
 export default function ProductionListDate({ record, field, time, pastIndicator }) {
@@ -56,23 +56,25 @@ export default function ProductionListDate({ record, field, time, pastIndicator
         key: "overlayItem1",
         label: (
           <Card style={{ padding: "1rem" }} onClick={(e) => e.stopPropagation()}>
-            <FormDatePicker
-              onClick={(e) => e.stopPropagation()}
-              value={(record[field] && dayjs(record[field])) || null}
-              onChange={handleChange}
-              format="MM/DD/YYYY"
-              isDateOnly={!time}
-            />
-            {time && (
-              <TimePicker
+            <Space direction={"vertical"}>
+              <FormDatePicker
                 onClick={(e) => e.stopPropagation()}
                 value={(record[field] && dayjs(record[field])) || null}
                 onChange={handleChange}
-                minuteStep={15}
-                format="hh:mm a"
+                format="MM/DD/YYYY"
+                isDateOnly={!time}
               />
-            )}
-            <Button onClick={() => setOpen(false)}>{t("general.actions.close")}</Button>
+              {time && (
+                <TimePicker
+                  onClick={(e) => e.stopPropagation()}
+                  value={(record[field] && dayjs(record[field])) || null}
+                  onChange={handleChange}
+                  minuteStep={15}
+                  format="hh:mm a"
+                />
+              )}
+              <Button onClick={() => setOpen(false)}>{t("general.actions.close")}</Button>
+            </Space>
           </Card>
         )
       }