Merge pull request #167 from Sahil-Connect/SAH-77

[SAH-77]: Supplier Inventory Page

apps/admin/src/pages/clients/[clientId].tsx

@@ -11,6 +11,7 @@ import {
   BusinessProfileOverview,
   BusinessOrderHistory,
 } from "@sahil/features/businesses";
+import { Business, Suppliers } from "@sahil/lib/graphql/__generated__/graphql";
 
 export default function ClientPage() {
   const router = useRouter();
@@ -51,12 +52,12 @@ function SupplierView({ clientId }: { clientId: string }) {
     <div className="space-y-4">
       <div className="flex flex-col lg:flex-row sm:gap-1">
         <div className="space-y-2">
-          <SupplierProfileOverview supplier={supplier} />
+          <SupplierProfileOverview supplier={supplier as Suppliers} />
           <ServiceZones />
         </div>
         <div className="basis-5/6 space-y-4">
           <SupplierProducts
-            productsCount={supplier?.products_aggregate.aggregate.count}
+            productsCount={supplier?.products_aggregate.aggregate?.count || 0}
           />
           <SupplierOrderHistory supplierId={clientId} />
         </div>
@@ -88,10 +89,10 @@ function BusinessView({ clientId }: { clientId: string }) {
     <div className="space-y-4">
       <div className="flex flex-col lg:flex-row sm:gap-1">
         <div className="space-y-2">
-          <BusinessProfileOverview business={business} />
+          <BusinessProfileOverview business={business as Business} />
         </div>
         <div className="basis-5/6 space-y-4">
-          <BusinessOrderHistory businessId={clientId} />
+          <BusinessOrderHistory />
         </div>
       </div>
     </div>

apps/agent/src/Dashboard/AgentToolBar.tsx

@@ -3,9 +3,30 @@ import {
   HiChevronDown,
   HiOutlineTruck,
   HiOutlineBriefcase,
+  HiOutlineBuildingOffice,
 } from "react-icons/hi2";
 import Link from "next/link";
-import { Avatar } from "ui";
+
+import { Avatar, Card, Dropdown } from "ui";
+
+const dropdownOptions = [
+  {
+    id: "business",
+    label: "Business",
+    icon: HiOutlineBriefcase,
+  },
+  {
+    id: "courier",
+    label: "Courier",
+    icon: HiOutlineTruck,
+  },
+  {
+    id: "supplier",
+    label: "Supplier",
+    icon: HiOutlineBuildingOffice,
+  },
+];
+
 import { useSession } from "next-auth/react";
 import { formatCurrentDate } from "@sahil/lib/dates";
 

apps/agent/src/pages/orders/index.tsx

@@ -1,6 +1,28 @@
+import { useState } from 'react';
 import { HiPlus } from "react-icons/hi2";
 import { ListOrders } from "@sahil/features/Orders/ListOrders";
 import { SectionHeader } from "ui";
+import OrderHeader from "@sahil/features/Orders/OrderHeader";
+import StatsPanel from "@sahil/features/Orders/StatsPanel";
+
+type DateRange = 'today' | 'week' | 'month' | 'custom';
+type SortOption = 'date_desc' | 'date_asc' | 'status' | 'customer';
+type OrderStatus = 'CONFIRMED' | 'CANCELLED' | 'PENDING' | 'PROCESSING' | 'DELIVERED';
+
+interface FilterState {
+  search: string;
+  status: OrderStatus | '';
+  dateRange: DateRange;
+  customDateRange?: { from: Date; to: Date };
+  sortBy: SortOption;
+}
+
+const initialFilters: FilterState = {
+  search: '',
+  status: '',
+  dateRange: 'week',
+  sortBy: 'date_desc'
+};
 
 const actions = [
   {
@@ -12,9 +34,41 @@ const actions = [
 ];
 
 export default function OrdersPage() {
+  const [filters, setFilters] = useState<FilterState>(initialFilters);
+  const [activeBusiness, setActiveBusiness] = useState<any>(null);
+
+  // Dummy data for demonstration
+  const businesses = [
+    { id: '1', name: 'Business A', totalOrders: 450 },
+    { id: '2', name: 'Business B', totalOrders: 280 },
+    { id: '3', name: 'Business C', totalOrders: 150 },
+  ];
+
+  const stats = {
+    totalOrders: 1234,
+    pendingOrders: 56,
+    completedOrders: 1178
+  };
+
   return (
-    <SectionHeader title="Orders" actions={actions}>
-      <ListOrders />
-    </SectionHeader>
+    <div className="flex flex-col h-screen">
+      <OrderHeader
+        filters={filters}
+        onFilterChange={setFilters}
+        businesses={businesses}
+        activeBusiness={activeBusiness}
+        onBusinessSelect={setActiveBusiness}
+      />
+
+      <div className="flex flex-1 overflow-hidden">
+
+        <div className="flex-1 overflow-auto">
+          <SectionHeader title="Orders" actions={actions}>
+            <ListOrders />
+          </SectionHeader>
+        </div>
+
+      </div>
+    </div>
   );
 }

apps/client/src/Layout/layout.tsx

@@ -7,17 +7,19 @@ type LayoutProps = {
   children: ReactChild | ReactChild[];
 };
 import {
-  HiOutlineBriefcase,
+  HiOutlineShoppingCart,
   HiOutlineUserCircle,
   HiOutlineTruck,
+  HiOutlineBuildingOffice,
+  HiOutlineCube,
   HiOutlineCreditCard,
 } from "react-icons/hi2";
 
 const links = [
   {
     name: "Products",
     href: "/products",
-    icon: HiOutlineBriefcase,
+    icon: HiOutlineShoppingCart,
   },
   {
     name: "Orders",
@@ -30,10 +32,16 @@ const links = [
     icon: HiOutlineUserCircle,
   },
   {
+
     name: "Billing",
     href: "/billing",
     icon: HiOutlineCreditCard,
-  }
+  },
+  {
+    name: "Inventory",
+    href: "/inventory",
+    icon: HiOutlineCube
+}
 ];
 
 export default function Layout({ children, ...props }: LayoutProps) {

apps/client/src/pages/index.tsx

@@ -58,7 +58,7 @@ export default function Home() {
           Radisson Blu
         </h1>
       </Card>
-      <MyComponent />
+
     </section>
   );
 }