From e987b0028c496417b4ca7633a661e5b684c2bc87 Mon Sep 17 00:00:00 2001
From: Dobromir Popov <dobromir.popov@gateway.one>
Date: Sat, 11 May 2024 22:26:29 +0300
Subject: [PATCH] fix confirmation modal on top of other confirmation modal

---
 components/ConfirmationModal.tsx |  4 ++--
 pages/api/index.ts               | 10 ++++------
 pages/cart/reports/coverMe.tsx   | 32 +++++++++++++++++++++++++-------
 styles/styles.css                | 22 ++++++++++++++++++++--
 4 files changed, 51 insertions(+), 17 deletions(-)

diff --git a/components/ConfirmationModal.tsx b/components/ConfirmationModal.tsx
index 787be29..1900155 100644
--- a/components/ConfirmationModal.tsx
+++ b/components/ConfirmationModal.tsx
@@ -5,8 +5,8 @@ export default function ConfirmationModal({ isOpen, onClose, onConfirm, message
   if (!isOpen) return null;
 
   return (
-    <div className="opacity-100 fixed inset-0 flex items-center justify-center z-1002" >
-      <div className="bg-white p-4 rounded-md shadow-lg modal-content" style={{ zIndex: 1002 }}>
+    <div className="modal-container opacity-100 inset-0 flex items-center justify-center z-1152" >
+      <div className="bg-white p-4 rounded-md shadow-lg modal-content">
         <p className="mb-4">{message}</p>
         <button
           className="bg-red-500 text-white px-4 py-2 rounded mr-2"
diff --git a/pages/api/index.ts b/pages/api/index.ts
index 217f1c5..330c407 100644
--- a/pages/api/index.ts
+++ b/pages/api/index.ts
@@ -835,8 +835,8 @@ async function replaceInAssignment(oldPublisherId, newPublisherId, shiftId) {
     where: {
       id: shiftId
     },
-    select: {
-      startTime: true,
+
+    include: {
       cartEvent: {
         select: {
           location: {
@@ -845,9 +845,7 @@ async function replaceInAssignment(oldPublisherId, newPublisherId, shiftId) {
             }
           }
         }
-      }
-    },
-    include: {
+      },
       assignments: {
         include: {
           publisher: {
@@ -880,7 +878,7 @@ async function replaceInAssignment(oldPublisherId, newPublisherId, shiftId) {
       publisher: { connect: { id: oldPublisherId } },
       shift: { connect: { id: shiftId } },
       type: EventLogType.AssignmentReplacementManual,
-      content: "Въведено заместване от " + originalPublisher.firstName + " " + originalPublisher.lastName + ". Ще го замества " + newPublisher.firstName + " " + newPublisher.lastName + "."
+      content: "Заместване въведено от " + originalPublisher.firstName + " " + originalPublisher.lastName + ". Ще го замества " + newPublisher.firstName + " " + newPublisher.lastName + "."
 
     }
   });
diff --git a/pages/cart/reports/coverMe.tsx b/pages/cart/reports/coverMe.tsx
index b90a0d5..0084e85 100644
--- a/pages/cart/reports/coverMe.tsx
+++ b/pages/cart/reports/coverMe.tsx
@@ -25,7 +25,17 @@ export default function EventLogList() {
     useEffect(() => {
         const fetchLocations = async () => {
             try {
-                const { data: eventLogsData } = await axiosInstance.get(`/api/data/prisma/eventLog?where={"type":"${EventLogType.AssignmentReplacementAccepted}"}&include={"publisher":{"select":{"firstName":true,"lastName":true}},"shift":{"include":{"assignments":{"include":{"publisher":{"select":{"firstName":true,"lastName":true}}}}}}}`);
+                const { data: eventLogsDataold } = await axiosInstance.get(`/api/data/prisma/eventLog?where={"type":"${EventLogType.AssignmentReplacementAccepted}"}&include={"publisher":{"select":{"firstName":true,"lastName":true}},"shift":{"include":{"assignments":{"include":{"publisher":{"select":{"firstName":true,"lastName":true}}}}}}}`);
+
+                // const where = encodeURIComponent(`{OR: [{type: "${EventLogType.AssignmentReplacementAccepted}"}, {type: "${EventLogType.AssignmentReplacementManual}"}]}`);
+                const where = encodeURIComponent(JSON.stringify({
+                    OR: [
+                        { type: EventLogType.AssignmentReplacementAccepted },
+                        { type: EventLogType.AssignmentReplacementManual }
+                    ]
+                }));
+
+                const { data: eventLogsData } = await axiosInstance.get(`/api/data/prisma/eventLog?where=${where}&include={"publisher":{"select":{"firstName":true,"lastName":true}},"shift":{"include":{"assignments":{"include":{"publisher":{"select":{"firstName":true,"lastName":true}}}}}}}`);
 
                 setEventLog(eventLogsData);
 
@@ -40,6 +50,9 @@ export default function EventLogList() {
             fetchLocations();
         }
     }, []);
+
+
+
     return (
         <Layout>
             <ProtectedRoute allowedRoles={[UserRole.POWERUSER, UserRole.ADMIN]}>
@@ -67,15 +80,18 @@ export default function EventLogList() {
                             <table className="w-full table-auto">
                                 <thead>
                                     <tr>
+                                        <th className="px-4 py-2 text-left">На</th>
                                         <th className="px-4 py-2 text-left">От</th>
                                         <th className="px-4 py-2 text-left">Дата</th>
                                         <th className="px-4 py-2 text-left">Смяна</th>
-                                        <th className="px-4 py-2 text-left">Действия</th>
+                                        <th className="px-4 py-2 text-left">Събитие</th>
+                                        {/* <th className="px-4 py-2 text-left">Действия</th> */}
                                     </tr>
                                 </thead>
                                 <tbody>
                                     {!showOpenRequests && (eventLogs.map((event) => (
                                         <tr key={event.id}>
+                                            <td className="border px-2 py-2">{new Date(event.date).toLocaleString('bg')}</td>
                                             <td className="border px-2 py-2">{event.publisher.firstName + " " + event.publisher.lastName}</td>
                                             <td className="border px-2 py-2">{new Date(event.shift?.startTime).toLocaleString('bg')}</td>
                                             <td className="border px-2 py-2">
@@ -86,17 +102,18 @@ export default function EventLogList() {
                                             <td className="border px-2 py-2">
                                                 {event.content}
                                             </td>
-                                            <td className="border px-4 py-2">
+                                            {/* <td className="border px-4 py-2">
                                                 <button
                                                     className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">
                                                     Изтрий
                                                 </button>
-                                            </td>
+                                            </td> */}
                                         </tr>
                                     ))
                                     )}
                                     {showOpenRequests && (requestedAssignments.map((assignment) => (
                                         <tr key={assignment.id}>
+                                            <td className="border px-2 py-2">{new Date(assignment.date).toLocaleString('bg')}</td>
                                             <td className="border px-2 py-2">{assignment.publisher.firstName + " " + assignment.publisher.lastName}</td>
                                             <td className="border px-2 py-2">{new Date(assignment.shift.startTime).toLocaleString('bg')}</td>
                                             <td className="border px-2 py-2">
@@ -104,12 +121,13 @@ export default function EventLogList() {
                                                     <div key={ass.id}>{ass.publisher.firstName + " " + ass.publisher.lastName}</div>
                                                 ))}
                                             </td>
-                                            <td className="border px-4 py-2">
+                                            {/* <td className="border px-4 py-2">
                                                 <button
-                                                    className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">
+                                                    className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
+                                                >
                                                     Изтрий
                                                 </button>
-                                            </td>
+                                            </td> */}
                                         </tr>
                                     ))
                                     )}
diff --git a/styles/styles.css b/styles/styles.css
index 6ef436b..b924acf 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -37,12 +37,30 @@ iframe {
   filter: invert(1);
 }
 
+.modal-container {
+  display: flex;
+  flex-direction: column-reverse; /* Newest first if new elements are prepended */
+}
 .modal-content {
-  z-index: 1002; /* or a higher value if necessary */
+  /* z-index: 1002; or a higher value if necessary */
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%); /* Center the modal */
+  z-index: 1051; /* Higher z-index than overlay */
+  background-color: #fff;
+  padding: 20px;
+  border-radius: 8px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  
+  z-index: 1051; /* High z-index */
 }
 
 .modal-overlay {
-  z-index: 1001;
+  position: fixed;
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
+  z-index: 1050; /* High z-index */
 }
 .publisher {
   position: relative;