updates on the changes

This commit is contained in:
2026-08-17 17:14:51 +05:30
parent 809d046323
commit f037c4e45d
19 changed files with 74 additions and 97 deletions

View File

@@ -76,7 +76,7 @@ const LocationAutocomplete = forwardRef(({ locaName, setAppId, setLocoName, setP
}; };
return ( return (
<div ref={wrapRef} style={{ width }}> <div ref={wrapRef} style={{ width, maxWidth: '100%' }}>
<Selector <Selector
label="Zone" label="Zone"
isLabelHidden isLabelHidden

View File

@@ -158,7 +158,7 @@ const AppUsers = () => {
</Text> </Text>
</HStack> </HStack>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -174,7 +174,7 @@ const AppUsers = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Name</TableHeaderCell> <TableHeaderCell>Name</TableHeaderCell>
<TableHeaderCell>Email</TableHeaderCell> <TableHeaderCell>Email</TableHeaderCell>
<TableHeaderCell>Phone</TableHeaderCell> <TableHeaderCell>Phone</TableHeaderCell>

View File

@@ -323,7 +323,7 @@ const ClientsPricing = () => {
</VStack> </VStack>
</HStack> </HStack>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -414,20 +414,20 @@ const ClientsPricing = () => {
</MobileCardList> </MobileCardList>
) )
) : ( ) : (
<TableScroll minWidth={1180}> <TableScroll minWidth={1260}>
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Tenant</TableHeaderCell> <TableHeaderCell style={{ minWidth: 240 }}>Tenant</TableHeaderCell>
<TableHeaderCell>Zone</TableHeaderCell> <TableHeaderCell style={{ minWidth: 160 }}>Zone</TableHeaderCell>
<TableHeaderCell>Vehicle</TableHeaderCell> <TableHeaderCell style={{ minWidth: 100 }}>Vehicle</TableHeaderCell>
<TableHeaderCell>Base Price</TableHeaderCell> <TableHeaderCell style={{ minWidth: 120 }}>Base Price</TableHeaderCell>
<TableHeaderCell>Price / KM</TableHeaderCell> <TableHeaderCell style={{ minWidth: 120 }}>Price / KM</TableHeaderCell>
<TableHeaderCell>Price / KG</TableHeaderCell> <TableHeaderCell style={{ minWidth: 120 }}>Price / KG</TableHeaderCell>
<TableHeaderCell>Handling</TableHeaderCell> <TableHeaderCell style={{ minWidth: 100 }}>Handling</TableHeaderCell>
<TableHeaderCell>Status</TableHeaderCell> <TableHeaderCell style={{ minWidth: 100 }}>Status</TableHeaderCell>
<TableHeaderCell>Actions</TableHeaderCell> <TableHeaderCell style={{ minWidth: 100 }}>Actions</TableHeaderCell>
</TableRow> </TableRow>
</TableHeader> </TableHeader>
@@ -448,7 +448,7 @@ const ClientsPricing = () => {
<TableRow key={row.pricingid || `${row.tenantid}-${index}`}> <TableRow key={row.pricingid || `${row.tenantid}-${index}`}>
<TableCell> <TableCell>
<Text type="supporting" weight="bold" color="secondary"> <Text type="supporting" weight="bold" color="secondary">
{String(index + 1).padStart(2, '0')} {index + 1}
</Text> </Text>
</TableCell> </TableCell>

View File

@@ -487,7 +487,7 @@ const PricingTable = ({ list }) => (
<Table density="balanced" dividers="rows"> <Table density="balanced" dividers="rows">
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Vehicle</TableHeaderCell> <TableHeaderCell>Vehicle</TableHeaderCell>
<TableHeaderCell>Base Price</TableHeaderCell> <TableHeaderCell>Base Price</TableHeaderCell>
<TableHeaderCell>Price/Km</TableHeaderCell> <TableHeaderCell>Price/Km</TableHeaderCell>
@@ -1133,7 +1133,7 @@ const Clients1 = () => {
})} })}
</TabList> </TabList>
<VStack width={280} padding={0} gap={0}> <VStack maxWidth={280} width="100%" padding={0} gap={0}>
<DebounceSearchBar value={searchword} onChange={setSearchword} onDebouncedChange={setDebouncedSearch} /> <DebounceSearchBar value={searchword} onChange={setSearchword} onDebouncedChange={setDebouncedSearch} />
</VStack> </VStack>
</HStack> </HStack>
@@ -1144,7 +1144,7 @@ const Clients1 = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Status</TableHeaderCell> <TableHeaderCell>Status</TableHeaderCell>
<TableHeaderCell>Client</TableHeaderCell> <TableHeaderCell>Client</TableHeaderCell>
<TableHeaderCell>Contact</TableHeaderCell> <TableHeaderCell>Contact</TableHeaderCell>

View File

@@ -264,7 +264,7 @@ const CompetitiveIntel = () => {
<TableHeader> <TableHeader>
{tab === 'branches' ? ( {tab === 'branches' ? (
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Company</TableHeaderCell> <TableHeaderCell>Company</TableHeaderCell>
<TableHeaderCell>Area</TableHeaderCell> <TableHeaderCell>Area</TableHeaderCell>
<TableHeaderCell>Phone</TableHeaderCell> <TableHeaderCell>Phone</TableHeaderCell>
@@ -274,7 +274,7 @@ const CompetitiveIntel = () => {
</TableRow> </TableRow>
) : ( ) : (
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Company</TableHeaderCell> <TableHeaderCell>Company</TableHeaderCell>
<TableHeaderCell>Weight Slab</TableHeaderCell> <TableHeaderCell>Weight Slab</TableHeaderCell>
<TableHeaderCell>Zone</TableHeaderCell> <TableHeaderCell>Zone</TableHeaderCell>

View File

@@ -203,7 +203,7 @@ const Customers = () => {
</VStack> </VStack>
</HStack> </HStack>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -268,7 +268,7 @@ const Customers = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Customer</TableHeaderCell> <TableHeaderCell>Customer</TableHeaderCell>
<TableHeaderCell>Contact</TableHeaderCell> <TableHeaderCell>Contact</TableHeaderCell>
<TableHeaderCell>Bookings</TableHeaderCell> <TableHeaderCell>Bookings</TableHeaderCell>

View File

@@ -1345,7 +1345,7 @@ const Deliveries = () => {
<Table density="compact" dividers="rows"> <Table density="compact" dividers="rows">
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Item</TableHeaderCell> <TableHeaderCell>Item</TableHeaderCell>
<TableHeaderCell>Category</TableHeaderCell> <TableHeaderCell>Category</TableHeaderCell>
<TableHeaderCell style={{ textAlign: 'right' }}>Weight</TableHeaderCell> <TableHeaderCell style={{ textAlign: 'right' }}>Weight</TableHeaderCell>
@@ -1545,7 +1545,7 @@ const Deliveries = () => {
hasDivider={false} hasDivider={false}
/> />
<HStack gap={2} vAlign="center"> <HStack gap={2} vAlign="center">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar value={searchword} onChange={setSearchword} onDebouncedChange={setDebouncedSearch} /> <DebounceSearchBar value={searchword} onChange={setSearchword} onDebouncedChange={setDebouncedSearch} />
</VStack> </VStack>
@@ -1781,7 +1781,7 @@ const Deliveries = () => {
key={header.id} key={header.id}
scope="col" scope="col"
aria-sort={sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : canSort ? 'none' : undefined} aria-sort={sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : canSort ? 'none' : undefined}
style={{ width: header.getSize(), textAlign: align, position: 'relative' }} style={{ width: header.getSize(), minWidth: header.column.columnDef.minSize, maxWidth: header.column.columnDef.maxSize || header.getSize(), textAlign: align, position: 'relative' }}
> >
<HStack <HStack
gap={1} gap={1}

View File

@@ -151,7 +151,7 @@ const Exceptions = () => {
</Text> </Text>
</HStack> </HStack>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -167,7 +167,7 @@ const Exceptions = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Consignment</TableHeaderCell> <TableHeaderCell>Consignment</TableHeaderCell>
<TableHeaderCell>Hub</TableHeaderCell> <TableHeaderCell>Hub</TableHeaderCell>
<TableHeaderCell>Type</TableHeaderCell> <TableHeaderCell>Type</TableHeaderCell>

View File

@@ -184,7 +184,7 @@ const Hubs = () => {
</Text> </Text>
</HStack> </HStack>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -200,7 +200,7 @@ const Hubs = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Hub Name</TableHeaderCell> <TableHeaderCell>Hub Name</TableHeaderCell>
<TableHeaderCell>Type</TableHeaderCell> <TableHeaderCell>Type</TableHeaderCell>
<TableHeaderCell>City</TableHeaderCell> <TableHeaderCell>City</TableHeaderCell>

View File

@@ -411,7 +411,7 @@ const OrdersPreview = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
{aiMode == 1 && <TableHeaderCell>Zone</TableHeaderCell>} {aiMode == 1 && <TableHeaderCell>Zone</TableHeaderCell>}
<TableHeaderCell>Tenant</TableHeaderCell> <TableHeaderCell>Tenant</TableHeaderCell>
<TableHeaderCell>Order Location</TableHeaderCell> <TableHeaderCell>Order Location</TableHeaderCell>

View File

@@ -1047,7 +1047,7 @@ const MultipleOrders = () => {
<Table density="compact" dividers="rows" hasHover> <Table density="compact" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Customer</TableHeaderCell> <TableHeaderCell>Customer</TableHeaderCell>
<TableHeaderCell>Address</TableHeaderCell> <TableHeaderCell>Address</TableHeaderCell>
<TableHeaderCell style={{ textAlign: 'center' }}>Qty</TableHeaderCell> <TableHeaderCell style={{ textAlign: 'center' }}>Qty</TableHeaderCell>
@@ -1159,7 +1159,7 @@ const MultipleOrders = () => {
<Table density="compact" dividers="rows" hasHover> <Table density="compact" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Name</TableHeaderCell> <TableHeaderCell>Name</TableHeaderCell>
<TableHeaderCell>Contact</TableHeaderCell> <TableHeaderCell>Contact</TableHeaderCell>
<TableHeaderCell>Address</TableHeaderCell> <TableHeaderCell>Address</TableHeaderCell>

View File

@@ -533,8 +533,8 @@ const Orders = () => {
}, },
{ {
id: 'serial', id: 'serial',
size: 50, size: 30,
minSize: 44, minSize: 20,
enableSorting: false, enableSorting: false,
meta: { label: '#' }, meta: { label: '#' },
header: () => <SectionLabel>#</SectionLabel>, header: () => <SectionLabel>#</SectionLabel>,
@@ -590,8 +590,8 @@ const Orders = () => {
{ {
id: 'pickup', id: 'pickup',
accessorKey: 'pickupaddress', accessorKey: 'pickupaddress',
size: 280, size: 320,
minSize: 220, minSize: 260,
meta: { label: 'Pickup' }, meta: { label: 'Pickup' },
header: () => <SectionLabel>Pickup</SectionLabel>, header: () => <SectionLabel>Pickup</SectionLabel>,
cell: ({ getValue, row }) => ( cell: ({ getValue, row }) => (
@@ -605,8 +605,8 @@ const Orders = () => {
const customer = customerMap?.get(row.appcustomerid); const customer = customerMap?.get(row.appcustomerid);
return customer?.firstname || customer?.name || `Customer #${row.appcustomerid ?? '—'}`; return customer?.firstname || customer?.name || `Customer #${row.appcustomerid ?? '—'}`;
}, },
size: 320, size: 360,
minSize: 240, minSize: 280,
meta: { label: 'Drop' }, meta: { label: 'Drop' },
header: () => <SectionLabel>Drop</SectionLabel>, header: () => <SectionLabel>Drop</SectionLabel>,
cell: ({ getValue, row }) => { cell: ({ getValue, row }) => {
@@ -957,7 +957,7 @@ const Orders = () => {
whole toolbar — filter tabs, search, column visibility — whole toolbar — filter tabs, search, column visibility —
reads as one control strip instead of two stacked rows. */} reads as one control strip instead of two stacked rows. */}
<HStack gap={2} vAlign="center"> <HStack gap={2} vAlign="center">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -1032,7 +1032,7 @@ const Orders = () => {
// readers announce the column's sort state from // readers announce the column's sort state from
// here, not from the clickable content inside. // here, not from the clickable content inside.
aria-sort={sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : canSort ? 'none' : undefined} aria-sort={sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : canSort ? 'none' : undefined}
style={{ width: header.getSize(), textAlign: align, position: 'relative' }} style={{ width: header.getSize(), minWidth: header.column.columnDef.minSize, maxWidth: header.column.columnDef.maxSize || header.getSize(), textAlign: align, position: 'relative' }}
> >
<HStack <HStack
gap={1} gap={1}
@@ -1160,7 +1160,7 @@ const Orders = () => {
{row.getVisibleCells().map((cell) => ( {row.getVisibleCells().map((cell) => (
<TableCell <TableCell
key={cell.id} key={cell.id}
style={{ textAlign: cell.column.columnDef.meta?.align }} style={{ textAlign: cell.column.columnDef.meta?.align, maxWidth: cell.column.columnDef.maxSize || cell.column.getSize() }}
onClick={cell.column.id === 'select' ? (e) => e.stopPropagation() : undefined} onClick={cell.column.id === 'select' ? (e) => e.stopPropagation() : undefined}
> >
{flexRender(cell.column.columnDef.cell, cell.getContext())} {flexRender(cell.column.columnDef.cell, cell.getContext())}

View File

@@ -513,7 +513,7 @@ export default function OrdersDetails() {
{/* Toolbar: Zone · Tenant · Location · Rider · Date · Search. */} {/* Toolbar: Zone · Tenant · Location · Rider · Date · Search. */}
<DataCard <DataCard
toolbar={ toolbar={
<FilterToolbar> <FilterToolbar max={5} minWidth={200}>
<LocationAutocomplete <LocationAutocomplete
locaName={locaName} locaName={locaName}
setAppId={setAppId} setAppId={setAppId}
@@ -611,7 +611,7 @@ export default function OrdersDetails() {
size="sm" size="sm"
hasDivider={false} hasDivider={false}
/> />
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -806,7 +806,7 @@ export default function OrdersDetails() {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Map</TableHeaderCell> <TableHeaderCell>Map</TableHeaderCell>
<TableHeaderCell>Client</TableHeaderCell> <TableHeaderCell>Client</TableHeaderCell>
<TableHeaderCell>Pickup</TableHeaderCell> <TableHeaderCell>Pickup</TableHeaderCell>

View File

@@ -405,7 +405,7 @@ export default function OrdersReport() {
larger, riskier change than this pass's chrome scope. */} larger, riskier change than this pass's chrome scope. */}
<DataCard <DataCard
toolbar={ toolbar={
<FilterToolbar> <FilterToolbar max={4} minWidth={200}>
<Button <Button
label={`${datestatus} · ${dayjs(startdate).format('DD/MM/YY')}–${dayjs(enddate).format('DD/MM/YY')}`} label={`${datestatus} · ${dayjs(startdate).format('DD/MM/YY')}–${dayjs(enddate).format('DD/MM/YY')}`}
variant="secondary" variant="secondary"
@@ -456,7 +456,7 @@ export default function OrdersReport() {
/> />
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}

View File

@@ -320,29 +320,16 @@ export default function RidersSummary() {
pair search with. */} pair search with. */}
<DataCard <DataCard
toolbar={ toolbar={
<FilterToolbar max={2}> <FilterToolbar max={1}>
<HStack gap={2} vAlign="center"> <HStack gap={2} vAlign="center" justify="end">
<AccentAvatar color={BRAND} size={32}>
<MdDirectionsBike size={18} />
</AccentAvatar>
<VStack gap={0} padding={0}>
<Text type="label" weight="bold" color="secondary" style={{ letterSpacing: 0.6, textTransform: 'uppercase' }}>
Orders · {datestatus}
</Text>
<Text weight="bold">
{filteredRows.length} riders · {stats.orders} orders
</Text>
</VStack>
<Button <Button
label={`${dayjs(startdate).format('DD/MM/YY')} – ${dayjs(enddate).format('DD/MM/YY')}`} label={`${datestatus} · ${dayjs(startdate).format('DD/MM/YY')}–${dayjs(enddate).format('DD/MM/YY')}`}
variant="secondary" variant="secondary"
size="sm" size="sm"
icon={<MdCalendarMonth size={14} />} icon={<MdCalendarMonth size={14} />}
onClick={() => setOpen(true)} onClick={() => setOpen(true)}
/> />
</HStack> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<HStack justify="end">
<VStack width={260} padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -451,7 +438,7 @@ export default function RidersSummary() {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Rider</TableHeaderCell> <TableHeaderCell>Rider</TableHeaderCell>
<TableHeaderCell>Orders</TableHeaderCell> <TableHeaderCell>Orders</TableHeaderCell>
<TableHeaderCell>Accepted</TableHeaderCell> <TableHeaderCell>Accepted</TableHeaderCell>

View File

@@ -269,7 +269,7 @@ export default function RiderSubstitution({
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>ID</TableHeaderCell> <TableHeaderCell>ID</TableHeaderCell>
<TableHeaderCell>Rider</TableHeaderCell> <TableHeaderCell>Rider</TableHeaderCell>
<TableHeaderCell style={{ textAlign: 'center' }}></TableHeaderCell> <TableHeaderCell style={{ textAlign: 'center' }}></TableHeaderCell>

View File

@@ -535,7 +535,7 @@ const Riders = () => {
toolbar={ toolbar={
<FilterToolbar max={tabvalue === 3 ? 3 : 1}> <FilterToolbar max={tabvalue === 3 ? 3 : 1}>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -804,19 +804,14 @@ const Riders = () => {
</HStack> </HStack>
{roleid == 1 && <RowActions row={row} expanded={expanded} />} {roleid == 1 && <RowActions row={row} expanded={expanded} />}
</HStack> </HStack>
<HStack gap={1.5} vAlign="center"> <VStack gap={0} padding={0} minWidth={0}>
<AccentAvatar color={BRAND} selected size={36}> <Text weight="bold" maxLines={1}>
<Text weight="bold">{(row.displayname || row.authname || '?').charAt(0).toUpperCase()}</Text> {row.displayname || row.authname || '—'}
</AccentAvatar> </Text>
<VStack gap={0} padding={0} minWidth={0}> <Text type="supporting" color="secondary" maxLines={1}>
<Text weight="bold" maxLines={1}> {row.phone || '—'}
{row.displayname || row.authname || '—'} </Text>
</Text> </VStack>
<Text type="supporting" color="secondary" maxLines={1}>
{row.phone || '—'}
</Text>
</VStack>
</HStack>
</VStack> </VStack>
} }
> >
@@ -882,7 +877,7 @@ const Riders = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>ID</TableHeaderCell> <TableHeaderCell>ID</TableHeaderCell>
<TableHeaderCell>Rider</TableHeaderCell> <TableHeaderCell>Rider</TableHeaderCell>
<TableHeaderCell>Address</TableHeaderCell> <TableHeaderCell>Address</TableHeaderCell>
@@ -944,19 +939,14 @@ const Riders = () => {
</div> </div>
</TableCell> </TableCell>
<TableCell> <TableCell>
<HStack gap={1.5} vAlign="center"> <VStack gap={0} padding={0} minWidth={0}>
<AccentAvatar color={BRAND} selected size={36}> <Text weight="semibold" style={{ whiteSpace: 'nowrap' }}>
<Text weight="bold">{(row.displayname || row.authname || '?').charAt(0).toUpperCase()}</Text> {row.displayname || row.authname || '—'}
</AccentAvatar> </Text>
<VStack gap={0} padding={0} minWidth={0}> <Text type="supporting" color="secondary">
<Text weight="semibold" style={{ whiteSpace: 'nowrap' }}> {row.phone || '—'}
{row.displayname || row.authname || '—'} </Text>
</Text> </VStack>
<Text type="supporting" color="secondary">
{row.phone || '—'}
</Text>
</VStack>
</HStack>
</TableCell> </TableCell>
<TableCell style={{ maxWidth: 220 }}> <TableCell style={{ maxWidth: 220 }}>
<Tooltip content={row.address || ''}> <Tooltip content={row.address || ''}>

View File

@@ -154,7 +154,7 @@ const Tripsheets = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Source Hub</TableHeaderCell> <TableHeaderCell>Source Hub</TableHeaderCell>
<TableHeaderCell>Destination Hub</TableHeaderCell> <TableHeaderCell>Destination Hub</TableHeaderCell>
<TableHeaderCell>Status</TableHeaderCell> <TableHeaderCell>Status</TableHeaderCell>

View File

@@ -176,7 +176,7 @@ const Vehicles = () => {
</Text> </Text>
</HStack> </HStack>
<HStack justify="end"> <HStack justify="end">
<VStack width={260} padding={0} gap={0}> <VStack maxWidth={260} width="100%" padding={0} gap={0}>
<DebounceSearchBar <DebounceSearchBar
value={searchword} value={searchword}
onChange={setSearchword} onChange={setSearchword}
@@ -192,7 +192,7 @@ const Vehicles = () => {
<Table density="balanced" dividers="rows" hasHover> <Table density="balanced" dividers="rows" hasHover>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHeaderCell>#</TableHeaderCell> <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
<TableHeaderCell>Vehicle No</TableHeaderCell> <TableHeaderCell>Vehicle No</TableHeaderCell>
<TableHeaderCell>Type</TableHeaderCell> <TableHeaderCell>Type</TableHeaderCell>
<TableHeaderCell>Partner</TableHeaderCell> <TableHeaderCell>Partner</TableHeaderCell>