updates on the astryx desing

This commit is contained in:
2026-08-14 16:09:14 +05:30
parent d3dd687a8d
commit a46212f291
106 changed files with 10244 additions and 24738 deletions

View File

@@ -1,5 +1,5 @@
import React, { useMemo, useState } from 'react';
import { MdDirectionsCar, MdEdit, MdDeleteOutline, MdAdd, MdBatteryStd } from 'react-icons/md';
import { MdDirectionsCar, MdEdit, MdDeleteOutline, MdAdd, MdBatteryStd, MdBatteryFull } from 'react-icons/md';
import { Grid } from '@astryxdesign/core/Grid';
import { HStack } from '@astryxdesign/core/HStack';
@@ -69,7 +69,8 @@ const Vehicles = () => {
// of 'active', so counting against that string always read 0.
const active = vehicles.filter((v) => String(v.status).toLowerCase() === 'available').length;
const lowBattery = vehicles.filter((v) => Number(v.batterypercentage) > 0 && Number(v.batterypercentage) < 20).length;
return { total, active, lowBattery };
const fullBattery = vehicles.filter((v) => Number(v.batterypercentage) >= 80).length;
return { total, active, lowBattery, fullBattery };
}, [vehicles]);
const opentoast = (message, variant = 'error') =>
@@ -156,10 +157,11 @@ const Vehicles = () => {
action={<Button label="New Vehicle" variant="primary" icon={<MdAdd size={16} />} onClick={openCreate} />}
/>
<Grid columns={{ minWidth: 220 }} gap={3}>
<Grid columns={{ minWidth: 200, max: 4, repeat: 'fit' }} gap={3}>
<StatCard title="Total Vehicles" value={stats.total} icon={<MdDirectionsCar size={20} />} color={BRAND} />
<StatCard title="Available" value={stats.active} icon={<MdDirectionsCar size={20} />} color={STATUS.delivered} />
<StatCard title="Low Battery" value={stats.lowBattery} icon={<MdBatteryStd size={20} />} color={STATUS.pending} />
<StatCard title="Full Battery" value={stats.fullBattery} icon={<MdBatteryFull size={20} />} color={STATUS.active} />
</Grid>
<VStack gap={0} padding={0} style={{ marginTop: 16 }}>