From 7992208361fe2f959315ef443cb707a51528f803 Mon Sep 17 00:00:00 2001
From: dharaneesh-r <dharaneesh@tenext.in>
Date: Sat, 19 Sep 2026 15:50:02 +0530
Subject: [PATCH] updates on the ui changes

---
 src/pages/doormile/appUsers/AppUsers.jsx      |  13 +-
 src/pages/doormile/bookings/Bookings.jsx      |  13 +-
 src/pages/doormile/clients/Tenants.jsx        |  11 +-
 .../competitiveIntel/CompetitiveIntel.jsx     |  11 +-
 src/pages/doormile/customers/Customers.jsx    |  15 +-
 src/pages/doormile/deliveries/Deliveries.jsx  | 174 +++++++++++-------
 src/pages/doormile/exceptions/Exceptions.jsx  |  13 +-
 src/pages/doormile/hubs/Hubs.jsx              |  13 +-
 src/pages/doormile/orders/Orders.jsx          |  33 ++--
 src/pages/doormile/orders/OrdersPreview.jsx   |  28 ++-
 src/pages/doormile/pricing/Pricing.jsx        |  23 +--
 src/pages/doormile/reports/OrdersDetails.jsx  |  38 ++--
 src/pages/doormile/reports/OrdersSummary.jsx  |  38 ++--
 src/pages/doormile/reports/RidersSummary.jsx  |  38 ++--
 src/pages/doormile/riders/Riders.jsx          |  11 +-
 src/pages/doormile/settings/Settings.jsx      |   8 -
 src/pages/doormile/tripsheets/Tripsheets.jsx  |  13 +-
 src/pages/doormile/vehicles/Vehicles.jsx      |  13 +-
 18 files changed, 243 insertions(+), 263 deletions(-)

diff --git a/src/pages/doormile/appUsers/AppUsers.jsx b/src/pages/doormile/appUsers/AppUsers.jsx
index b4416bb..61c4763 100644
--- a/src/pages/doormile/appUsers/AppUsers.jsx
+++ b/src/pages/doormile/appUsers/AppUsers.jsx
@@ -150,14 +150,6 @@ export default function AppUsers() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={openCreate}>
-            <Plus className="mr-1.5 h-4 w-4" /> New user
-          </Button>
-        }
-      />
-
       <Grid cols={3}>
         <KpiCard
           icon={Users}
@@ -194,6 +186,11 @@ export default function AppUsers() {
           onSearchChange={setSearch}
           placeholder="Search by name, email, phone or role"
           count={{ shown: rows.length, total: users.length, noun: 'users' }}
+          actions={
+            <Button onClick={openCreate}>
+              <Plus className="mr-1.5 h-4 w-4" /> New user
+            </Button>
+          }
         />
 
         <DataTable
diff --git a/src/pages/doormile/bookings/Bookings.jsx b/src/pages/doormile/bookings/Bookings.jsx
index e6b74a2..419cb4a 100644
--- a/src/pages/doormile/bookings/Bookings.jsx
+++ b/src/pages/doormile/bookings/Bookings.jsx
@@ -421,14 +421,6 @@ export default function Bookings() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button variant="outline" onClick={() => refetch()} loading={isFetching}>
-            <RefreshCw className="mr-1.5 h-4 w-4" /> Refresh
-          </Button>
-        }
-      />
-
       {isError && <Alert tone="danger">{messageOf(error, 'Could not load bookings')}</Alert>}
 
       {scan?.truncated && (
@@ -466,6 +458,11 @@ export default function Bookings() {
             placeholder="Search booking no, address or status"
             onExport={() => exportRows(rows, EXPORT_COLUMNS, `customer-bookings-${tab}`)}
             exportDisabled={rows.length === 0}
+            actions={
+              <Button variant="outline" onClick={() => refetch()} loading={isFetching}>
+                <RefreshCw className="mr-1.5 h-4 w-4" /> Refresh
+              </Button>
+            }
           />
         </div>
       </div>
diff --git a/src/pages/doormile/clients/Tenants.jsx b/src/pages/doormile/clients/Tenants.jsx
index c177930..0397c5c 100644
--- a/src/pages/doormile/clients/Tenants.jsx
+++ b/src/pages/doormile/clients/Tenants.jsx
@@ -405,14 +405,6 @@ export default function Tenants() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={() => navigate('/doormile/clients/create')}>
-            <Plus className="mr-1.5 h-4 w-4" /> New client
-          </Button>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard icon={Building2} value={stats.total} label="Total clients" tone="brand" index={0} loading={isLoading} />
         <KpiCard
@@ -464,6 +456,9 @@ export default function Tenants() {
               placeholder="Search by client name, email or phone"
               className="w-full sm:w-72"
             />
+            <Button onClick={() => navigate('/doormile/clients/create')}>
+              <Plus className="mr-1.5 h-4 w-4" /> New client
+            </Button>
           </div>
         </div>
 
diff --git a/src/pages/doormile/competitiveIntel/CompetitiveIntel.jsx b/src/pages/doormile/competitiveIntel/CompetitiveIntel.jsx
index d8ffc55..667a896 100644
--- a/src/pages/doormile/competitiveIntel/CompetitiveIntel.jsx
+++ b/src/pages/doormile/competitiveIntel/CompetitiveIntel.jsx
@@ -180,16 +180,13 @@ export default function CompetitiveIntel() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
+      <Stack space="sm">
+        <div className="flex flex-wrap items-center justify-between gap-3 w-full">
+          <Tabs tabs={TABS} value={tab} onChange={changeTab} />
           <Button onClick={openCreate}>
             <Plus className="mr-1.5 h-4 w-4" /> {onBranches ? 'New branch' : 'New rate'}
           </Button>
-        }
-      />
-
-      <Stack space="sm">
-        <Tabs tabs={TABS} value={tab} onChange={changeTab} />
+        </div>
 
         <div className="flex items-center justify-between">
           <p className="text-caption text-ink-3">
diff --git a/src/pages/doormile/customers/Customers.jsx b/src/pages/doormile/customers/Customers.jsx
index 23dc123..4545f50 100644
--- a/src/pages/doormile/customers/Customers.jsx
+++ b/src/pages/doormile/customers/Customers.jsx
@@ -141,16 +141,6 @@ export default function Customers({ embedded = false }) {
 
   return (
     <Stack space="lg">
-      {!embedded && (
-        <PageHeader
-          actions={
-            <Button onClick={() => navigate('/doormile/customer/create')}>
-              <Plus className="mr-1.5 h-4 w-4" /> New customer
-            </Button>
-          }
-        />
-      )}
-
       <Grid cols={4}>
         <KpiCard
           icon={Users}
@@ -195,6 +185,11 @@ export default function Customers({ embedded = false }) {
           onSearchChange={setSearch}
           placeholder="Search by name, phone or email"
           count={{ shown: rows.length, total: customers.length, noun: 'customers' }}
+          actions={
+            <Button onClick={() => navigate('/doormile/customer/create')}>
+              <Plus className="mr-1.5 h-4 w-4" /> New customer
+            </Button>
+          }
         />
 
         <DataTable
diff --git a/src/pages/doormile/deliveries/Deliveries.jsx b/src/pages/doormile/deliveries/Deliveries.jsx
index 41844d2..2bbd5d1 100644
--- a/src/pages/doormile/deliveries/Deliveries.jsx
+++ b/src/pages/doormile/deliveries/Deliveries.jsx
@@ -1,12 +1,11 @@
 import React, { useEffect, useMemo, useState } from 'react';
 import dayjs from 'dayjs';
-import { Ban, Bell, Bike, FileSpreadsheet, PackageSearch, Truck } from 'lucide-react';
+import { Ban, Bell, Bike, Clock, FileSpreadsheet, PackageSearch, Truck } from 'lucide-react';
 import {
   Alert, Button, DataTable, DatePicker, Drawer, EmptyState, Field, IconButton,
-  PageHeader, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Modal,
+  PageHeader, SearchInput, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Modal,
   Stack, StatusBadge, Surface, Tabs, Textarea, ZoneSelector,
 } from '@/components/ds';
-import { ListToolbar } from '@/components/doormile/ListToolbar';
 import {
   useBooking, useCancelDelivery, useChangeDeliveryRider, useDeliveries,
   useDeliveryCounts, useNotifyMiler, useRiderOptions, useTenants,
@@ -390,30 +389,24 @@ export default function Deliveries() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <DatePicker
-            value={selectedDate}
-            onChange={(d) => {
-              if (d) {
-                const s = dayjs(d).format('YYYY-MM-DD');
-                setDateParams({ from: s, to: s });
-                setSelectedDate(s);
-              }
-            }}
-          />
-        }
-      />
-
       <Stack space="sm">
-        <Tabs tabs={tabs} value={tab} onChange={setTab} />
+        {/* Row 1: Tabs on left, DatePicker & Export on right */}
+        <div className="flex flex-wrap items-center justify-between gap-3 w-full">
+          <div className="no-scrollbar -mx-1 max-w-full min-w-0 overflow-x-auto px-1 py-0.5">
+            <Tabs tabs={tabs} value={tab} onChange={setTab} className="shrink-0" />
+          </div>
 
-        <ListToolbar
-          search={search}
-          onSearchChange={setSearch}
-          placeholder="Search by order, client, miler, customer or address"
-          count={{ shown: rows.length, total: batchRows.length, noun: 'deliveries' }}
-          actions={
+          <div className="flex items-center gap-2 shrink-0">
+            <DatePicker
+              value={selectedDate}
+              onChange={(d) => {
+                if (d) {
+                  const s = dayjs(d).format('YYYY-MM-DD');
+                  setDateParams({ from: s, to: s });
+                  setSelectedDate(s);
+                }
+              }}
+            />
             <Button
               variant="ghost"
               onClick={() => exportRows(rows, exportColumns, `deliveries-${tab}-${dateParams.from || 'all'}`)}
@@ -421,50 +414,97 @@ export default function Deliveries() {
             >
               <FileSpreadsheet className="mr-1.5 h-4 w-4" /> Export
             </Button>
-          }
-        >
-          <ZoneSelector className="w-full sm:w-auto" />
-          <Select value={batch} onValueChange={setBatch}>
-            <SelectTrigger className="w-full sm:w-52">
-              <SelectValue />
-            </SelectTrigger>
-            <SelectContent>
-              {BATCH_OPTIONS.map((option) => (
-                <SelectItem key={option.id} value={option.id}>
-                  {option.label} · {option.range}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
+          </div>
+        </div>
 
-          <Select value={tenantId} onValueChange={setTenantId}>
-            <SelectTrigger className="w-full sm:w-48">
-              <SelectValue placeholder="All clients" />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={ALL}>All clients</SelectItem>
-              {(tenants || []).map((tenant) => (
-                <SelectItem key={tenant.tenantid} value={String(tenant.tenantid)}>
-                  {tenant.tenantname || `Tenant #${tenant.tenantid}`}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
+        {/* Row 2: Search, Zone, Batch, Clients, Milers, and Count */}
+        <div className="flex flex-wrap items-center justify-between gap-3 w-full">
+          <div className="flex flex-1 flex-wrap items-center gap-2.5 min-w-0">
+            <SearchInput
+              value={search}
+              onChange={setSearch}
+              placeholder="Search by order, client, miler, customer..."
+              className="w-full sm:w-64 lg:w-72"
+            />
+            <ZoneSelector className="w-full sm:w-auto shrink-0" />
 
-          <Select value={riderId} onValueChange={setRiderId}>
-            <SelectTrigger className="w-full sm:w-48">
-              <SelectValue placeholder="All milers" />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={ALL}>All milers</SelectItem>
-              {(riders || []).map((rider) => (
-                <SelectItem key={rider.userid} value={String(rider.userid)}>
-                  {rider.label}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-        </ListToolbar>
+            <Select value={batch} onValueChange={setBatch}>
+              <SelectTrigger className="w-full sm:w-auto min-w-[210px] h-10">
+                <div className="flex items-center gap-2 min-w-0">
+                  <Clock className="h-3.5 w-3.5 text-ink-3 shrink-0" />
+                  <SelectValue />
+                </div>
+              </SelectTrigger>
+              <SelectContent className="w-[300px] p-1.5 shadow-lg rounded-xl">
+                {BATCH_OPTIONS.map((option) => (
+                  <SelectItem
+                    key={option.id}
+                    value={option.id}
+                    textValue={option.id === 'all' ? 'All batches' : `${option.label} · ${option.range}`}
+                    className="py-2 pl-2.5 pr-8 rounded-lg cursor-pointer my-0.5"
+                  >
+                    <div className="flex items-center justify-between gap-3 w-full">
+                      <span className="font-medium text-ink-1 text-sm">{option.label}</span>
+                      <span className="text-[11px] font-medium px-2 py-0.5 rounded-md bg-surface-sunken text-ink-3 border border-border/50 shrink-0">
+                        {option.range}
+                      </span>
+                    </div>
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+
+            <Select value={tenantId} onValueChange={setTenantId}>
+              <SelectTrigger className="w-full sm:w-44">
+                <SelectValue placeholder="All clients" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value={ALL}>All clients</SelectItem>
+                {(tenants || []).map((tenant) => (
+                  <SelectItem key={tenant.tenantid} value={String(tenant.tenantid)}>
+                    {tenant.tenantname || `Tenant #${tenant.tenantid}`}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+
+            <Select value={riderId} onValueChange={setRiderId}>
+              <SelectTrigger className="w-full sm:w-44">
+                <SelectValue placeholder="All milers" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value={ALL}>All milers</SelectItem>
+                {(riders || []).map((rider) => (
+                  <SelectItem key={rider.userid} value={String(rider.userid)}>
+                    {rider.label}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+
+            {isFiltered && (
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={() => {
+                  setSearch('');
+                  setBatch('all');
+                  setTenantId(ALL);
+                  setRiderId(ALL);
+                }}
+                className="text-xs h-9 text-brand hover:text-brand-hover hover:bg-brand-soft"
+              >
+                Clear filters
+              </Button>
+            )}
+          </div>
+
+          <div className="text-caption text-ink-3 shrink-0">
+            {rows.length === batchRows.length
+              ? `${batchRows.length} ${batchRows.length === 1 ? 'delivery' : 'deliveries'}`
+              : `${rows.length} of ${batchRows.length} deliveries`}
+          </div>
+        </div>
 
         <DataTable
           columns={columns}
diff --git a/src/pages/doormile/exceptions/Exceptions.jsx b/src/pages/doormile/exceptions/Exceptions.jsx
index e6273f7..45234b7 100644
--- a/src/pages/doormile/exceptions/Exceptions.jsx
+++ b/src/pages/doormile/exceptions/Exceptions.jsx
@@ -209,14 +209,6 @@ export default function Exceptions() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={openCreate}>
-            <Plus className="mr-1.5 h-4 w-4" /> Log exception
-          </Button>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard
           icon={ClipboardList}
@@ -262,6 +254,11 @@ export default function Exceptions() {
           onSearchChange={setSearch}
           placeholder="Search by consignment, type or description"
           count={{ shown: rows.length, total: exceptions.length, noun: 'exceptions' }}
+          actions={
+            <Button onClick={openCreate}>
+              <Plus className="mr-1.5 h-4 w-4" /> Log exception
+            </Button>
+          }
         />
 
         <DataTable
diff --git a/src/pages/doormile/hubs/Hubs.jsx b/src/pages/doormile/hubs/Hubs.jsx
index ab9c636..9cc1293 100644
--- a/src/pages/doormile/hubs/Hubs.jsx
+++ b/src/pages/doormile/hubs/Hubs.jsx
@@ -198,14 +198,6 @@ export default function Hubs() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={openCreate}>
-            <Plus className="mr-1.5 h-4 w-4" /> New hub
-          </Button>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard
           icon={Warehouse}
@@ -251,6 +243,11 @@ export default function Hubs() {
           onSearchChange={setSearch}
           placeholder="Search hubs, addresses or pincodes"
           count={{ shown: rows.length, total: hubs.length, noun: 'hubs' }}
+          actions={
+            <Button onClick={openCreate}>
+              <Plus className="mr-1.5 h-4 w-4" /> New hub
+            </Button>
+          }
         />
 
         <DataTable
diff --git a/src/pages/doormile/orders/Orders.jsx b/src/pages/doormile/orders/Orders.jsx
index 2ba2fe0..c11d48e 100644
--- a/src/pages/doormile/orders/Orders.jsx
+++ b/src/pages/doormile/orders/Orders.jsx
@@ -437,24 +437,12 @@ export default function Orders() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <>
-            <Button variant="outline" onClick={() => navigate('/doormile/orders/createorders')}>
-              <Upload className="mr-1.5 h-4 w-4" /> Bulk upload
-            </Button>
-            <Button onClick={() => navigate('/doormile/orders/create')}>
-              <Plus className="mr-1.5 h-4 w-4" /> New order
-            </Button>
-          </>
-        }
-      />
-
       <Stack space="sm">
         {/* Both halves used to be `shrink-0` in a non-wrapping row, which came to
             1049px of content — on a 375px phone the whole document scrolled
             sideways rather than this strip. The row now wraps, and the tab strip
             scrolls inside its own track, so every tab stays reachable. */}
+        {/* Row 1: Tabs on left, Bulk upload & New order on right */}
         <div className="flex flex-wrap items-center justify-between gap-3 w-full">
           <div className="no-scrollbar -mx-1 max-w-full min-w-0 overflow-x-auto px-1 py-0.5">
             <Tabs
@@ -465,7 +453,19 @@ export default function Orders() {
             />
           </div>
 
-          <div className="flex min-w-0 flex-1 flex-wrap items-center justify-end gap-2 sm:flex-none">
+          <div className="flex items-center gap-2 shrink-0">
+            <Button variant="outline" onClick={() => navigate('/doormile/orders/createorders')}>
+              <Upload className="mr-1.5 h-4 w-4" /> Bulk upload
+            </Button>
+            <Button onClick={() => navigate('/doormile/orders/create')}>
+              <Plus className="mr-1.5 h-4 w-4" /> New order
+            </Button>
+          </div>
+        </div>
+
+        {/* Row 2: Search, Date, Zone, and Export */}
+        <div className="flex flex-wrap items-center justify-between gap-3 w-full">
+          <div className="flex min-w-0 flex-1 flex-wrap items-center gap-2">
             <DatePicker
               value={selectedDate}
               onChange={setSelectedDate}
@@ -476,8 +476,11 @@ export default function Orders() {
               value={search}
               onChange={setSearch}
               placeholder="Search by order number, address or note"
-              className="w-full sm:w-64"
+              className="w-full sm:w-80"
             />
+          </div>
+
+          <div className="flex items-center gap-2">
             {selectedIds.length > 0 && tab === 'pending' && (
               <Button variant="outline" onClick={() => setCancelOpen(true)}>
                 <Ban className="mr-1.5 h-4 w-4" /> Cancel {selectedIds.length}
diff --git a/src/pages/doormile/orders/OrdersPreview.jsx b/src/pages/doormile/orders/OrdersPreview.jsx
index 6e90613..2599140 100644
--- a/src/pages/doormile/orders/OrdersPreview.jsx
+++ b/src/pages/doormile/orders/OrdersPreview.jsx
@@ -191,22 +191,18 @@ export default function OrdersPreview() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <>
-            <Button variant="outline" onClick={() => navigate('/doormile/orders')}>
-              <ArrowLeft className="mr-1.5 h-4 w-4" /> Back to orders
-            </Button>
-            <Button
-              onClick={() => commit.mutate({ deliveries: rows })}
-              loading={commit.isPending}
-              disabled={rows.length === 0}
-            >
-              <Send className="mr-1.5 h-4 w-4" /> Assign {rows.length || ''} orders
-            </Button>
-          </>
-        }
-      />
+      <div className="flex flex-wrap items-center justify-between gap-3">
+        <Button variant="outline" onClick={() => navigate('/doormile/orders')}>
+          <ArrowLeft className="mr-1.5 h-4 w-4" /> Back to orders
+        </Button>
+        <Button
+          onClick={() => commit.mutate({ deliveries: rows })}
+          loading={commit.isPending}
+          disabled={rows.length === 0}
+        >
+          <Send className="mr-1.5 h-4 w-4" /> Assign {rows.length || ''} orders
+        </Button>
+      </div>
 
       <Grid cols={4}>
         <KpiCard icon={Package} value={number(stats.orders, '0')} label="Orders" tone="brand" index={0} />
diff --git a/src/pages/doormile/pricing/Pricing.jsx b/src/pages/doormile/pricing/Pricing.jsx
index 9efd120..29d5488 100644
--- a/src/pages/doormile/pricing/Pricing.jsx
+++ b/src/pages/doormile/pricing/Pricing.jsx
@@ -254,19 +254,6 @@ export default function Pricing() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <>
-            <Button variant="outline" onClick={() => setQuoteOpen(true)}>
-              <Calculator className="mr-1.5 h-4 w-4" /> Get a quote
-            </Button>
-            <Button onClick={openCreate}>
-              <Plus className="mr-1.5 h-4 w-4" /> New rule
-            </Button>
-          </>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard icon={Tag} value={stats.total} label="Pricing rules" tone="brand" index={0} loading={isLoading} />
         <KpiCard
@@ -294,6 +281,16 @@ export default function Pricing() {
           onSearchChange={setSearch}
           placeholder="Search by client, zone or vehicle"
           count={{ shown: rows.length, total: zonePricing.length, noun: 'rules' }}
+          actions={
+            <>
+              <Button variant="outline" onClick={() => setQuoteOpen(true)}>
+                <Calculator className="mr-1.5 h-4 w-4" /> Get a quote
+              </Button>
+              <Button onClick={openCreate}>
+                <Plus className="mr-1.5 h-4 w-4" /> New rule
+              </Button>
+            </>
+          }
         >
           <Select value={String(zone)} onValueChange={setZone}>
             <SelectTrigger className="w-full sm:w-48">
diff --git a/src/pages/doormile/reports/OrdersDetails.jsx b/src/pages/doormile/reports/OrdersDetails.jsx
index aa27779..1eb2229 100644
--- a/src/pages/doormile/reports/OrdersDetails.jsx
+++ b/src/pages/doormile/reports/OrdersDetails.jsx
@@ -161,27 +161,6 @@ export default function OrdersDetails() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <>
-            <Input
-              type="date"
-              value={range.from}
-              onChange={(e) => setRange((current) => ({ ...current, from: e.target.value }))}
-              aria-label="From date"
-              className="w-40"
-            />
-            <Input
-              type="date"
-              value={range.to}
-              onChange={(e) => setRange((current) => ({ ...current, to: e.target.value }))}
-              aria-label="To date"
-              className="w-40"
-            />
-          </>
-        }
-      />
-
       <Stack space="sm">
         <ListToolbar
           search={search}
@@ -198,6 +177,23 @@ export default function OrdersDetails() {
             </Button>
           }
         >
+          <div className="flex items-center gap-1.5">
+            <Input
+              type="date"
+              value={range.from}
+              onChange={(e) => setRange((current) => ({ ...current, from: e.target.value }))}
+              aria-label="From date"
+              className="w-36"
+            />
+            <span className="text-xs text-ink-4">to</span>
+            <Input
+              type="date"
+              value={range.to}
+              onChange={(e) => setRange((current) => ({ ...current, to: e.target.value }))}
+              aria-label="To date"
+              className="w-36"
+            />
+          </div>
           <Select value={tenantId} onValueChange={setTenantId}>
             <SelectTrigger className="w-full sm:w-48">
               <SelectValue placeholder="All clients" />
diff --git a/src/pages/doormile/reports/OrdersSummary.jsx b/src/pages/doormile/reports/OrdersSummary.jsx
index 81dc497..1d63cba 100644
--- a/src/pages/doormile/reports/OrdersSummary.jsx
+++ b/src/pages/doormile/reports/OrdersSummary.jsx
@@ -168,27 +168,6 @@ export default function OrdersSummary() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <>
-            <Input
-              type="date"
-              value={range.from}
-              onChange={(e) => setRange((current) => ({ ...current, from: e.target.value }))}
-              aria-label="From date"
-              className="w-40"
-            />
-            <Input
-              type="date"
-              value={range.to}
-              onChange={(e) => setRange((current) => ({ ...current, to: e.target.value }))}
-              aria-label="To date"
-              className="w-40"
-            />
-          </>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard icon={Package} value={number(stats.totalOrders, '0')} label="Total orders" tone="brand" index={0} loading={query.isLoading} />
         <KpiCard
@@ -233,6 +212,23 @@ export default function OrdersSummary() {
             </Button>
           }
         >
+          <div className="flex items-center gap-1.5">
+            <Input
+              type="date"
+              value={range.from}
+              onChange={(e) => setRange((current) => ({ ...current, from: e.target.value }))}
+              aria-label="From date"
+              className="w-36"
+            />
+            <span className="text-xs text-ink-4">to</span>
+            <Input
+              type="date"
+              value={range.to}
+              onChange={(e) => setRange((current) => ({ ...current, to: e.target.value }))}
+              aria-label="To date"
+              className="w-36"
+            />
+          </div>
           <Select value={zone} onValueChange={setZone}>
             <SelectTrigger className="w-full sm:w-40">
               <SelectValue placeholder="All zones" />
diff --git a/src/pages/doormile/reports/RidersSummary.jsx b/src/pages/doormile/reports/RidersSummary.jsx
index bc7f961..8201f9c 100644
--- a/src/pages/doormile/reports/RidersSummary.jsx
+++ b/src/pages/doormile/reports/RidersSummary.jsx
@@ -118,27 +118,6 @@ export default function RidersSummary() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <>
-            <Input
-              type="date"
-              value={range.from}
-              onChange={(e) => setRange((current) => ({ ...current, from: e.target.value }))}
-              aria-label="From date"
-              className="w-40"
-            />
-            <Input
-              type="date"
-              value={range.to}
-              onChange={(e) => setRange((current) => ({ ...current, to: e.target.value }))}
-              aria-label="To date"
-              className="w-40"
-            />
-          </>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard icon={Bike} value={number(stats.riders, '0')} label="Milers active" tone="brand" index={0} loading={isLoading} />
         <KpiCard icon={Package} value={number(stats.orders, '0')} label="Orders assigned" tone="navy" index={1} loading={isLoading} />
@@ -176,6 +155,23 @@ export default function RidersSummary() {
             </Button>
           }
         >
+          <div className="flex items-center gap-1.5">
+            <Input
+              type="date"
+              value={range.from}
+              onChange={(e) => setRange((current) => ({ ...current, from: e.target.value }))}
+              aria-label="From date"
+              className="w-36"
+            />
+            <span className="text-xs text-ink-4">to</span>
+            <Input
+              type="date"
+              value={range.to}
+              onChange={(e) => setRange((current) => ({ ...current, to: e.target.value }))}
+              aria-label="To date"
+              className="w-36"
+            />
+          </div>
           <Select value={zone} onValueChange={setZone}>
             <SelectTrigger className="w-full sm:w-44">
               <SelectValue placeholder="All zones" />
diff --git a/src/pages/doormile/riders/Riders.jsx b/src/pages/doormile/riders/Riders.jsx
index bab7a7a..7193bd4 100644
--- a/src/pages/doormile/riders/Riders.jsx
+++ b/src/pages/doormile/riders/Riders.jsx
@@ -260,14 +260,6 @@ export default function Riders() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={() => navigate('/doormile/milers/create')}>
-            <Plus className="mr-1.5 h-4 w-4" /> New miler
-          </Button>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard
           icon={Users}
@@ -333,6 +325,9 @@ export default function Riders() {
               placeholder="Search by name, phone, id or city"
               className="w-full sm:w-64"
             />
+            <Button onClick={() => navigate('/doormile/milers/create')}>
+              <Plus className="mr-1.5 h-4 w-4" /> New miler
+            </Button>
           </div>
         </div>
 
diff --git a/src/pages/doormile/settings/Settings.jsx b/src/pages/doormile/settings/Settings.jsx
index 6861b99..44c51d5 100644
--- a/src/pages/doormile/settings/Settings.jsx
+++ b/src/pages/doormile/settings/Settings.jsx
@@ -92,14 +92,6 @@ export default function Settings() {
               className="w-44 bg-white shadow-xs"
             />
           )}
-          {activeTab === 'customers' && (
-            <Button
-              onClick={() => navigate('/doormile/customer/create')}
-              className="inline-flex items-center gap-1.5"
-            >
-              <Plus className="h-4 w-4" /> New customer
-            </Button>
-          )}
         </div>
       </div>
 
diff --git a/src/pages/doormile/tripsheets/Tripsheets.jsx b/src/pages/doormile/tripsheets/Tripsheets.jsx
index 857cd27..e22f724 100644
--- a/src/pages/doormile/tripsheets/Tripsheets.jsx
+++ b/src/pages/doormile/tripsheets/Tripsheets.jsx
@@ -195,14 +195,6 @@ export default function Tripsheets() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={openCreate}>
-            <Plus className="mr-1.5 h-4 w-4" /> New tripsheet
-          </Button>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard
           icon={Truck}
@@ -248,6 +240,11 @@ export default function Tripsheets() {
           onSearchChange={setSearch}
           placeholder="Search by tripsheet id, hub or status"
           count={{ shown: rows.length, total: tripsheets.length, noun: 'tripsheets' }}
+          actions={
+            <Button onClick={openCreate}>
+              <Plus className="mr-1.5 h-4 w-4" /> New tripsheet
+            </Button>
+          }
         />
 
         <DataTable
diff --git a/src/pages/doormile/vehicles/Vehicles.jsx b/src/pages/doormile/vehicles/Vehicles.jsx
index 49b5057..b26274e 100644
--- a/src/pages/doormile/vehicles/Vehicles.jsx
+++ b/src/pages/doormile/vehicles/Vehicles.jsx
@@ -208,14 +208,6 @@ export default function Vehicles() {
 
   return (
     <Stack space="lg">
-      <PageHeader
-        actions={
-          <Button onClick={openCreate}>
-            <Plus className="mr-1.5 h-4 w-4" /> New vehicle
-          </Button>
-        }
-      />
-
       <Grid cols={4}>
         <KpiCard
           icon={Car}
@@ -261,6 +253,11 @@ export default function Vehicles() {
           onSearchChange={setSearch}
           placeholder="Search by registration, type or status"
           count={{ shown: rows.length, total: vehicles.length, noun: 'vehicles' }}
+          actions={
+            <Button onClick={openCreate}>
+              <Plus className="mr-1.5 h-4 w-4" /> New vehicle
+            </Button>
+          }
         />
 
         <DataTable