From 69791a3cdd8abc0b112d84bceca58b260f4b7050 Mon Sep 17 00:00:00 2001
From: Dave Richer <dave@imexsystems.ca>
Date: Wed, 17 Jan 2024 00:19:51 -0500
Subject: [PATCH] - Fix spacing on so me alerts

Signed-off-by: Dave Richer <dave@imexsystems.ca>
---
 .../src/components/alert/alert.component.jsx  |  2 +-
 .../schedule-calendar-header.component.js     |  1 -
 .../scheduler-calendar-wrapper.component.jsx  | 88 ++++++++++---------
 3 files changed, 49 insertions(+), 42 deletions(-)

diff --git a/client/src/components/alert/alert.component.jsx b/client/src/components/alert/alert.component.jsx
index f02edd614..9d054c45f 100644
--- a/client/src/components/alert/alert.component.jsx
+++ b/client/src/components/alert/alert.component.jsx
@@ -2,5 +2,5 @@ import { Alert } from "antd";
 import React from "react";
 
 export default function AlertComponent(props) {
-  return <Alert {...props} />;
+  return <Alert  {...props} />;
 }
diff --git a/client/src/components/schedule-calendar-wrapper/schedule-calendar-header.component.js b/client/src/components/schedule-calendar-wrapper/schedule-calendar-header.component.js
index 0b85d7212..cfd09aec3 100644
--- a/client/src/components/schedule-calendar-wrapper/schedule-calendar-header.component.js
+++ b/client/src/components/schedule-calendar-wrapper/schedule-calendar-header.component.js
@@ -37,7 +37,6 @@ export function ScheduleCalendarHeaderComponent({
   events,
   ...otherProps
 }) {
-  console.log(`ScheduleCalendarHeaderComponent: ${label} Calculating: ${calculating}`)
   const ATSToday = useMemo(() => {
     if (!events) return [];
     return _.groupBy(
diff --git a/client/src/components/schedule-calendar-wrapper/scheduler-calendar-wrapper.component.jsx b/client/src/components/schedule-calendar-wrapper/scheduler-calendar-wrapper.component.jsx
index 298b2eae8..7f5781de8 100644
--- a/client/src/components/schedule-calendar-wrapper/scheduler-calendar-wrapper.component.jsx
+++ b/client/src/components/schedule-calendar-wrapper/scheduler-calendar-wrapper.component.jsx
@@ -11,7 +11,7 @@ import HeaderComponent from "./schedule-calendar-header.component";
 import "./schedule-calendar.styles.scss";
 import JobDetailCards from "../job-detail-cards/job-detail-cards.component";
 import { selectProblemJobs } from "../../redux/application/application.selectors";
-import { Alert, Collapse } from "antd";
+import {Alert, Collapse, Space} from "antd";
 import { useTranslation, Trans } from "react-i18next";
 import { Link } from "react-router-dom";
 
@@ -55,57 +55,65 @@ export function ScheduleCalendarWrapperComponent({
     <>
       <JobDetailCards />
       {problemJobs && problemJobs.length > 2 ? (
-        <Collapse>
+        <Collapse style={{marginBottom: '5px'}}>
           <Collapse.Panel
+            key="1"
             header={
               <span style={{ color: "tomato" }}>
                 {t("appointments.labels.severalerrorsfound")}
               </span>
             }
           >
-            {problemJobs.map((problem) => (
-              <Alert
-                key={problem.id}
-                type="error"
-                message={
-                  <Trans
-                    i18nKey="appointments.labels.dataconsistency"
-                    components={[
-                      <Link
-                        to={`/manage/jobs/${problem.id}`}
-                        target="_blank"
-                      />,
-                    ]}
-                    values={{
-                      ro_number: problem.ro_number,
-                      code: problem.code,
-                    }}
+            <Space direction="vertical" style={{ width: '100%' }}>
+              {problemJobs.map((problem) => (
+                  <Alert
+                      key={problem.id}
+                      type="error"
+                      message={
+                        <Trans
+                            i18nKey="appointments.labels.dataconsistency"
+                            components={[
+                              <Link
+                                  to={`/manage/jobs/${problem.id}`}
+                                  target="_blank"
+                              />,
+                            ]}
+                            values={{
+                              ro_number: problem.ro_number,
+                              code: problem.code,
+                            }}
+                        />
+                      }
                   />
-                }
-              />
-            ))}
+              ))}
+            </Space>
+
           </Collapse.Panel>
         </Collapse>
       ) : (
-        problemJobs.map((problem) => (
-          <Alert
-            key={problem.id}
-            type="error"
-            message={
-              <Trans
-                i18nKey="appointments.labels.dataconsistency"
-                components={[
-                  <Link to={`/manage/jobs/${problem.id}`} target="_blank" />,
-                ]}
-                values={{
-                  ro_number: problem.ro_number,
-                  code: problem.code,
-                }}
-              />
+          <Space direction="vertical" style={{ width: '100%', marginBottom: '5px' }}>
+            {
+              problemJobs.map((problem) => (
+                  <Alert
+                      key={problem.id}
+                      type="error"
+                      message={
+                        <Trans
+                            i18nKey="appointments.labels.dataconsistency"
+                            components={[
+                              <Link to={`/manage/jobs/${problem.id}`} target="_blank"/>,
+                            ]}
+                            values={{
+                              ro_number: problem.ro_number,
+                              code: problem.code,
+                            }}
+                        />
+                      }
+                  />
+              ))
             }
-          />
-        ))
-      )}
+          </Space>
+          )}
 
       <Calendar
         events={data}