TobaOjo/Aiq-Lite-UI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Refactored Dashboard layout

Browse Source 
- enhanced PlatesProcessed component display
This commit is contained in:
Toba Ojo
2026-01-09 08:50:03 +00:00
parent 97818ca8d9
commit 8d44444c4d
4 changed files with 23 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/features/dashboard/Dashboard.tsx
View File

@@ -15,7 +15,7 @@ const Dashboard = () => {
return (
<div>
<SystemOverview />
<div className="grid grid-cols-1 md:grid-cols-12 gap-2 md:gap-5">
<div className="grid grid-cols-1 md:grid-cols-12 gap-2 md:gap-5 mt-4">
<div className="col-span-7">
<VideoFeed mostRecentSighting={mostRecent} isLoading={isLoading} size={size} />
<PlateRead sighting={mostRecent} />

37
src/features/dashboard/SystemOverview/PlatesProcessed.tsx
View File

@@ -11,25 +11,30 @@ const PlatesProcessed = ({ platesProcessed }: PlatesProcessedProps) => {
const toastReceived = platesProcessed?.totalReceived || 0;
return (
<div className="grid grid-cols-2 gap-2">
<div>
<h4 className="text-md">Total Active</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-blue-500">{totalActive}</span>
</div>
<div>
<h4 className="text-md">Total Received</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-green-500">{toastReceived}</span>
</div>
<div>
<h4 className="text-md">Total Pending</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-amber-500">{totalPending}</span>
<>
<div className="flex flex-row items-center border-b border-gray-500">
<h3 className="text-lg ">Reads</h3>
</div>
<div className="grid grid-cols-2 gap-2">
<div>
<h4 className="text-md">Total Active</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-blue-500">{totalActive}</span>
</div>
<div>
<h4 className="text-md">Total Received</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-green-500">{toastReceived}</span>
</div>
<div>
<h4 className="text-md">Total Pending</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-amber-500">{totalPending}</span>
</div>
<div>
<h4 className="text-md">Total Failed</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-red-500">{totalFailed}</span>
<div>
<h4 className="text-md">Total Failed</h4>
<span className="bg-[#151b22] py-1 px-2 rounded-md font-bold text-red-500">{totalFailed}</span>
</div>
</div>
</div>
</>
);
};

1
src/features/dashboard/SystemOverview/SystemOverview.tsx
View File

@@ -28,7 +28,6 @@ const SystemOverview = () => {
<h3 className="text-lg">Active Sightings</h3>
</Card>
<Card className="p-4 hover:bg-[#233241] cursor-pointer">
<h3 className="text-lg">Reads</h3>
<PlatesProcessed platesProcessed={platesProcessed} />
</Card>
<Card className="p-4 hover:bg-[#233241] cursor-pointer">

4
src/features/dashboard/components/sightingStack/sightingItemModal/SightingModalContent.tsx
View File

@@ -51,9 +51,7 @@ const SightingModalContent = ({ sighting }: SightingModalContentProps) => {
</div>
</div>
</>
) : (
<p className="text-gray-300">No sighting data available.</p>
)}
) : null}
</div>
);
};