From 259c8af664d4107a098b4981a272da311b5c92c9 Mon Sep 17 00:00:00 2001
From: Patrick Fic <>
Date: Thu, 6 May 2021 14:52:44 -0700
Subject: [PATCH] IO-1022 IO-1011 Minor UI fixes.

---
 .../job-at-change/schedule-event.component.jsx       | 12 ++++++++----
 .../parts-order-modal.component.jsx                  |  2 +-
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/client/src/components/job-at-change/schedule-event.component.jsx b/client/src/components/job-at-change/schedule-event.component.jsx
index 78150482c..d4585e88f 100644
--- a/client/src/components/job-at-change/schedule-event.component.jsx
+++ b/client/src/components/job-at-change/schedule-event.component.jsx
@@ -1,5 +1,5 @@
 import { Button, Popover, Space } from "antd";
-import React from "react";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { Link } from "react-router-dom";
@@ -7,10 +7,10 @@ import { setModalContext } from "../../redux/modals/modals.actions";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import PhoneFormatter from "../../utils/PhoneFormatter";
 import { GenerateDocument } from "../../utils/RenderTemplate";
+import { TemplateList } from "../../utils/TemplateConstants";
 import DataLabel from "../data-label/data-label.component";
 import ScheduleAtChange from "./job-at-change.component";
 import ScheduleEventColor from "./schedule-event.color.component";
-import { TemplateList } from "../../utils/TemplateConstants";
 const mapDispatchToProps = (dispatch) => ({
   setScheduleContext: (context) =>
     dispatch(setModalContext({ context: context, modal: "schedule" })),
@@ -23,6 +23,7 @@ export function ScheduleEventComponent({
   setScheduleContext,
 }) {
   const { t } = useTranslation();
+  const [visible, setVisible] = useState(false);
   const popoverContent = (
     <div>
       {!event.isintake ? (
@@ -72,7 +73,7 @@ export function ScheduleEventComponent({
         </div>
       ) : null}
 
-      <div className="imex-flex-row">
+      <Space wrap>
         {event.job ? (
           <Link to={`/manage/jobs/${event.job && event.job.id}`}>
             <Button>{t("appointments.actions.viewjob")}</Button>
@@ -100,6 +101,7 @@ export function ScheduleEventComponent({
         <Button
           disabled={event.arrived}
           onClick={() => {
+            setVisible(false);
             setScheduleContext({
               actions: { refetch: refetch },
               context: {
@@ -124,7 +126,7 @@ export function ScheduleEventComponent({
             </Button>
           </Link>
         ) : null}
-      </div>
+      </Space>
     </div>
   );
 
@@ -162,6 +164,8 @@ export function ScheduleEventComponent({
 
   return (
     <Popover
+      visible={visible}
+      onVisibleChange={(vis) => setVisible(vis)}
       trigger="click"
       content={popoverContent}
       style={{ height: "100%", width: "100%" }}
diff --git a/client/src/components/parts-order-modal/parts-order-modal.component.jsx b/client/src/components/parts-order-modal/parts-order-modal.component.jsx
index a318f34f5..0508d444e 100644
--- a/client/src/components/parts-order-modal/parts-order-modal.component.jsx
+++ b/client/src/components/parts-order-modal/parts-order-modal.component.jsx
@@ -72,7 +72,7 @@ export default function PartsOrderModalComponent({
               {fields.map((field, index) => (
                 <Form.Item required={false} key={field.key}>
                   <div style={{ display: "flex", alignItems: "center" }}>
-                    <LayoutFormRow noDivider>
+                    <LayoutFormRow style={{ flex: 1 }} noDivider>
                       <Form.Item
                         label={t("parts_orders.fields.line_desc")}
                         key={`${index}line_desc`}