From fd3eb8227aabecf2b9d322bd954ba205de99f873 Mon Sep 17 00:00:00 2001
From: tonyco97 <tonyco97.tc@gmail.com>
Date: Wed, 30 Aug 2023 17:04:18 +0200
Subject: [PATCH] Fixed wrong dark theme and UI inside monitor tab

---
 components/layout/UserLastCalls.tsx         |  5 ++---
 components/queueManager/Monitor/Monitor.tsx | 18 ++++++++++--------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/components/layout/UserLastCalls.tsx b/components/layout/UserLastCalls.tsx
index 86462d68..dfbffe0b 100644
--- a/components/layout/UserLastCalls.tsx
+++ b/components/layout/UserLastCalls.tsx
@@ -23,8 +23,7 @@ import { useEventListener } from '../../lib/hooks/useEventListener'
 import { isEmpty } from 'lodash'
 
 interface LastCallTypes extends CallTypes {
-  avatar?: string
-  presence?: StatusTypes | undefined
+  username: string
 }
 
 type LastCallsTypes = LastCallTypes[]
@@ -193,7 +192,7 @@ export const UserLastCalls = () => {
             )}
             {/* Iterate through speed dial list */}
             {lastCalls?.length! > 0 &&
-              lastCalls?.map((call: any, key: any) => (
+              lastCalls?.map((call, key) => (
                 <li key={key}>
                   <div className='group relative flex items-center py-6 px-5'>
                     <div
diff --git a/components/queueManager/Monitor/Monitor.tsx b/components/queueManager/Monitor/Monitor.tsx
index 16def58d..613fb13f 100644
--- a/components/queueManager/Monitor/Monitor.tsx
+++ b/components/queueManager/Monitor/Monitor.tsx
@@ -162,20 +162,22 @@ export const Monitor: FC<MonitorProps> = ({ className }): JSX.Element => {
       <div
         className={`transition-all duration-300 ${
           isFullscreen
-            ? 'fixed top-0 left-0 right-0 bottom-0 w-screen h-screen z-50 bg-white overflow-auto'
+            ? 'fixed top-0 left-0 right-0 bottom-0 w-screen h-screen z-50 bg-white dark:bg-gray-800 overflow-auto'
             : ''
         }`}
       >
         <div>
           {/* Card section */}
-          <div>
+          <div className='flex flex-col'>
             {isFullscreen && (
-              <Button variant='ghost' onClick={() => setIsFullscreen(false)}>
-                <FontAwesomeIcon
-                  className='h-5 w-5 cursor-pointer dark:text-gray-200 text-gray-700'
-                  icon={faXmark}
-                />
-              </Button>
+              <div className='flex justify-end'>
+                <Button variant='ghost' className='w-8 h-8' onClick={() => setIsFullscreen(false)}>
+                  <FontAwesomeIcon
+                    className='h-5 w-5 cursor-pointer dark:text-gray-200 text-gray-700'
+                    icon={faXmark}
+                  />
+                </Button>
+              </div>
             )}
             <MonitorTables isFullscreen={isFullscreen} selectedRow={selected}></MonitorTables>
           </div>