diff --git a/.vscode/easycode.ignore b/.vscode/easycode.ignore
new file mode 100644
index 00000000..7f86f293
--- /dev/null
+++ b/.vscode/easycode.ignore
@@ -0,0 +1,14 @@
+node_modules/
+dist/
+vendor/
+cache/
+.*/
+*.min.*
+*.test.*
+*.spec.*
+*.bundle.*
+*.bundle-min.*
+*.log
+infra/
+apps/website
+apps/client
\ No newline at end of file
diff --git a/apps/admin/next.config.js b/apps/admin/next.config.js
index 5cba8eae..84d0e949 100644
--- a/apps/admin/next.config.js
+++ b/apps/admin/next.config.js
@@ -1,7 +1,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-  transpilePackages: ['@sahil/lib', 'ui', '@sahil/configs', "@sahil/features"],
+  transpilePackages: ['@sahil/lib', 'ui', '@sahil/configs', "@sahil/features", "tsconfig", "eslint-config-custom"],
   images: {
     remotePatterns: [
       {
@@ -9,13 +9,9 @@ const nextConfig = {
         hostname: 'res.cloudinary.com',
         port: '',
       },
-      {
-        protocol: 'https',
-        hostname: 'https://lh3.googleusercontent.com',
-        port: '',
-      },
     ],
   },
+  output: "standalone"
 };
 
 module.exports = nextConfig;
diff --git a/apps/admin/package.json b/apps/admin/package.json
index 58bacac8..2008def6 100644
--- a/apps/admin/package.json
+++ b/apps/admin/package.json
@@ -9,16 +9,41 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@apollo/client": "^3.8.1",
+    "@apollo/react-hooks": "^4.0.0",
+    "@formkit/auto-animate": "^0.7.0",
+    "@hookform/resolvers": "^3.3.0",
+    "@react-google-maps/api": "^2.19.2",
     "@sahil/configs": "*",
     "@sahil/features": "*",
     "@sahil/lib": "*",
+    "@types/jsonwebtoken": "^9.0.5",
+    "apollo-link-ws": "^1.0.20",
+    "autoprefixer": "10.4.15",
     "daisyui": "^4.12.2",
-    "next": "14.2.3",
+    "date-fns": "^2.30.0",
+    "eslint": "8.47.0",
+    "eslint-config-custom": "*",
+    "eslint-config-next": "^14.2.3",
+    "graphql": "^16.8.0",
+    "graphql-ws": "^5.14.0",
+    "jsonwebtoken": "^9.0.2",
+    "next": "^14.2.3",
     "next-auth": "^4.24.7",
     "next-auth-hasura-adapter": "^2.0.0",
+    "postcss": "8.4.28",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "ui": "*"
+    "react-hook-form": "^7.45.4",
+    "react-hot-toast": "^2.4.1",
+    "react-icons": "^4.12.0",
+    "subscriptions-transport-ws": "^0.11.0",
+    "swr": "^2.2.1",
+    "tailwindcss": "3.3.3",
+    "tsconfig": "*",
+    "ui": "*",
+    "zod": "3.21.4",
+    "zustand": "^4.4.1"
   },
   "devDependencies": {
     "@types/node": "^20",
diff --git a/apps/admin/src/Layout/layout.tsx b/apps/admin/src/Layout/layout.tsx
index 36ae183e..ff7e0f2a 100644
--- a/apps/admin/src/Layout/layout.tsx
+++ b/apps/admin/src/Layout/layout.tsx
@@ -61,9 +61,7 @@ export default function Layout({ children, ...props }: LayoutProps) {
           user={session?.user}
         />
       )}
-      <main className={session?.user ? 'p-4' : 'p-0'}>      
-        {children}
-      </main>
+      <main className={session?.user ? "p-4" : "p-0"}>{children}</main>
     </>
   );
 }
diff --git a/apps/admin/src/config.ts b/apps/admin/src/config.ts
new file mode 100644
index 00000000..7931068f
--- /dev/null
+++ b/apps/admin/src/config.ts
@@ -0,0 +1,48 @@
+import { z } from 'zod';
+
+const envSchema = z.object({
+  // Server
+  SERVER_URL: z.string().url(),
+
+  // Hasura
+  HASURA_GRAPHQL_CORS_DOMAIN: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ENDPOINT: z.string().url(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ADMIN_SECRET: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_WS: z.string().url(),
+
+  // Auth
+  SECRET: z.string(),
+  NEXTAUTH_SECRET: z.string(),
+  NEXT_PUBLIC_NEXTAUTH_URL: z.string().url(),
+
+  // APIs
+  NEXT_PUBLIC_GITHUB_SECRET: z.string(),
+  NEXT_PUBLIC_GITHUB_ID: z.string(),
+  NEXT_PUBLIC_GOOGLE_SECRET: z.string(),
+  NEXT_PUBLIC_GOOGLE_API_KEY: z.string().optional(),
+  NEXT_PUBLIC_GOOGLE_ID: z.string(),
+
+  // Database
+  POSTGRES_USER: z.string(),
+  POSTGRES_PASSWORD: z.string(),
+  POSTGRES_DATABASE: z.string(),
+
+  // App URLs
+  ADMIN_URL: z.string().url(),
+  AGENT_URL: z.string().url(),
+  CLIENT_URL: z.string().url(),
+  COURIER_URL: z.string().url(),
+  API_URL: z.string().url(),
+
+  // Email
+  EMAIL_SERVER_USER: z.string(),
+  EMAIL_SERVER_PASSWORD: z.string(),
+  EMAIL_SERVER_HOST: z.string(),
+  EMAIL_SERVER_PORT: z.string(),
+  EMAIL_FROM: z.string().email(),
+  EMAIL_SERVER: z.string(),
+});
+
+const env = envSchema.parse(process.env);
+
+export default env;
diff --git a/apps/admin/types.d.ts b/apps/admin/types.d.ts
new file mode 100644
index 00000000..46cd38d3
--- /dev/null
+++ b/apps/admin/types.d.ts
@@ -0,0 +1,11 @@
+// https://github.com/nextauthjs/next-auth/discussions/536#discussioncomment-1932922
+import NextAuth, { DefaultSession } from "next-auth";
+
+declare module "next-auth" {
+  interface Session {
+    user: {
+      id: string;
+      address: string;
+    } & DefaultSession["user"];
+  }
+}
diff --git a/apps/agent/src/Dashboard/AgentToolBar.tsx b/apps/agent/src/Dashboard/AgentToolBar.tsx
index a26f6d14..51d2381f 100644
--- a/apps/agent/src/Dashboard/AgentToolBar.tsx
+++ b/apps/agent/src/Dashboard/AgentToolBar.tsx
@@ -18,22 +18,27 @@ export const AgentToolBar = () => {
       <div className="flex items-center gap-2">
         <Avatar alt="Hello" src={user?.image} />
         <div>
-          <h1 className="text-lg md:text-xl font-semibold">Hey, {user?.name?.split(' ')[0]}</h1>
-          <p className="text-xs md:text-sm text-gray-600">{formatCurrentDate()}</p>
+          <h1 className="text-lg md:text-xl font-semibold">
+            Hey, {user?.name?.split(" ")[0]}
+          </h1>
+          <p className="text-xs md:text-sm text-gray-600">
+            {formatCurrentDate()}
+          </p>
         </div>
       </div>
       <div className="flex gap-2">
         <div className="dropdown dropdown-end">
-          <label tabIndex={0} className="btn btn-sm btn-primary capitalize rounded-md">
-            <span className="hidden md:block">
-              Register  
-            </span> <HiChevronDown />
+          <label
+            tabIndex={0}
+            className="btn btn-sm btn-primary capitalize rounded-md"
+          >
+            <span className="hidden md:block">Register</span> <HiChevronDown />
           </label>
           <ul
             tabIndex={0}
             className="menu menu-sm dropdown-content mt-3 z-10 p-2 shadow bg-base-100 rounded-box w-52 space-y-2"
           >
-              <li className="border-b font-semibold">
+            <li className="border-b font-semibold">
               <p className="">Quick Register:</p>
             </li>
             <li>
diff --git a/apps/agent/src/Layout/layout.tsx b/apps/agent/src/Layout/layout.tsx
index 4038fade..fbd9a357 100644
--- a/apps/agent/src/Layout/layout.tsx
+++ b/apps/agent/src/Layout/layout.tsx
@@ -46,8 +46,8 @@ export default function Layout({ children, ...props }: LayoutProps) {
   };
   return (
     <>
-      {session?.user && (
-        <Navbar
+    {session?.user && (
+      <Navbar
           links={links}
           logo={logo}
           header="Agent"
@@ -55,9 +55,7 @@ export default function Layout({ children, ...props }: LayoutProps) {
           user={session?.user}
         />
       )}
-      <main className={session?.user ? 'p-4' : 'p-0'}>
-        {children}
-      </main>
+      <main className={session?.user ? "p-4" : "p-0"}>{children}</main>
     </>
   );
 }
diff --git a/apps/agent/src/config.ts b/apps/agent/src/config.ts
new file mode 100644
index 00000000..7931068f
--- /dev/null
+++ b/apps/agent/src/config.ts
@@ -0,0 +1,48 @@
+import { z } from 'zod';
+
+const envSchema = z.object({
+  // Server
+  SERVER_URL: z.string().url(),
+
+  // Hasura
+  HASURA_GRAPHQL_CORS_DOMAIN: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ENDPOINT: z.string().url(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ADMIN_SECRET: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_WS: z.string().url(),
+
+  // Auth
+  SECRET: z.string(),
+  NEXTAUTH_SECRET: z.string(),
+  NEXT_PUBLIC_NEXTAUTH_URL: z.string().url(),
+
+  // APIs
+  NEXT_PUBLIC_GITHUB_SECRET: z.string(),
+  NEXT_PUBLIC_GITHUB_ID: z.string(),
+  NEXT_PUBLIC_GOOGLE_SECRET: z.string(),
+  NEXT_PUBLIC_GOOGLE_API_KEY: z.string().optional(),
+  NEXT_PUBLIC_GOOGLE_ID: z.string(),
+
+  // Database
+  POSTGRES_USER: z.string(),
+  POSTGRES_PASSWORD: z.string(),
+  POSTGRES_DATABASE: z.string(),
+
+  // App URLs
+  ADMIN_URL: z.string().url(),
+  AGENT_URL: z.string().url(),
+  CLIENT_URL: z.string().url(),
+  COURIER_URL: z.string().url(),
+  API_URL: z.string().url(),
+
+  // Email
+  EMAIL_SERVER_USER: z.string(),
+  EMAIL_SERVER_PASSWORD: z.string(),
+  EMAIL_SERVER_HOST: z.string(),
+  EMAIL_SERVER_PORT: z.string(),
+  EMAIL_FROM: z.string().email(),
+  EMAIL_SERVER: z.string(),
+});
+
+const env = envSchema.parse(process.env);
+
+export default env;
diff --git a/apps/agent/src/pages/_app.tsx b/apps/agent/src/pages/_app.tsx
index e2a8abaa..0c72f5d0 100644
--- a/apps/agent/src/pages/_app.tsx
+++ b/apps/agent/src/pages/_app.tsx
@@ -8,13 +8,13 @@ import Inter from "next/font/local";
 import Plus_Jakarta_Sans from "next/font/local";
 
 const inter = Inter({
-  src: '../../public/fonts/Inter-VariableFont_slnt,wght.ttf', 
+  src: "../../public/fonts/Inter-VariableFont_slnt,wght.ttf",
   variable: "--font-inter",
   display: "swap",
 });
 
 const jakarta = Plus_Jakarta_Sans({
-  src: '../../public/fonts/PlusJakartaSans-VariableFont_wght.ttf', 
+  src: "../../public/fonts/PlusJakartaSans-VariableFont_wght.ttf",
   variable: "--font-jakarta",
   display: "swap",
 });
@@ -42,7 +42,9 @@ export default function App({
   return (
     <SessionProvider session={session}>
       <ApolloProvider client={client}>
-        <div className={`${inter.variable} ${jakarta.variable} font-inter antialiased text-zinc-900 min-h-full leading-normal`}>
+        <div
+          className={`${inter.variable} ${jakarta.variable} font-inter antialiased text-gray-600 min-h-full leading-normal`}
+        >
           <Layout>
             <Component {...pageProps} />
           </Layout>
diff --git a/apps/agent/src/pages/businesses/index.tsx b/apps/agent/src/pages/businesses/index.tsx
index 3943bd8e..d5cac002 100644
--- a/apps/agent/src/pages/businesses/index.tsx
+++ b/apps/agent/src/pages/businesses/index.tsx
@@ -7,8 +7,8 @@ const actions = [
     label: "Register Business",
     icon: <HiPlus />,
     href: "/businesses/register/basic_info",
-    primary: true
-  }
+    primary: true,
+  },
 ];
 
 export default function Business() {
diff --git a/apps/agent/src/pages/couriers/[courierId].tsx b/apps/agent/src/pages/couriers/[courierId].tsx
index 3f447c1f..7091d6b8 100644
--- a/apps/agent/src/pages/couriers/[courierId].tsx
+++ b/apps/agent/src/pages/couriers/[courierId].tsx
@@ -1,4 +1,5 @@
 import { CourierProfileOverview } from "@sahil/features/Couriers/components/CourierProfileOverview";
+import { Couriers } from "@sahil/lib/graphql/__generated__/graphql";
 
 import { useRouter } from "next/router";
 import { useFetchCourierByPK } from "@sahil/lib/hooks/couriers";
@@ -23,11 +24,11 @@ export default function CourierPage() {
     return <p>Loading...</p>;
   }
 
+
   return (
-    <>
       <section className="flex">
         <div className="basis-1/4">
-          <CourierProfileOverview courier={courier} />
+          <CourierProfileOverview courier={courier as Couriers} />
         </div>
         <div className="divider divider-horizontal"></div>
         <div className="space-y-4 grow">
@@ -37,6 +38,5 @@ export default function CourierPage() {
           <ZoneInformation />
         </div>
       </section>
-    </>
   );
 }
diff --git a/apps/agent/src/pages/couriers/index.tsx b/apps/agent/src/pages/couriers/index.tsx
index ec50c930..e70555bd 100644
--- a/apps/agent/src/pages/couriers/index.tsx
+++ b/apps/agent/src/pages/couriers/index.tsx
@@ -6,14 +6,14 @@ const actions = [
   {
     label: "Track Courier",
     icon: <HiOutlineMap />,
-    href: "/couriers/track"
+    href: "/couriers/track",
   },
   {
     label: "Register Courier",
     icon: <HiOutlinePlus />,
     href: "/couriers/register/personal_info",
-    primary: true
-  }
+    primary: true,
+  },
 ];
 
 export default function CouriersPage() {
diff --git a/apps/agent/src/pages/orders/[orderId].tsx b/apps/agent/src/pages/orders/[orderId].tsx
index 7dea2697..352d410d 100644
--- a/apps/agent/src/pages/orders/[orderId].tsx
+++ b/apps/agent/src/pages/orders/[orderId].tsx
@@ -3,21 +3,17 @@ import {
   OrderItems,
   OrderOverview,
   OrderPreferences,
-  OrderClient,
   OrderDetails,
   OrderProgress,
 } from "@sahil/features/Orders";
 import { Card, Tabs } from "ui";
+import { UpdateOrderStatusForm } from "@sahil/features/Orders";
 
 export type TabValue = "info" | "preferences" | "progress";
 
 import { useFetchOrderByPK } from "@/hooks/orders";
 import { useRouter } from "next/router";
-import {
-  useSyncQueryWithStore,
-  INITIAL_TAB,
-  tabs,
-} from "@sahil/lib/hooks/utilities/useQueryStore";
+import { useSyncQueryWithStore } from "@sahil/lib/hooks/utilities/useQueryStore";
 
 import {
   HiOutlineAdjustmentsVertical,
@@ -64,10 +60,10 @@ export default function OrderPage() {
   if (loading) return <p>loading</p>;
 
   return (
-    <section className="container mx-auto px-4">
+    <section className="space-y-4">
+      <OrderOverview order={order} />
       <div className="flex flex-col lg:flex-row gap-4">
-        <div className="w-full lg:w-2/3 space-y-4">
-          <OrderOverview order={order} />
+        <div className="w-full xl:basis-2/3 space-y-4">
           <Tabs
             items={OrderTabs}
             onTabClick={handleTabClick}
@@ -85,9 +81,16 @@ export default function OrderPage() {
               </Card>
             )}
             {currentTab === "preferences" && <OrderPreferences order={order} />}
-            {currentTab === "progress" && <OrderProgress order={order} />}
+            {currentTab === "progress" && (
+              <div>
+                <UpdateOrderStatusForm order={order} />
+              </div>
+            )}
           </div>
         </div>
+        <div className="w-full xl:basis-1/3 space-y-4">
+          <OrderProgress order={order} />
+        </div>
       </div>
     </section>
   );
diff --git a/apps/agent/src/pages/orders/index.tsx b/apps/agent/src/pages/orders/index.tsx
index b5315be5..dc3354bf 100644
--- a/apps/agent/src/pages/orders/index.tsx
+++ b/apps/agent/src/pages/orders/index.tsx
@@ -7,8 +7,8 @@ const actions = [
     label: "New Order",
     icon: <HiPlus />,
     href: "/orders/new/order_details",
-    primary: true
-  }
+    primary: true,
+  },
 ];
 
 export default function OrdersPage() {
diff --git a/apps/agent/src/pages/suppliers/index.tsx b/apps/agent/src/pages/suppliers/index.tsx
index 93b9bafe..75f2fef8 100644
--- a/apps/agent/src/pages/suppliers/index.tsx
+++ b/apps/agent/src/pages/suppliers/index.tsx
@@ -8,8 +8,8 @@ const actions = [
     label: "Register Supplier",
     icon: <HiPlus />,
     href: "/suppliers/register/business_info",
-    primary: true
-  }
+    primary: true,
+  },
 ];
 
 export default function Suppliers() {
diff --git a/apps/agent/tailwind.config.ts b/apps/agent/tailwind.config.ts
index 4b67ee0f..58a37c26 100644
--- a/apps/agent/tailwind.config.ts
+++ b/apps/agent/tailwind.config.ts
@@ -18,8 +18,8 @@ const extendedConfig: Config = {
   theme: {
     ...baseConfig.theme,
     fontFamily: {
-      inter: ['var(--font-inter)'],
-      jakarta: ['var(--font-jakarta)'],
+      inter: ["var(--font-inter)"],
+      jakarta: ["var(--font-jakarta)"],
     },
     extend: {
       ...baseConfig.theme?.extend,
diff --git a/apps/agent/types.d.ts b/apps/agent/types.d.ts
index 46cd38d3..7248a741 100644
--- a/apps/agent/types.d.ts
+++ b/apps/agent/types.d.ts
@@ -4,8 +4,8 @@ import NextAuth, { DefaultSession } from "next-auth";
 declare module "next-auth" {
   interface Session {
     user: {
-      id: string;
-      address: string;
+      id?: string;
+      address?: string;
     } & DefaultSession["user"];
   }
 }
diff --git a/apps/client/next.config.js b/apps/client/next.config.js
index 5cba8eae..8582905a 100644
--- a/apps/client/next.config.js
+++ b/apps/client/next.config.js
@@ -16,6 +16,7 @@ const nextConfig = {
       },
     ],
   },
+  output: "standalone"
 };
 
 module.exports = nextConfig;
diff --git a/apps/client/package.json b/apps/client/package.json
index db40ba68..75b5b4b8 100644
--- a/apps/client/package.json
+++ b/apps/client/package.json
@@ -8,17 +8,41 @@
     "start": "next start"
   },
   "dependencies": {
+    "@apollo/client": "^3.8.1",
+    "@apollo/react-hooks": "^4.0.0",
+    "@formkit/auto-animate": "^0.7.0",
+    "@hookform/resolvers": "^3.3.0",
+    "@react-google-maps/api": "^2.19.2",
     "@sahil/configs": "*",
     "@sahil/features": "*",
     "@sahil/lib": "*",
+    "@types/jsonwebtoken": "^9.0.5",
+    "apollo-link-ws": "^1.0.20",
+    "autoprefixer": "10.4.15",
     "daisyui": "^4.12.2",
+    "date-fns": "^2.30.0",
+    "eslint": "8.47.0",
+    "eslint-config-custom": "*",
     "eslint-config-next": "^14.2.3",
+    "graphql": "^16.8.0",
+    "graphql-ws": "^5.14.0",
+    "jsonwebtoken": "^9.0.2",
     "next": "^14.2.3",
     "next-auth": "^4.24.7",
     "next-auth-hasura-adapter": "^2.0.0",
+    "postcss": "8.4.28",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "ui": "*"
+    "react-hook-form": "^7.45.4",
+    "react-hot-toast": "^2.4.1",
+    "react-icons": "^4.12.0",
+    "subscriptions-transport-ws": "^0.11.0",
+    "swr": "^2.2.1",
+    "tailwindcss": "3.3.3",
+    "tsconfig": "*",
+    "ui": "*",
+    "zod": "3.21.4",
+    "zustand": "^4.4.1"
   },
   "devDependencies": {
     "@types/node": "^20",
diff --git a/apps/client/src/Layout/layout.tsx b/apps/client/src/Layout/layout.tsx
index 83e6016b..93cc60a3 100644
--- a/apps/client/src/Layout/layout.tsx
+++ b/apps/client/src/Layout/layout.tsx
@@ -51,9 +51,7 @@ export default function Layout({ children, ...props }: LayoutProps) {
           user={session?.user}
         />
       )}
-      <main className={session?.user ? 'p-4' : 'p-0'}>
-        {children}
-      </main>
+      <main className={session?.user ? "p-4" : "p-0"}>{children}</main>
     </>
   );
 }
diff --git a/apps/client/src/config.ts b/apps/client/src/config.ts
new file mode 100644
index 00000000..7931068f
--- /dev/null
+++ b/apps/client/src/config.ts
@@ -0,0 +1,48 @@
+import { z } from 'zod';
+
+const envSchema = z.object({
+  // Server
+  SERVER_URL: z.string().url(),
+
+  // Hasura
+  HASURA_GRAPHQL_CORS_DOMAIN: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ENDPOINT: z.string().url(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ADMIN_SECRET: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_WS: z.string().url(),
+
+  // Auth
+  SECRET: z.string(),
+  NEXTAUTH_SECRET: z.string(),
+  NEXT_PUBLIC_NEXTAUTH_URL: z.string().url(),
+
+  // APIs
+  NEXT_PUBLIC_GITHUB_SECRET: z.string(),
+  NEXT_PUBLIC_GITHUB_ID: z.string(),
+  NEXT_PUBLIC_GOOGLE_SECRET: z.string(),
+  NEXT_PUBLIC_GOOGLE_API_KEY: z.string().optional(),
+  NEXT_PUBLIC_GOOGLE_ID: z.string(),
+
+  // Database
+  POSTGRES_USER: z.string(),
+  POSTGRES_PASSWORD: z.string(),
+  POSTGRES_DATABASE: z.string(),
+
+  // App URLs
+  ADMIN_URL: z.string().url(),
+  AGENT_URL: z.string().url(),
+  CLIENT_URL: z.string().url(),
+  COURIER_URL: z.string().url(),
+  API_URL: z.string().url(),
+
+  // Email
+  EMAIL_SERVER_USER: z.string(),
+  EMAIL_SERVER_PASSWORD: z.string(),
+  EMAIL_SERVER_HOST: z.string(),
+  EMAIL_SERVER_PORT: z.string(),
+  EMAIL_FROM: z.string().email(),
+  EMAIL_SERVER: z.string(),
+});
+
+const env = envSchema.parse(process.env);
+
+export default env;
diff --git a/apps/client/src/hooks/orders.ts b/apps/client/src/hooks/orders.ts
index 0f396a57..53a28214 100644
--- a/apps/client/src/hooks/orders.ts
+++ b/apps/client/src/hooks/orders.ts
@@ -5,8 +5,6 @@ import {
   INSERT_NEW_ORDER,
   FETCH_ORDER_DELIVERIES,
   FETCH_ORDERS_STATS,
-  INIT_ORDER_ACTION,
-  GET_ORDER_VALIDATION,
 } from "@sahil/lib/graphql";
 import {
   InsertBusinessOrderMutation,
@@ -56,19 +54,19 @@ export const useGetOrdersStats = () => {
   return { error, ordersCount: data?.orders_aggregate?.aggregate, loading };
 };
 
-export const useInitBusinessOrder = () => {
-  const [initOrder, { data, loading, error }] = useMutation(INIT_ORDER_ACTION);
+// export const useInitBusinessOrder = () => {
+//   const [initOrder, { data, loading, error }] = useMutation(INIT_ORDER_ACTION);
 
-  return { data, loading, error, initOrder };
-};
+//   return { data, loading, error, initOrder };
+// };
 
-export const useOrderValidSubscription = (actionId: string) => {
-  const { data, loading, error } = useSubscription(GET_ORDER_VALIDATION, {
-    variables: {
-      id: actionId,
-    },
-    skip: !actionId,
-  });
+// export const useOrderValidSubscription = (actionId: string) => {
+//   const { data, loading, error } = useSubscription(GET_ORDER_VALIDATION, {
+//     variables: {
+//       id: actionId,
+//     },
+//     skip: !actionId,
+//   });
 
-  return { data, loading, error };
-};
+//   return { data, loading, error };
+// };
diff --git a/apps/client/src/pages/_app.tsx b/apps/client/src/pages/_app.tsx
index 4396cae9..10578569 100644
--- a/apps/client/src/pages/_app.tsx
+++ b/apps/client/src/pages/_app.tsx
@@ -41,7 +41,9 @@ export default function App({
   return (
     <SessionProvider session={session}>
       <ApolloProvider client={client}>
-        <div className={`${inter.variable} ${jakarta.variable} font-inter antialiased text-zinc-900 min-h-full leading-normal`}>
+        <div
+          className={`${inter.variable} ${jakarta.variable} font-inter antialiased text-zinc-900 min-h-full leading-normal`}
+        >
           <Layout>
             <Component {...pageProps} />
           </Layout>
diff --git a/apps/client/src/pages/account/index.tsx b/apps/client/src/pages/account/index.tsx
index f4384f68..bc629dec 100644
--- a/apps/client/src/pages/account/index.tsx
+++ b/apps/client/src/pages/account/index.tsx
@@ -1,9 +1,9 @@
 import {
   BusinessProfileOverview,
   BusinessOrderHistory,
-} from "@sahil/features/Businesses";
+} from "@sahil/features/businesses";
 // import { useGetAccountBalance, useGetMomoAccountInfo } from "@/hooks/accounts";
-import { useFetchBusinessByPK } from "@/hooks/businesses";
+import { useFetchBusinessByPK } from "@sahil/lib/hooks/businesses";
 import { Card, JoinGrid } from "ui";
 import { useState } from "react";
 import {
diff --git a/apps/client/src/pages/checkout/index.tsx b/apps/client/src/pages/checkout/index.tsx
deleted file mode 100644
index bcececcf..00000000
--- a/apps/client/src/pages/checkout/index.tsx
+++ /dev/null
@@ -1,268 +0,0 @@
-import { FC } from "react";
-import { useFetchProducts } from "@sahil/lib/hooks/products";
-import { Card, QuantityInput } from "ui";
-import { formatCost } from "@sahil/lib";
-import { useOrderItemsStore } from "@sahil/lib/hooks/formStores/useOrderItemsStore";
-import { formatCurrency } from "@sahil/lib";
-import Image from "next/image";
-import { useRouter } from "next/router";
-import {
-  HiOutlineShoppingCart,
-  HiOutlineReceiptPercent,
-} from "react-icons/hi2";
-import {
-  useInitBusinessOrder,
-  useOrderValidSubscription,
-  usePlaceBusinessOrder,
-} from "@/hooks/orders";
-import { Key, useEffect, useState } from "react";
-import { Order_Item } from "@sahil/lib/graphql/__generated__/graphql";
-
-export const OrderItem = ({
-  price,
-  quantity,
-  title,
-  mainImage,
-}: {
-  price: number;
-  quantity: number;
-  title: string;
-  mainImage?: string;
-}) => {
-  return (
-    <div className="card card-side card-compact shadow bg-base-100">
-      <figure>
-        <Image src={mainImage} alt="Movie" height="65" width="65" />
-      </figure>
-      <div className="card-body">
-        <div className="flex justify-between items-center">
-          <div className="flex gap-2 items-center">
-            <h2 className="card-title text-sm">{title}</h2>
-          </div>
-          <div className="card-actions justify-end">
-            <QuantityInput />
-          </div>
-        </div>
-        <p className="flex items-center gap-2 font-bold">
-          {formatCurrency(price)}
-        </p>
-      </div>
-    </div>
-  );
-};
-
-export const OrderItems = ({ items }: { items: any }) => {
-  console.log(items);
-  const { totalItems, totalCost } = items?.reduce(
-    (
-      totals: { totalItems: any; totalCost: number },
-      product: { quantity: number; price: number }
-    ) => ({
-      totalItems: totals.totalItems + product.quantity,
-      totalCost: totals.totalCost + product.price * product.quantity,
-    }),
-    {
-      totalItems: 0,
-      totalCost: 0,
-    }
-  );
-
-  return (
-    <>
-      <Card title="Order Items" titleSize="sm" className="bg-gray-100">
-        <ul className="space-y-2">
-          {items?.map(
-            (item: {
-              id: Key | null | undefined;
-              name: string;
-              quantity: number;
-              price: number;
-              mainImage?: string;
-            }) => (
-              <OrderItem
-                key={item.id}
-                title={item?.name}
-                quantity={item?.quantity}
-                price={item?.price}
-                mainImage={item?.mainImage}
-              />
-            )
-          )}
-        </ul>
-      </Card>
-    </>
-  );
-};
-
-function calculateTotal(arr: Order_Item[]) {
-  // Initialize total items and total price
-  let totalItems = 0;
-  let totalPrice = 0;
-
-  // Iterate through the array
-  for (const item of arr) {
-    // Add quantity to total items
-    totalItems += item.quantity;
-
-    // Calculate subtotal for the current item
-    const subtotal = item.price * item.quantity;
-
-    // Add subtotal to total price
-    totalPrice += subtotal;
-  }
-
-  // Return an object with total items and total price
-  return {
-    totalItems,
-    totalPrice,
-  };
-}
-
-export default function CheckoutPage() {
-  const {
-    initOrder,
-    loading: initLoading,
-    error: initError,
-  } = useInitBusinessOrder();
-  const { orderItems } = useOrderItemsStore((state) => state);
-  // @ts-ignore
-  const { totalItems, totalPrice } = calculateTotal(orderItems);
-  const [actionId, setActionId] = useState<string>();
-  const router = useRouter();
-
-  const onConfirmOrder = async () => {
-    const orderItemsForInsert = orderItems.map((item) => ({
-      productId: item.productId,
-      quantity: item.quantity,
-      price: item.price,
-    }));
-
-    const object = {
-      order_items: { data: orderItemsForInsert },
-      //ToDo: User Auth user id instead of hard-coded value
-      customerId: "e87924e8-69e4-4171-bd89-0c8963e03d08",
-    };
-
-    try {
-      const result = await initOrder({
-        variables: {
-          object,
-        },
-      });
-      console.log(result);
-      setActionId(result.data.insertBusinessOrder);
-    } catch (error) {
-      console.error(error);
-    }
-  };
-
-  return (
-    <section>
-      <div className="flex">
-        <div className="basis-4/6">
-          <OrderItems items={orderItems} />
-        </div>
-        <div className="divider divider-horizontal"></div>
-        <div className="grow space-y-2">
-          <Card title="Checkout" titleSize="sm">
-            <div className="flex gap-2 items-center">
-              <div>
-                <p className="text-gray-500">Items</p>
-                <p className="text-lg">{totalItems} items</p>
-              </div>
-              <div>
-                <p className="text-gray-500">Total</p>
-                <p className="text-lg">{formatCurrency(totalPrice)}</p>
-              </div>
-            </div>
-            <div className="card-actions">
-              <button
-                className={`btn btn-sm btn-primary ${
-                  initLoading && "animate-pulse"
-                }`}
-                onClick={onConfirmOrder}
-              >
-                <HiOutlineShoppingCart /> Confirm Order
-              </button>
-            </div>
-            <ProcessOrderRequest actionId={actionId} />
-          </Card>
-          <Card title="Powered by Momo" titleSize="sm">
-            <div className=" flex items-center justify-center">
-              <Image
-                src={
-                  "https://res.cloudinary.com/dwacr3zpp/image/upload/v1701061672/BrandGuid-mtnmomo.svg"
-                }
-                alt="brand"
-                height={"200"}
-                width={"200"}
-              />
-            </div>
-          </Card>
-        </div>
-      </div>
-    </section>
-  );
-}
-
-const ProcessOrderRequest = ({
-  actionId,
-}: {
-  actionId: string | undefined;
-}) => {
-  const {
-    placeOrder,
-    loading: orderLoading,
-    error: orderError,
-  } = usePlaceBusinessOrder();
-  const { data, loading, error } = useOrderValidSubscription(actionId!);
-  const [placeOrderResult, setPlaceOrderResult] = useState<any>();
-
-  useEffect(() => {
-    const addOrderToDB = async () => {
-      if (data && data.insertBusinessOrder && data.insertBusinessOrder.output) {
-        try {
-          const order = removeTypename(data.insertBusinessOrder.output.order);
-          console.log("Order to be placed:", order);
-          const result = await placeOrder({
-            variables: {
-              object: order,
-            },
-          });
-          setPlaceOrderResult(result);
-        } catch (err) {
-          console.error("Error placing order:", err);
-        }
-      }
-    };
-
-    addOrderToDB();
-  }, [data, placeOrder]);
-
-  if (error) return <p>An error occurred while placing order</p>;
-  if (loading) return <p>Processing order...</p>;
-
-  if (placeOrderResult) {
-    return <p>Order successfully placed</p>;
-  }
-
-  return <></>;
-};
-
-const removeTypename = (value: any): any => {
-  if (value === null || value === undefined || typeof value !== "object") {
-    return value;
-  }
-  if (Array.isArray(value)) {
-    return value.map((v) => removeTypename(v));
-  }
-  type GenericObject = { [key: string]: any };
-
-  const newValue: GenericObject = {};
-  for (const key in value) {
-    if (key !== "__typename") {
-      newValue[key] = removeTypename(value[key]);
-    }
-  }
-  return newValue;
-};
diff --git a/apps/client/src/pages/orders/[orderId].tsx b/apps/client/src/pages/orders/[orderId].tsx
index 123937d4..b3c671d0 100644
--- a/apps/client/src/pages/orders/[orderId].tsx
+++ b/apps/client/src/pages/orders/[orderId].tsx
@@ -8,7 +8,7 @@ import {
 } from "@sahil/features/Orders";
 import { Tabs } from "ui";
 
-import { useFetchOrderByPK } from "@/hooks/orders";
+import { useFetchOrderByPK } from "@sahil/lib/hooks/orders";
 import { useRouter } from "next/router";
 
 export default function OrderPage() {
@@ -26,7 +26,7 @@ export default function OrderPage() {
         <div className="divider divider-horizontal"></div>
         <div className="basis-4/6 space-y-2">
           <OrderOverview order={order} />
-          <Tabs />
+      
           {true ? (
             <>
               <OrderDetails order={order} />
diff --git a/apps/client/tailwind.config.ts b/apps/client/tailwind.config.ts
index f2142668..a3247af0 100644
--- a/apps/client/tailwind.config.ts
+++ b/apps/client/tailwind.config.ts
@@ -21,8 +21,8 @@ const extendedConfig: Config = {
   theme: {
     ...baseConfig.theme,
     fontFamily: {
-      inter: ['var(--font-inter)'],
-      jakarta: ['var(--font-jakarta)'],
+      inter: ["var(--font-inter)"],
+      jakarta: ["var(--font-jakarta)"],
     },
     extend: {
       ...baseConfig.theme?.extend,
diff --git a/apps/client/types.d.ts b/apps/client/types.d.ts
new file mode 100644
index 00000000..46cd38d3
--- /dev/null
+++ b/apps/client/types.d.ts
@@ -0,0 +1,11 @@
+// https://github.com/nextauthjs/next-auth/discussions/536#discussioncomment-1932922
+import NextAuth, { DefaultSession } from "next-auth";
+
+declare module "next-auth" {
+  interface Session {
+    user: {
+      id: string;
+      address: string;
+    } & DefaultSession["user"];
+  }
+}
diff --git a/apps/courier/next.config.mjs b/apps/courier/next.config.js
similarity index 74%
rename from apps/courier/next.config.mjs
rename to apps/courier/next.config.js
index 3be6379d..84d0e949 100644
--- a/apps/courier/next.config.mjs
+++ b/apps/courier/next.config.js
@@ -1,7 +1,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-  transpilePackages: ['@sahil/lib', 'ui', '@sahil/configs', "@sahil/features"],
+  transpilePackages: ['@sahil/lib', 'ui', '@sahil/configs', "@sahil/features", "tsconfig", "eslint-config-custom"],
   images: {
     remotePatterns: [
       {
@@ -11,6 +11,7 @@ const nextConfig = {
       },
     ],
   },
+  output: "standalone"
 };
 
-export default nextConfig;
+module.exports = nextConfig;
diff --git a/apps/courier/package.json b/apps/courier/package.json
index 9d6c5eab..64594538 100644
--- a/apps/courier/package.json
+++ b/apps/courier/package.json
@@ -8,17 +8,41 @@
     "start": "next start"
   },
   "dependencies": {
+    "@apollo/client": "^3.8.1",
+    "@apollo/react-hooks": "^4.0.0",
+    "@formkit/auto-animate": "^0.7.0",
+    "@hookform/resolvers": "^3.3.0",
+    "@react-google-maps/api": "^2.19.2",
     "@sahil/configs": "*",
     "@sahil/features": "*",
     "@sahil/lib": "*",
+    "@types/jsonwebtoken": "^9.0.5",
+    "apollo-link-ws": "^1.0.20",
+    "autoprefixer": "10.4.15",
     "daisyui": "^4.12.2",
+    "date-fns": "^2.30.0",
+    "eslint": "8.47.0",
+    "eslint-config-custom": "*",
     "eslint-config-next": "^14.2.3",
+    "graphql": "^16.8.0",
+    "graphql-ws": "^5.14.0",
+    "jsonwebtoken": "^9.0.2",
     "next": "^14.2.3",
     "next-auth": "^4.24.7",
     "next-auth-hasura-adapter": "^2.0.0",
+    "postcss": "8.4.28",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "ui": "*"
+    "react-hook-form": "^7.45.4",
+    "react-hot-toast": "^2.4.1",
+    "react-icons": "^4.12.0",
+    "subscriptions-transport-ws": "^0.11.0",
+    "swr": "^2.2.1",
+    "tailwindcss": "3.3.3",
+    "tsconfig": "*",
+    "ui": "*",
+    "zod": "3.21.4",
+    "zustand": "^4.4.1"
   },
   "devDependencies": {
     "@types/node": "^20",
diff --git a/apps/courier/src/Layout/layout.tsx b/apps/courier/src/Layout/layout.tsx
index 10c822dc..d1c155fa 100644
--- a/apps/courier/src/Layout/layout.tsx
+++ b/apps/courier/src/Layout/layout.tsx
@@ -6,10 +6,7 @@ import { Navbar } from "ui";
 type LayoutProps = {
   children: ReactNode;
 };
-import {
-  HiOutlineQueueList,
-  HiOutlineTruck,
-} from "react-icons/hi2";
+import { HiOutlineQueueList, HiOutlineTruck } from "react-icons/hi2";
 
 const links = [
   {
@@ -43,9 +40,7 @@ export default function Layout({ children, ...props }: LayoutProps) {
           user={session?.user}
         />
       )}
-      <main className={session?.user ? 'p-4' : 'p-0'}>
-        {children}
-      </main>
+      <main className={session?.user ? "p-4" : "p-0"}>{children}</main>
     </>
   );
 }
diff --git a/apps/courier/src/config.ts b/apps/courier/src/config.ts
new file mode 100644
index 00000000..7931068f
--- /dev/null
+++ b/apps/courier/src/config.ts
@@ -0,0 +1,48 @@
+import { z } from 'zod';
+
+const envSchema = z.object({
+  // Server
+  SERVER_URL: z.string().url(),
+
+  // Hasura
+  HASURA_GRAPHQL_CORS_DOMAIN: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ENDPOINT: z.string().url(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_ADMIN_SECRET: z.string(),
+  NEXT_PUBLIC_HASURA_GRAPHQL_WS: z.string().url(),
+
+  // Auth
+  SECRET: z.string(),
+  NEXTAUTH_SECRET: z.string(),
+  NEXT_PUBLIC_NEXTAUTH_URL: z.string().url(),
+
+  // APIs
+  NEXT_PUBLIC_GITHUB_SECRET: z.string(),
+  NEXT_PUBLIC_GITHUB_ID: z.string(),
+  NEXT_PUBLIC_GOOGLE_SECRET: z.string(),
+  NEXT_PUBLIC_GOOGLE_API_KEY: z.string().optional(),
+  NEXT_PUBLIC_GOOGLE_ID: z.string(),
+
+  // Database
+  POSTGRES_USER: z.string(),
+  POSTGRES_PASSWORD: z.string(),
+  POSTGRES_DATABASE: z.string(),
+
+  // App URLs
+  ADMIN_URL: z.string().url(),
+  AGENT_URL: z.string().url(),
+  CLIENT_URL: z.string().url(),
+  COURIER_URL: z.string().url(),
+  API_URL: z.string().url(),
+
+  // Email
+  EMAIL_SERVER_USER: z.string(),
+  EMAIL_SERVER_PASSWORD: z.string(),
+  EMAIL_SERVER_HOST: z.string(),
+  EMAIL_SERVER_PORT: z.string(),
+  EMAIL_FROM: z.string().email(),
+  EMAIL_SERVER: z.string(),
+});
+
+const env = envSchema.parse(process.env);
+
+export default env;
diff --git a/apps/courier/src/pages/deliveries/[deliveryId].tsx b/apps/courier/src/pages/deliveries/[deliveryId].tsx
index 0ac04afe..f8ddc8c9 100644
--- a/apps/courier/src/pages/deliveries/[deliveryId].tsx
+++ b/apps/courier/src/pages/deliveries/[deliveryId].tsx
@@ -1,5 +1,88 @@
-     import { useRouter } from "next/router";
+import { useRouter } from "next/router";
 import { useFetchDeliveryByPK } from "@sahil/lib/hooks/deliveries";
+import { Card } from "ui";
+import { OrderItem } from "@sahil/features/Orders/OrderItems";
+import { OrderInfoItem } from "@sahil/features/Orders/OrderDetails";
+import { formatDateTime } from "@sahil/lib/dates";
+import {
+  HiCalendarDays,
+  HiOutlineBanknotes,
+  HiOutlineBriefcase,
+  HiOutlineMap,
+  HiOutlineMapPin,
+  HiOutlineCheck,
+  HiOutlineTruck,
+} from "react-icons/hi2";
+
+const DeliveryOrders = ({ order, deliveryStatus, onUpdateStatus }) => {
+  console.log(order);
+  return (
+    <div className="space-y-4">
+      {order?.order_items.map((order) => (
+        <Card key={order.id} className="space-y-4">
+          <h4 className="text-sm font-semibold">Order Details</h4>
+          <p>Delivery Order ID: {order.id}</p>
+          {order?.order_items && order?.order_items?.length > 0 ? (
+            <div className="space-y-2">
+              {order.order_items.map((item, index) => (
+                <OrderItem
+                  key={index}
+                  title={item?.product?.name}
+                  quantity={item?.quantity}
+                  price={item?.price}
+                />
+              ))}
+            </div>
+          ) : (
+            <p>No items found for this order.</p>
+          )}
+          <DeliveryActions 
+            orderId={order.id} 
+            deliveryStatus={deliveryStatus}
+            onUpdateStatus={onUpdateStatus}
+          />
+        </Card>
+      ))}
+    </div>
+  );
+};
+
+const DeliveryActions = ({ orderId, deliveryStatus, onUpdateStatus }) => {
+  return (
+    <div className="flex flex-col sm:flex-row gap-2">
+          <button 
+            className="btn btn-sm w-full sm:w-auto btn-primary"
+            onClick={() => onUpdateStatus(orderId, 'delivered')}
+          >
+            <HiOutlineCheck className="mr-2" />
+            Mark as Delivered
+          </button>
+          <button 
+            className="btn btn-sm w-full sm:w-auto btn-error"
+            onClick={() => onUpdateStatus(orderId, 'cancelled')}
+          >
+            Cancel Delivery
+          </button>
+          <button 
+          className="btn btn-sm w-full sm:w-auto btn-success"
+          onClick={() => onUpdateStatus(orderId, 'completed')}
+        >
+          <HiOutlineCheck className="mr-2" />
+          Mark as Completed
+        </button>
+    </div>
+  );
+};
+
+// Stub for useUpdateDeliveryStatus hook
+const useUpdateDeliveryStatus = () => {
+  const updateDeliveryStatus = async (orderId: string, newStatus: string) => {
+    console.log(`Updating order ${orderId} to status ${newStatus}`);
+    // Implement actual update logic here when the hook is ready
+  };
+
+  return { updateDeliveryStatus };
+};
 
 export default function DeliveryPage() {
   const router = useRouter();
@@ -9,8 +92,82 @@ export default function DeliveryPage() {
     error,
     loading,
   } = useFetchDeliveryByPK(deliveryId as string);
-  if (error) return <p>error</p>;
-  if (loading) return <p>loading</p>;
-  if (delivery?.length === 0) return <p>No delivery found</p>;
-  return <div>Delivery Page</div>;
+  const { updateDeliveryStatus } = useUpdateDeliveryStatus();
+
+  if (error) return <p>Error loading delivery information</p>;
+  if (loading) return <p>Loading delivery information...</p>;
+  if (!delivery) return <p>No delivery found</p>;
+
+  const deliveryInfoItems = [
+    {
+      icon: <HiOutlineBanknotes />,
+      label: "Payment Method",
+      value:  "N/A",
+    },
+    {
+      icon: <HiOutlineBriefcase />,
+      label: "Client",
+      value:  "N/A",
+    },
+    {
+      icon: <HiOutlineTruck />,
+      label: "Status",
+      value:  "N/A",
+    },
+  ];
+
+  const handleUpdateStatus = async (orderId, newStatus) => {
+    try {
+      await updateDeliveryStatus(orderId, newStatus);
+      // Optionally, you can refetch the delivery data here to update the UI
+    } catch (error) {
+      console.error("Failed to update delivery status:", error);
+    }
+  };
+
+  console.log(delivery[0]?.order);
+
+  return (
+    <section className="space-y-4">
+      <Card title={`Delivery ID: ${delivery[0].id}`}>
+        <div className="space-y-4">
+          <div className="w-full grid grid-cols-1 md:grid-cols-3 gap-4">
+            {deliveryInfoItems.map((item, index) => (
+              <OrderInfoItem
+                key={index}
+                icon={item.icon}
+                label={item.label}
+                value={item.value}
+              />
+            ))}
+          </div>
+          <div className="flex flex-col sm:flex-row gap-2">
+            <button className="btn btn-sm w-full sm:w-auto btn-primary">
+              <HiOutlineMap className="mr-2" />
+              Follow Recommended Route
+            </button>
+            <button className="btn btn-sm w-full sm:w-auto">
+              <HiOutlineMapPin className="mr-2" />
+              Navigate Independently
+            </button>
+          </div>
+          {/* {
+
+          delivery.status === 'pending' && (
+            <button 
+              className="btn btn-sm w-full sm:w-auto btn-secondary"
+              onClick={() => handleUpdateStatus(delivery.id, 'en_route')}
+            >
+              Start Trip
+            </button>
+          )} */}
+        </div>
+      </Card>
+      <DeliveryOrders 
+        order={delivery[0]?.order} 
+        deliveryStatus={"en_route"}
+        onUpdateStatus={handleUpdateStatus}
+      />
+    </section>
+  );
 }
diff --git a/apps/courier/src/pages/requests/[requestId].tsx b/apps/courier/src/pages/requests/[requestId].tsx
index d7e33812..a38cb4d0 100644
--- a/apps/courier/src/pages/requests/[requestId].tsx
+++ b/apps/courier/src/pages/requests/[requestId].tsx
@@ -1,45 +1,58 @@
 import { useRouter } from "next/router";
 import { useFetchDeliveryRequestByPK } from "@sahil/lib/hooks/deliveries";
-import { BusinessOverviewCard } from "@sahil/features/businesses/BusinessOverviewCard";
+import { Card } from "ui";
+import { OrderItem } from "@sahil/features/Orders/OrderItems";
+import { OrderInfoItem } from "@sahil/features/Orders/OrderDetails";
+import { formatDateTime } from "@sahil/lib/dates";
+import {
+  HiCalendarDays,
+  HiOutlineBanknotes,
+  HiOutlineBriefcase,
+} from "react-icons/hi2";
 
-const orders = [
-  {
-    id: "1",
-    name: "Order 1",
-    status: "pending",
-    items: [
-      {
-        id: "1",
-        name: "Item 1",
-        quantity: 1,
-      },
-    ],
-    client: {
-      id: "1",
-      name: "Client 1",
-    },
-  },
-];
-
-const RequestOrders = () => {
+const RequestOrders = ({ orders, isSingleOrder }) => {
   return (
     <div>
-      <h3>Business Name</h3>
-      <div>
-        {orders.map((order) => (
-          <div key={order.id}>
-            <div>
-              <p>{order.name}</p>
-              <p>{order.status}</p>
-            </div>
-          </div>
-        ))}
+      <div className="space-y-4">
+        {orders.map((order) => {
+          return (
+            <Card key={order.id} className="space-y-4">
+              <h4 className="text-sm font-semibold">Order Details</h4>
+              <p>Delivery Request Order ID: {order.id}</p>
+              {order?.order?.order_items &&
+              order?.order?.order_items?.length > 0 ? (
+                <div className="space-y-2">
+                  {order?.order?.order_items.map((item, index) => (
+                    <OrderItem
+                      key={index}
+                      title={item?.product?.name}
+                      quantity={item?.product?.quantity}
+                      price={item?.product?.price}
+                    />
+                  ))}
+                </div>
+              ) : (
+                <p>No items found for this order.</p>
+              )}
+              {!isSingleOrder && (
+                <RequestActions />
+              )}
+            </Card>
+          );
+        })}
       </div>
     </div>
-  )
-}
-
+  );
+};
 
+export const RequestActions = () => {
+  return (
+    <div className="flex flex-col sm:flex-row gap-2">
+      <button className="btn btn-sm w-full sm:w-auto btn-primary">Accept</button>
+      <button className="btn btn-sm w-full sm:w-auto">Decline</button>
+    </div>
+  );
+};
 
 export default function RequestPage() {
   const router = useRouter();
@@ -51,13 +64,46 @@ export default function RequestPage() {
   } = useFetchDeliveryRequestByPK(requestId as string);
   if (error) return <p>error</p>;
   if (loading) return <p>loading</p>;
-  if (deliveryRequest?.length === 0) return <p>No delivery request found</p>;
+  if (!deliveryRequest) return <p>No delivery request found</p>;
+
+  const orderInfoItems = [
+    {
+      icon: <HiCalendarDays />,
+      label: "Order Date",
+      value: formatDateTime(deliveryRequest[0].created_at),
+    },
+    {
+      icon: <HiOutlineBanknotes />,
+      label: "Payment Method",
+      value: "Cash on Delivery",
+    },
+  ];
+
+  const isSingleOrder = deliveryRequest[0].delivery_request_orders.length === 1;
 
   return (
-    <section>
-      <h1>Request Page</h1>
-      <p>{deliveryRequest?.id}</p>
-      <RequestOrders />
+    <section className="space-y-4">
+      <Card title={`Request ID: ${deliveryRequest[0].id}`}>
+        <div className="space-y-4">
+          <div className="w-full grid grid-cols-1 md:grid-cols-3 gap-4">
+            {orderInfoItems.map((item, index) => (
+              <OrderInfoItem
+                key={index}
+                icon={item.icon}
+                label={item.label}
+                value={item.value}
+              />
+            ))}
+          </div>
+          {isSingleOrder && (
+            <RequestActions />
+          )}
+        </div>
+      </Card>
+      <RequestOrders 
+        orders={deliveryRequest[0].delivery_request_orders} 
+        isSingleOrder={isSingleOrder}
+      />
     </section>
   );
 }
diff --git a/apps/courier/types.d.ts b/apps/courier/types.d.ts
new file mode 100644
index 00000000..46cd38d3
--- /dev/null
+++ b/apps/courier/types.d.ts
@@ -0,0 +1,11 @@
+// https://github.com/nextauthjs/next-auth/discussions/536#discussioncomment-1932922
+import NextAuth, { DefaultSession } from "next-auth";
+
+declare module "next-auth" {
+  interface Session {
+    user: {
+      id: string;
+      address: string;
+    } & DefaultSession["user"];
+  }
+}
diff --git a/codegen.ts b/codegen.ts
index 063a9359..a8217bad 100644
--- a/codegen.ts
+++ b/codegen.ts
@@ -22,7 +22,7 @@ const config: CodegenConfig = {
       preset: "client",
       presetConfig: {
         gqlTagName: "gql",
-        fragmentMasking: false
+        fragmentMasking: false,
       },
     },
   },
diff --git a/docker-compose.yml b/docker-compose.yml
index 72da5f0a..940bc066 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -65,6 +65,36 @@ services:
       - POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
       - POSTGRES_DATABASE=${POSTGRES_DATABASE}
 
+  # ADMIN
+  sahil-admin:
+    container_name: sahil-admin
+    build:
+      context: .
+      dockerfile: ./infra/docker/Dockerfile.admin
+    image: sahil-admin
+    restart: always
+    ports:
+      - '3003:3000'
+    environment:
+      - POSTGRES_USER=${POSTGRES_USER}
+      - POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
+      - POSTGRES_DATABASE=${POSTGRES_DATABASE}
+
+  # COURIER
+  sahil-courier:
+    container_name: sahil-courier
+    build:
+      context: .
+      dockerfile: ./infra/docker/Dockerfile.courier
+    image: sahil-courier
+    restart: always
+    ports:
+      - '3004:3000'
+    environment:
+      - POSTGRES_USER=${POSTGRES_USER}
+      - POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
+      - POSTGRES_DATABASE=${POSTGRES_DATABASE}
+
   #### LOCAL DEV ENVIRONMENTS ####
 
   # HASURA ENGINE
@@ -115,9 +145,9 @@ services:
       retries: 5
       start_period: 5s
 
-  # API
-  sahil-api-local-dev:
-    container_name: sahil-redis-postgres
+  # Redis
+  sahil-redis:
+    container_name: sahil-redis
     image: redis:6.0-alpine
     restart: always
     environment:
diff --git a/infra/docker/Dockerfile.admin b/infra/docker/Dockerfile.admin
new file mode 100644
index 00000000..127c2480
--- /dev/null
+++ b/infra/docker/Dockerfile.admin
@@ -0,0 +1,56 @@
+ARG NODE_VERSION=18.17.0
+
+FROM node:${NODE_VERSION}-alpine As base
+
+FROM base AS builder
+RUN apk add --no-cache libc6-compat
+RUN apk update
+# Set working directory
+WORKDIR /app
+RUN yarn global add turbo
+COPY . .
+RUN turbo prune admin --docker
+
+# Add lockfile and package.json's of isolated subworkspace
+FROM base AS installer
+RUN apk add --no-cache libc6-compat
+RUN apk update
+WORKDIR /app
+
+# Install the dependencies
+COPY .gitignore .gitignore
+COPY --from=builder /app/out/json/ .
+COPY --from=builder /app/out/yarn.lock ./yarn.lock
+RUN yarn install --network-timeout 100000
+
+# Build the project
+COPY --from=builder /app/out/full/ .
+COPY turbo.json turbo.json
+
+# Remote caching
+# ARG TURBO_TEAM
+# ENV TURBO_TEAM=$TURBO_TEAM
+
+# ARG TURBO_TOKEN
+# ENV TURBO_TOKEN=$TURBO_TOKEN
+
+# || true
+RUN yarn turbo build --filter=admin...
+
+FROM base AS runner
+WORKDIR /app
+
+# Don't run production as root
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+USER nextjs
+
+COPY --from=installer /app/apps/admin/next.config.js .
+COPY --from=installer /app/apps/admin/package.json .
+
+# Reduce image size
+COPY --from=installer --chown=nextjs:nodejs /app/apps/admin/.next/standalone ./
+COPY --from=installer --chown=nextjs:nodejs /app/apps/admin/.next/static ./apps/admin/.next/static
+COPY --from=installer --chown=nextjs:nodejs /app/apps/admin/public ./apps/admin/public
+
+CMD node apps/admin/server.js
\ No newline at end of file
diff --git a/infra/docker/Dockerfile.courier b/infra/docker/Dockerfile.courier
new file mode 100644
index 00000000..554c282a
--- /dev/null
+++ b/infra/docker/Dockerfile.courier
@@ -0,0 +1,56 @@
+ARG NODE_VERSION=18.17.0
+
+FROM node:${NODE_VERSION}-alpine As base
+
+FROM base AS builder
+RUN apk add --no-cache libc6-compat
+RUN apk update
+# Set working directory
+WORKDIR /app
+RUN yarn global add turbo
+COPY . .
+RUN turbo prune courier --docker
+
+# Add lockfile and package.json's of isolated subworkspace
+FROM base AS installer
+RUN apk add --no-cache libc6-compat
+RUN apk update
+WORKDIR /app
+
+# Install the dependencies
+COPY .gitignore .gitignore
+COPY --from=builder /app/out/json/ .
+COPY --from=builder /app/out/yarn.lock ./yarn.lock
+RUN yarn install --network-timeout 100000
+
+# Build the project
+COPY --from=builder /app/out/full/ .
+COPY turbo.json turbo.json
+
+# Remote caching
+# ARG TURBO_TEAM
+# ENV TURBO_TEAM=$TURBO_TEAM
+
+# ARG TURBO_TOKEN
+# ENV TURBO_TOKEN=$TURBO_TOKEN
+
+# || true
+RUN yarn turbo build --filter=courier...
+
+FROM base AS runner
+WORKDIR /app
+
+# Don't run production as root
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+USER nextjs
+
+COPY --from=installer /app/apps/courier/next.config.js .
+COPY --from=installer /app/apps/courier/package.json .
+
+# Reduce image size
+COPY --from=installer --chown=nextjs:nodejs /app/apps/courier/.next/standalone ./
+COPY --from=installer --chown=nextjs:nodejs /app/apps/courier/.next/static ./apps/courier/.next/static
+COPY --from=installer --chown=nextjs:nodejs /app/apps/courier/public ./apps/courier/public
+
+CMD node apps/courier/server.js
\ No newline at end of file
diff --git a/packages/features/Couriers/DeliveryRequestOverview.tsx b/packages/features/Couriers/DeliveryRequestOverview.tsx
deleted file mode 100644
index e27e4847..00000000
--- a/packages/features/Couriers/DeliveryRequestOverview.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { Avatar, Card, Icon } from "ui";
-
-export const DeliveryRequestOverview = ({ request }) => {
-  return (
-    <Card title={request.name}>
-      <h3>{request.name}</h3>
-      <div className="badge badge-success">Accepted</div>
-    </Card>
-  );
-};
diff --git a/packages/features/Couriers/ListDeliveryRequests.tsx b/packages/features/Couriers/ListDeliveryRequests.tsx
deleted file mode 100644
index a30e5fe4..00000000
--- a/packages/features/Couriers/ListDeliveryRequests.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Card } from "ui";
-import { DeliveryRequestOverview } from "./DeliveryRequestOverview";
-
-const requests = [
-  {
-    id: 1,
-    name: "BBQ Pizza",
-  },
-  {
-    id: 2,
-    name: "Injera and Tibs",
-  },
-  {
-    id: 3,
-    name: "Buffalo Wings",
-  },
-];
-
-export const ListDeliveryRequests = () => {
-  return (
-    <div className="space-y-2">
-      {requests.map((request) => (
-        <DeliveryRequestOverview request={request} />
-      ))}
-    </div>
-  );
-};
diff --git a/packages/features/Couriers/components/CourierProfileOverview.tsx b/packages/features/Couriers/components/CourierProfileOverview.tsx
index 54d56495..27166ae2 100644
--- a/packages/features/Couriers/components/CourierProfileOverview.tsx
+++ b/packages/features/Couriers/components/CourierProfileOverview.tsx
@@ -7,6 +7,7 @@ type Props = {
 };
 
 export const CourierProfileOverview: FC<Props> = ({ courier }) => {
+  console.log(courier)
   return (
     <div>
       {courier?.avatar && <Avatar src={courier?.avatar} alt={courier.name} />}
diff --git a/packages/features/Deliveries/DeliveryOverviewCard.tsx b/packages/features/Deliveries/DeliveryOverviewCard.tsx
index 685d6080..1a392c51 100644
--- a/packages/features/Deliveries/DeliveryOverviewCard.tsx
+++ b/packages/features/Deliveries/DeliveryOverviewCard.tsx
@@ -1,13 +1,11 @@
 import { Card } from "ui";
-import {
-    HiCalendarDays,
-    HiOutlineArrowRight
-  } from "react-icons/hi2";
-  import Link from "next/link";
+import { HiCalendarDays, HiOutlineArrowRight } from "react-icons/hi2";
+import Link from "next/link";
 
 export const DeliveryOverviewCard = ({ delivery }: { delivery: any }) => {
+  console.log(delivery);
   return (
-    <Card title={`Order ID: ${delivery.orderId}`} titleSize="sm">
+    <Card title={`Order ID: ${delivery.id}`} titleSize="sm">
       <div className="flex justify-between">
         <div className="flex gap-2">
           <p className="text-sm text-gray-500">{delivery.status}</p>
@@ -22,7 +20,12 @@ export const DeliveryOverviewCard = ({ delivery }: { delivery: any }) => {
         <p className="text-sm text-gray-500">{delivery.deliveryType}</p>
         <p className="text-sm text-gray-500">{delivery.totalAmount}</p>
       </div>
-      <Link href={`/deliveries/${delivery.orderId}`}className="btn btn-sm btn-primary">View Details <HiOutlineArrowRight /></Link>
+      <Link
+        href={`/deliveries/${delivery.id}`}
+        className="btn btn-sm btn-primary"
+      >
+        View Details <HiOutlineArrowRight />
+      </Link>
     </Card>
   );
 };
diff --git a/packages/features/Deliveries/DeliveryRequestOverviewCard.tsx b/packages/features/Deliveries/DeliveryRequestOverviewCard.tsx
index 5ced98a7..79b7dc78 100644
--- a/packages/features/Deliveries/DeliveryRequestOverviewCard.tsx
+++ b/packages/features/Deliveries/DeliveryRequestOverviewCard.tsx
@@ -1,39 +1,43 @@
 import { FC } from "react";
 import { Card } from "ui";
-import {
-  HiCalendarDays,
-  HiOutlineArrowRight
-} from "react-icons/hi2";
+import { HiCalendarDays, HiOutlineArrowRight } from "react-icons/hi2";
 import Link from "next/link";
 
-export const DeliveryRequestOverviewCard = ({ request }) => {
-    const hasActions = false;
+export const DeliveryRequestOverviewCard: FC<{ request: any }> = ({ request }) => {
+  console.log(request);
+  const hasActions = false;
+  const createdDate = new Date(request.created_at);
+  const updatedDate = new Date(request.updated_at);
+
   return (
-    <Card title="Request ID: 1" titleSize="sm">
+    <Card title={`Request ID: ${request.id.slice(0, 8)}`} titleSize="sm">
       <div className="flex justify-between">
         <div className="flex gap-2">
           <div className="badge gap-2 text-sm text-gray-500">
             <HiCalendarDays />
             {request.status}
           </div>
-          <p className="text-sm text-gray-500">{request.date}</p>
+          <p className="text-sm text-gray-500">{createdDate.toLocaleDateString()}</p>
         </div>
       </div>
       <div className="flex justify-between">
-        <p className="text-sm text-gray-500">{request.time}</p>
-        <p className="text-sm text-gray-500">{request.location}</p>
+        <p className="text-sm text-gray-500">{createdDate.toLocaleTimeString()}</p>
+        <p className="text-sm text-gray-500">Courier ID: {request?.courierId?.slice(0, 8)}</p>
       </div>
       <div className="flex justify-between">
-        <p className="text-sm text-gray-500">{request.deliveryType}</p>
-        <p className="text-sm text-gray-500">{request.totalAmount}</p>
+        <p className="text-sm text-gray-500">Delivery Method: {request.delivery_method || 'Not specified'}</p>
+        <p className="text-sm text-gray-500">Orders: {request.delivery_request_orders.length}</p>
       </div>
+      <p className="text-sm text-gray-500">Last Updated: {updatedDate.toLocaleString()}</p>
       {hasActions && (
         <div className="flex gap-4">
           <button className="btn btn-sm btn-primary">Accept</button>
           <button className="btn btn-sm">Decline</button>
         </div>
       )}
-      <Link href={`/requests/${request.id}`} className="btn btn-sm btn-primary">View Details <HiOutlineArrowRight /></Link> 
+      <Link href={`/requests/${request.id}`} className="btn btn-sm rounded-lg border border-[#067a46]/20 border-b-[#067a46]/70 border-t-[#067a46]/70 bg-gradient-to-b from-[#067a46] to-[#056a3e] px-4 pb-3 pt-2.5 font-medium leading-none text-white antialiased shadow-md ring-2 ring-[#067a46]">
+      <span className="drop-shadow-sm">View Details</span> <HiOutlineArrowRight />
+      </Link>
     </Card>
   );
 };
diff --git a/packages/features/Deliveries/ListDeliveries.tsx b/packages/features/Deliveries/ListDeliveries.tsx
index 66b1c338..13ea81de 100644
--- a/packages/features/Deliveries/ListDeliveries.tsx
+++ b/packages/features/Deliveries/ListDeliveries.tsx
@@ -2,50 +2,14 @@ import { DeliveryOverviewCard } from "./DeliveryOverviewCard";
 import { List, ListHeader, ListErrorState, ListPagination } from "ui";
 import { useFetchDeliveries } from "@sahil/lib/hooks/deliveries";
 
-const deliveries = [
-    {
-        id: 1,
-        name: "Delivery 1",
-        status: "Delivered",
-        date: "Oct 1st, 2022",
-        time: "12:00 PM",
-        location: "New York, NY",
-        deliveryType: "Home Delivery",
-        totalAmount: "$100.00",
-        orderId: 1,
-    },
-    {
-        id: 2,
-        name: "Delivery 2",
-        status: "Delivered",
-        date: "Oct 1st, 2022",
-        time: "12:00 PM",
-        location: "New York, NY",
-        deliveryType: "Home Delivery",
-        totalAmount: "$100.00",
-        orderId: 2,
-    },
-    {
-        id: 3,
-        name: "Delivery 3",
-        status: "Delivered",
-        date: "Oct 1st, 2022",
-        time: "12:00 PM",
-        location: "New York, NY",
-        deliveryType: "Home Delivery",
-        totalAmount: "$100.00",
-        orderId: 3,
-    },
-]
-
 export const ListDeliveries = () => {
-  const { data, loading, error } = useFetchDeliveries();
+  const { data: deliveries, loading, error } = useFetchDeliveries();
   if (loading) return <p>Loading...</p>;
   if (error) return <p>Error: {error.message}</p>;
-  console.log(data);
+  console.log(deliveries);
   return (
     <section>
-      <List 
+      <List
         cols={4}
         data={deliveries}
         loading={false}
@@ -55,4 +19,4 @@ export const ListDeliveries = () => {
       />
     </section>
   );
-};
\ No newline at end of file
+};
diff --git a/packages/features/Deliveries/ListDeliveryRequests.tsx b/packages/features/Deliveries/ListDeliveryRequests.tsx
index 505bf5e9..f39d06c9 100644
--- a/packages/features/Deliveries/ListDeliveryRequests.tsx
+++ b/packages/features/Deliveries/ListDeliveryRequests.tsx
@@ -2,53 +2,16 @@ import { DeliveryRequestOverviewCard } from "./DeliveryRequestOverviewCard";
 import { List, ListHeader, ListErrorState, ListPagination } from "ui";
 import { useFetchDeliveryRequests } from "@sahil/lib/hooks/deliveries";
 
-const deliveryRequests = [
-  {
-    id: 1,
-    name: "Delivery Request 1",
-    status: "Pending",
-    date: "Oct 1st, 2022",
-    time: "12:00 PM",
-    location: "New York, NY",
-    deliveryType: "Home Delivery",
-    totalAmount: "$100.00",
-  },
-  {
-    id: 2,
-    name: "Delivery Request 2",
-    status: "Pending",
-    date: "Oct 1st, 2022",
-    time: "12:00 PM",
-    location: "New York, NY",
-    deliveryType: "Home Delivery",
-    totalAmount: "$100.00",
-  },
-  {
-    id: 3,
-    name: "Delivery Request 3",
-    status: "Pending",
-    date: "Oct 1st, 2022",
-    time: "12:00 PM",
-    location: "New York, NY",
-    deliveryType: "Home Delivery",
-    totalAmount: "$100.00",
-  },
-];
-
 export const ListDeliveryRequests = () => {
-  const { loading, error, data } = useFetchDeliveryRequests();
-  if (loading) return <p>Loading...</p>;
-  if (error) return <p>Error :(</p>;
-
-    console.log(error);
-    console.log(data);
-
+  const { loading, error, data: deliveryRequests } = useFetchDeliveryRequests();
+  if (error) return <ListErrorState />;
   return (
     <section>
       <List
         cols={4}
-        data={data}
-        loading={false}
+        data={deliveryRequests}
+        loading={loading}
+        error={error}
         renderItem={(request) => (
           <DeliveryRequestOverviewCard key={request.id} request={request} />
         )}
diff --git a/packages/features/Orders/CancelOrderDialog.tsx b/packages/features/Orders/CancelOrderDialog.tsx
new file mode 100644
index 00000000..531dcf16
--- /dev/null
+++ b/packages/features/Orders/CancelOrderDialog.tsx
@@ -0,0 +1,64 @@
+import React, { useRef } from "react";
+import Modal from "ui/components/Modal";
+import { Order_Status_Enum } from "@sahil/lib/graphql/__generated__/graphql";
+import { useAppendOrderStatus } from "@sahil/lib/hooks/orders";
+import toast from "react-hot-toast";
+
+type CancelOrderDialogProps = {
+  orderId: string;
+  onCancel: () => void;
+};
+
+export const CancelOrderDialog: React.FC<CancelOrderDialogProps> = ({ orderId }) => {
+  const closeBtn = useRef<HTMLButtonElement>(null);
+  const { appendOrderStatus, loading } = useAppendOrderStatus();
+
+  const onCancel = async () => {
+    if (loading) return;
+
+    try {
+      await appendOrderStatus({
+        variables: {
+          object: {
+            order_id: orderId,
+            status: Order_Status_Enum.Canceled,
+          },
+        },
+      });
+      toast.success("Order has been cancelled");
+    } catch (error) {
+      console.error("Error canceling order status:", error);
+      toast.error("Order couldn't be cancelled, try again later.");
+    }
+  };
+
+  return (
+    <Modal
+      title="Confirm Order Cancellation"
+      CloseBtnRef={closeBtn}
+      CTA="Cancel Order"
+      id="cancel-order-modal"
+      btnSize="sm"
+      btnStyle="error"
+      className="btn-outline"
+    >
+      <p>Are you sure you want to cancel this order?</p>
+      <div className="mt-4 flex justify-end gap-2">
+        <button
+          onClick={() => {}}
+          className="btn btn-sm"
+        >
+          No, Keep Order
+        </button>
+        <button
+          onClick={onCancel}
+          className="btn btn-sm btn-error"
+        >
+          Yes, Cancel Order
+        </button>
+      </div>
+    </Modal>
+  );
+};
+
+
diff --git a/packages/features/Orders/CustomProductsCatalogue.tsx b/packages/features/Orders/CustomProductsCatalogue.tsx
index 9eb6be11..3157acbd 100644
--- a/packages/features/Orders/CustomProductsCatalogue.tsx
+++ b/packages/features/Orders/CustomProductsCatalogue.tsx
@@ -20,16 +20,22 @@ import {
 
 export const CustomProductsCatalogue = () => {
   const [offset, setOffset] = useState(0);
-  const { data, error, loading, productsCount } = useFetchProducts({ offset });
+  const {
+    data: products,
+    error,
+    loading,
+    productsCount,
+  } = useFetchProducts({ offset });
 
-  const { addOrderItem, orderItems, setProducts, products } =
-    useOrderItemsStore((state) => state);
+  const { addOrderItem, orderItems, setProducts } = useOrderItemsStore(
+    (state) => state
+  );
 
   const orderItemsMap = new Map(orderItems.map((item) => [item.id, item]));
 
   useEffect(() => {
-    setProducts(data);
-  }, [data, setProducts]);
+    if (products) setProducts(products);
+  }, [products, setProducts]);
 
   if (error) {
     return (
@@ -91,20 +97,23 @@ export const CustomProductsCatalogue = () => {
             >
               <HiArrowSmallLeft />
             </button>
-            <button
-              onClick={() => setOffset((prev) => prev + 12)}
-              disabled={offset + 12 >= productsCount}
-              className="join-item btn btn-sm btn-square btn-neutral"
-              title="right"
-              type="button"
-            >
-              <HiArrowSmallRight />
-            </button>
+            {productsCount && (
+              <button
+                onClick={() => setOffset((prev) => prev + 12)}
+                disabled={offset + 12 >= productsCount?.count}
+                className="join-item btn btn-sm btn-square btn-neutral"
+                title="right"
+                type="button"
+                aria-label="right"
+              >
+                <HiArrowSmallRight />
+              </button>
+            )}
           </JoinGrid>
         </div>
         <div className="bg-gray-100 flex items-center justify-between p-2 rounded-xl">
           <div>
-            <p className="text-bold">{productsCount.count} Items</p>
+            <p className="text-bold">{productsCount?.count} Items</p>
           </div>
           <div className="flex gap-2">
             <button className="btn btn-sm ghost">
diff --git a/packages/features/Orders/OrderDetails.tsx b/packages/features/Orders/OrderDetails.tsx
index 45732ce3..b5a7050a 100644
--- a/packages/features/Orders/OrderDetails.tsx
+++ b/packages/features/Orders/OrderDetails.tsx
@@ -7,6 +7,9 @@ import {
   HiOutlineBanknotes,
   HiOutlineMapPin,
   HiOutlineFlag,
+  HiOutlineBriefcase,
+  HiOutlineUser,
+  HiOutlinePhone,
 } from "react-icons/hi2";
 
 type Props = {
@@ -14,70 +17,77 @@ type Props = {
 };
 
 export const OrderDetails: FC<Props> = ({ order }) => {
-
   const orderInfoItems = [
-    {
-      icon: <HiCalendarDays />,
-      label: "Order Date",
-      value: formatDateTime(order?.created_at)
-    },
     {
       icon: <HiOutlineHandRaised />,
       label: "Status",
-      value: order?.status_histories?.[0]?.status ?? "Pending"
+      value: order?.status_histories?.[0]?.status ?? "Pending",
+    },
+    {
+      icon: <HiCalendarDays />,
+      label: "Order Date",
+      value: formatDateTime(order?.created_at),
     },
     {
       icon: <HiOutlineBanknotes />,
       label: "Payment Method",
-      value: "Cash on Delivery"
-    }
+      value: "Cash on Delivery",
+    },
+    {
+      icon: <HiOutlineBriefcase />,
+      label: "Client",
+      value: order?.business?.name as string,
+    },
+    {
+      icon: <HiOutlineUser />,
+      label: "Contact Name",
+      value: order?.business?.contactName as string,
+    },
+    {
+      icon: <HiOutlinePhone />,
+      label: "Contact Number",
+      value: order?.business?.phoneNumber as string,
+    },
+    {
+      icon: <HiOutlineMapPin />,
+      label: "Origin",
+      value: order?.origin as string,
+    },
+    {
+      icon: <HiOutlineFlag />,
+      label: "Destination",
+      value: order?.destination as string,
+    },
   ];
-  
+
   return (
     <div className="space-y-4">
-      <div className="flex flex-col sm:flex-row gap-4 items-start sm:items-center">
-        <div className="flex gap-2 items-center">
-          <span className="p-2 shadow rounded w-fit">
-            <HiOutlineMapPin />
-          </span>
-          <p className="text-sm sm:text-base">{order?.origin}</p>
-        </div>
-        <div className="flex gap-2 items-center">
-          <span className="p-2 shadow rounded w-fit">
-            <HiOutlineFlag />
-          </span>
-          <p className="text-sm sm:text-base">{order?.destination}</p>
-        </div>
-      </div>
       <div className="w-full grid grid-cols-1 md:grid-cols-3 gap-4">
-      {orderInfoItems.map((item, index) => (
-        <OrderInfoItem
-          key={index}
-          icon={item.icon}
-          label={item.label}
-          value={item.value}
-        />
-      ))}
-    </div>
+        {orderInfoItems.map((item, index) => (
+          <OrderInfoItem
+            key={index}
+            icon={item.icon}
+            label={item.label}
+            value={item.value}
+          />
+        ))}
+      </div>
     </div>
   );
 };
 
-type OrderInfoItemProps = {
+export type OrderInfoItemProps = {
   icon: React.ReactNode;
   label: string;
   value: string;
 };
 
-
-const OrderInfoItem = ({ icon, label, value }: OrderInfoItemProps) => (
+export const OrderInfoItem = ({ icon, label, value }: OrderInfoItemProps) => (
   <div className="w-full flex gap-2 items-center">
-    <span className="p-2 border text-primary rounded w-fit">
-      {icon}
-    </span>
+    <span className="p-2 border rounded w-fit">{icon}</span>
     <div>
       <h3 className="text-gray-400 text-sm">{label}</h3>
       <span className="text-sm">{value}</span>
     </div>
   </div>
-);
\ No newline at end of file
+);
diff --git a/packages/features/Orders/OrderItems.tsx b/packages/features/Orders/OrderItems.tsx
index 4a33456e..321d5713 100644
--- a/packages/features/Orders/OrderItems.tsx
+++ b/packages/features/Orders/OrderItems.tsx
@@ -12,18 +12,18 @@ type OrderItemProps = {
 
 export const OrderItem: FC<OrderItemProps> = ({ price, quantity, title }) => {
   return (
-    <Card className="bg-base-100">
+    <Card>
       <div className="flex justify-between items-center">
-        <div className="flex gap-2 items-center">
+        <div>
           <h2 className="card-title text-sm">{title}</h2>
-          <p className="flex items-center gap-2 text-gray-600">
-            {formatCurrency(parseInt(price))}
-          </p>
-        </div>
-        <div className="flex gap-2">
-          <p className="flex items-center gap-2 text-gray-600">
-            <HiOutlineReceiptPercent /> {quantity}x
-          </p>
+          <div className="flex gap-2">
+            <p className="flex items-center gap-2 text-gray-600">
+              <HiOutlineReceiptPercent /> {quantity} Quantity
+            </p>
+            <p className="flex items-center gap-2 text-gray-600">
+              {formatCurrency(parseInt(price))}
+            </p>
+          </div>
         </div>
       </div>
     </Card>
@@ -46,19 +46,21 @@ export const OrderItems: FC<Props> = ({ items }) => {
     }
   );
   return (
-    <>
-      <Card title="Order Items" titleSize="sm" className="bg-gray-100">
-        <ul className="space-y-2">
-          {items?.map((item, index) => (
-            <OrderItem
-              key={item.id}
-              title={item?.product?.name}
-              quantity={item?.product?.quantity}
-              price={item?.product?.price}
-            />
-          ))}
-        </ul>
-      </Card>
-    </>
+    <div className="space-y-2">
+      <div className="flex justify-between items-center gap-4">
+        <h3>Order Items</h3>
+        <p>items</p>
+      </div>
+      <ul className="space-y-2">
+        {items?.map((item, index) => (
+          <OrderItem
+            key={item.id}
+            title={item?.product?.name}
+            quantity={item?.product?.quantity}
+            price={item?.product?.price}
+          />
+        ))}
+      </ul>
+    </div>
   );
 };
diff --git a/packages/features/Orders/OrderOverview.tsx b/packages/features/Orders/OrderOverview.tsx
index 3d5a33a9..1a2c314b 100644
--- a/packages/features/Orders/OrderOverview.tsx
+++ b/packages/features/Orders/OrderOverview.tsx
@@ -1,22 +1,54 @@
-import { FC } from "react";
-import { Orders } from "@sahil/lib/graphql/__generated__/graphql";
+import { FC, useState, useRef } from "react";
+import {
+  Order_Status_Enum,
+  Orders,
+} from "@sahil/lib/graphql/__generated__/graphql";
+import { useAppendOrderStatus } from "@sahil/lib/hooks/orders";
+import toast, { Toaster } from "react-hot-toast";
 import {
   HiOutlinePrinter,
   HiOutlineArrowPathRoundedSquare,
+  HiOutlineExclamationCircle,
 } from "react-icons/hi2";
+import { Card } from "ui";
+import { CancelOrderDialog } from "./CancelOrderDialog";
 
 type Props = {
   order: Orders;
 };
 
 export const OrderOverview: FC<Props> = ({ order }) => {
+  const { appendOrderStatus, loading } = useAppendOrderStatus(); 
+  const isCanceled =
+    order.status_histories?.[0]?.status === Order_Status_Enum.Canceled;
+
+  const onCancel = async () => {
+    if (loading) return;
+    try {
+      await appendOrderStatus({
+        variables: {
+          object: {
+            order_id: order.id,
+            status: Order_Status_Enum.Canceled,
+          },
+        },
+      });
+      toast.success("Order has been cancelled");
+    } catch (error) {
+      console.error("Error canceling order status:", error);
+      toast.error("Order couldn't be cancelled, try again later.");
+    }
+  };
+
   return (
     <>
-      <div className="flex justify-between items-center">
+    <Card title={`Order ID #${order.id.slice(0, 8).toLocaleUpperCase()}` } height="h-fit">
+    <div className="flex flex-col md:flex-row justify-between gap-2">
         <div className="flex gap-2 items-center">
-          <h1 className="text-lg">
-            Order ID: #{order.id.slice(0, 8).toLocaleUpperCase()}
-          </h1>
+        <button className="btn btn-sm">
+            <HiOutlineExclamationCircle /> Report Problem
+          </button>
+          <CancelOrderDialog orderId={order.id} onCancel={onCancel} />
         </div>
         <div className="flex gap-2 items-center">
           <button className="btn btn-sm">
@@ -27,6 +59,8 @@ export const OrderOverview: FC<Props> = ({ order }) => {
           </button>
         </div>
       </div>
+    </Card>
+      <Toaster position="bottom-center" reverseOrder={false} />
     </>
   );
 };
diff --git a/packages/features/Orders/OrderOverviewCard.tsx b/packages/features/Orders/OrderOverviewCard.tsx
index 57be8eed..70ee16e5 100644
--- a/packages/features/Orders/OrderOverviewCard.tsx
+++ b/packages/features/Orders/OrderOverviewCard.tsx
@@ -7,7 +7,7 @@ import {
   HiOutlineMapPin,
   HiOutlinePhone,
   HiEllipsisVertical,
-  HiOutlineBriefcase,
+  HiOutlineClock,
   HiCalendarDays,
 } from "react-icons/hi2";
 
@@ -34,13 +34,15 @@ export const OrderOverviewCard: FC<Props> = ({ order }) => {
           />
         </div>
         <div className="badge badge-primary gap-2">
-          <HiCalendarDays /> {order?.status_histories![0]?.status ?? "Pending"}
+          <HiOutlineClock /> {order?.status_histories![0]?.status ?? "Pending"}
         </div>
         <div className="mt-2 bg-grey-200 rounded-xl flex flex-col gap-4">
           <div className="flex justify-between items-center">
             <div className="flex gap-4 p-2 w-full items-center  border border-solid border-[#d2d6db] rounded">
               <div className="space-y-1 font-semibold">
-                <span className="opacity-270 text-sm font-normal">Customer</span>
+                <span className="opacity-270 text-sm font-normal">
+                  Customer
+                </span>
                 <p>{order?.business?.name}</p>
               </div>
             </div>
diff --git a/packages/features/Orders/OrderPreferences.tsx b/packages/features/Orders/OrderPreferences.tsx
index 3178901f..f568f7c4 100644
--- a/packages/features/Orders/OrderPreferences.tsx
+++ b/packages/features/Orders/OrderPreferences.tsx
@@ -1,46 +1,158 @@
-import { formatDateTime } from "@sahil/lib/dates";
-import { Card } from "ui";
+import { Card, RadioGroup } from "ui";
 import { FC } from "react";
 import { Orders } from "@sahil/lib/graphql/__generated__/graphql";
+import { paymentMethods, deliveryMethods, notificationOptions, contactMethodOptions } from "./constants";
+import {
+  FieldValues,
+  useForm,
+} from "react-hook-form";
+import { BaseInputProps } from "ui/types";
 
-import { HiOutlinePrinter } from "react-icons/hi2";
+type BaseProps = BaseInputProps<FieldValues> & {
+  disabled?: boolean;
+};
+
+type RadioGroupProps = Partial<BaseProps> & {
+  options: { value: string; label: string }[];
+  disabled?: boolean;
+};
 
 type Props = {
   order: Orders;
 };
 
+export const NotificationPreference = ({ register, errors, defaultValue, disabled }: any) => {
+  return (
+    <RadioGroup
+      name="notifyWhen"
+      label="Notify when order is ready to fulfill"
+      options={notificationOptions}
+      defaultValue={defaultValue}
+      readOnly={disabled}
+      register={register}
+      errors={errors ?? {}}
+    />
+  );
+};
+
+export const ContactMethodPreference = ({ register, errors, defaultValue, disabled }: any) => {
+  return (
+    <RadioGroup
+      name="contactMethod"
+      label="Preferred contact method"
+      options={contactMethodOptions}
+      defaultValue={defaultValue}
+      readOnly={disabled}
+      register={register}
+      errors={errors ?? {}}
+    />
+  );
+};
+
+export const PaymentMethodOptions = ({
+  register,
+  errors,
+  defaultValue,
+  disabled
+}: any) => {
+  return (
+    <RadioGroup
+      name="paymentMethod"
+      label="Payment Method"
+      options={paymentMethods}
+      defaultValue={defaultValue}
+      readOnly={disabled}
+      register={register}
+      errors={errors ?? {}}
+    />
+  );
+};
+
+export const OrderDeliveryOptions = ({
+  register,
+  errors,
+  defaultValue,
+  disabled
+}: any) => {
+  return (
+    <RadioGroup
+      name="deliveryMethod"
+      label="Delivery Method"
+      options={deliveryMethods}
+      defaultValue={defaultValue}
+      readOnly={disabled}
+      register={register}
+      errors={errors ?? {}}
+    />
+  );
+};
+
 export const OrderPreferences: FC<Props> = ({ order }) => {
+  const { register, handleSubmit, formState: { errors } } = useForm<FieldValues>({
+    defaultValues: {
+      paymentMethod: "",
+      deliveryMethod: "",
+      notifyWhen: "",
+      contactMethod: "",
+      undeliverableAction: "",
+    }
+  });
+
+  const onSubmit = (data: FieldValues) => {
+    console.log(data);
+    // Handle form submission
+  };
+
   return (
-    <section className="bg-gray-100 space-y-2 p-2 rounded-xl shadow">
-      <p>Review and Confirm Order</p>
-      <div className="flex gap-2 items-center">
-        <Card
-          title="Order Preferences"
-          titleSize="sm"
-          height="h-fit"
-          className="grow bg-base-100"
-        >
-          <div className="flex gap-4 items-center">
-            <span className="p-2 shadow rounded-lg w-fit">
-              <HiOutlinePrinter />
-            </span>
-            <h3>Review and Confirm Order</h3>
+    <Card
+      title="Order Preferences"
+      titleSize="sm"
+      height="h-fit"
+      className="space-y-2 p-2 rounded-xl shadow"
+    >
+      <form onSubmit={handleSubmit(onSubmit)}>
+        <div className="flex flex-col md:flex-row gap-2 items-center">
+          <div className="grow">
+            <PaymentMethodOptions
+              register={register}
+              errors={errors}
+              defaultValue=""
+              disabled={false}
+            />
+            <OrderDeliveryOptions
+              register={register}
+              errors={errors}
+              defaultValue=""
+              disabled={false}
+            />
           </div>
-        </Card>
-        <Card
-          title="Order Preferences"
-          titleSize="sm"
-          height="h-fit"
-          className="grow bg-base-100"
-        >
-          <div className="flex gap-4 items-center">
-            <span className="p-2 shadow rounded-lg w-fit">
-              <HiOutlinePrinter />
-            </span>
-            <p>Review and Confirm Order</p>
+        </div>
+        <div className="space-y-2">
+          <NotificationPreference
+            register={register}
+            errors={errors}
+            defaultValue=""
+            disabled={false}
+          />
+          <ContactMethodPreference
+            register={register}
+            errors={errors}
+            defaultValue=""
+            disabled={false}
+          />
+          <div>
+            <label htmlFor="undeliverableAction" className="label">Action to take when order can&apos;t be delivered:</label>
+            <textarea
+              id="undeliverableAction"
+              className="textarea textarea-bordered w-full"
+              rows={3}
+              placeholder="Enter instructions here"
+              {...register("undeliverableAction")}
+            ></textarea>
+            <button type="submit" className="btn btn-sm btn-primary">Save</button>
           </div>
-        </Card>
-      </div>
-    </section>
+        </div>
+      </form>
+    </Card>
   );
 };
diff --git a/packages/features/Orders/OrderProcessingForm/PaymentDetails.tsx b/packages/features/Orders/OrderProcessingForm/PaymentDetails.tsx
index e4c5873f..a5762b09 100644
--- a/packages/features/Orders/OrderProcessingForm/PaymentDetails.tsx
+++ b/packages/features/Orders/OrderProcessingForm/PaymentDetails.tsx
@@ -4,13 +4,12 @@ import { useRouter } from "next/router";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useOrderFormStore } from "@sahil/lib/hooks/formStores/useOrderFormStore";
-import { Card } from "ui";
+import { Card, Icon, RadioGroup } from "ui";
 import {
   HiXMark,
-  HiOutlineCreditCard,
-  HiOutlineBanknotes,
   HiArrowSmallRight,
 } from "react-icons/hi2";
+import { PaymentMethodOptions } from "../OrderPreferences";
 
 const paymentDetailsSchema = z.object({
   paymentMethod: z.string(),
@@ -47,36 +46,7 @@ export const PaymentDetails: FC<PaymentDetailsProps> = ({
     <form onSubmit={handleSubmit(onSubmit)} className="space-y-2">
       <Card title="Payment Method" titleSize="sm">
         <div className="flex gap-2">
-          <div className="form-control">
-            <label className="label cursor-pointer">
-              <input
-                type="radio"
-                className="radio radio-sm checked:bg-secondary"
-                {...register("paymentMethod")}
-              />
-              <div className="flex ml-4 items-center gap-2">
-                <span className="shadow p-2 rounded-md">
-                  <HiOutlineCreditCard />
-                </span>
-                <span className="label-text">Momo Pay</span>
-              </div>
-            </label>
-          </div>
-          <div className="form-control">
-            <label className="label cursor-pointer">
-              <input
-                type="radio"
-                className="radio radio-sm checked:bg-secondary"
-                {...register("paymentMethod")}
-              />
-              <div className="flex ml-4 items-center gap-2">
-                <span className="shadow p-2 rounded-md">
-                  <HiOutlineBanknotes />
-                </span>
-                <span className="label-text">Cash On Delivery</span>
-              </div>
-            </label>
-          </div>
+        <PaymentMethodOptions register={register} errors={errors}/>
         </div>
         <div className="card-actions">
           <div className="flex gap-2">
diff --git a/packages/features/Orders/OrderProgress/OrderProgress.tsx b/packages/features/Orders/OrderProgress/OrderProgress.tsx
index bd69169d..ce69b1a1 100644
--- a/packages/features/Orders/OrderProgress/OrderProgress.tsx
+++ b/packages/features/Orders/OrderProgress/OrderProgress.tsx
@@ -1,8 +1,7 @@
-import { Card, Timeline } from 'ui';
-import { Orders } from '@sahil/lib/graphql/__generated__/graphql';
-import { formatDateTime } from '@sahil/lib/dates';
-import { UpdateOrderStatusModal } from './UpdateOrderStatusModal';
-import { allStatuses, statusLabels } from './constants';
+import { Card, Timeline } from "ui";
+import { Orders } from "@sahil/lib/graphql/__generated__/graphql";
+import { formatDateTime } from "@sahil/lib/dates";
+import { allStatuses, statusLabels } from "./constants";
 
 type Props = {
   order: Orders;
@@ -11,42 +10,37 @@ type Props = {
 export const OrderProgress = ({ order }: Props) => {
   const { status_histories } = order;
   const timeline = createTimeline(status_histories);
-
   return (
-    <Card>
-      <div className='flex justify-between items-center'>
-        <h2 className='font-semibold'>Order Progress</h2>
-        <UpdateOrderStatusModal order={order} />
-      </div>
-      <Timeline items={timeline} />
-    </Card>
+    <div>
+      <Card>
+        <Timeline items={timeline} />
+      </Card>
+    </div>
   );
 };
 
 type Timeline = {
   prefix: string;
-  label: (typeof allStatuses)[number] | 'CANCELED';
+  label: (typeof allStatuses)[number] | "CANCELED";
   description: string;
-  status: 'completed' | 'pending' | 'cancelled';
+  status: "completed" | "pending" | "cancelled";
 };
 
-const createTimeline = (statusHistories: Orders['status_histories']) => {
+export const createTimeline = (statusHistories: Orders["status_histories"]) => {
   const timeline: Timeline[] = statusHistories
     .map((history) => {
-      let status: 'completed' | 'pending' | 'cancelled';
-
+      let status: "completed" | "pending" | "cancelled";
       switch (history.status) {
-        case 'CANCELED':
-          status = 'cancelled';
+        case "CANCELED":
+          status = "cancelled";
           break;
-        case 'FULFILLED':
-          status = 'completed';
+        case "FULFILLED":
+          status = "completed";
           break;
         default:
-          status = 'completed';
+          status = "completed";
           break;
       }
-
       return {
         prefix: formatDateTime(history.created_at),
         label: history.status,
@@ -55,6 +49,5 @@ const createTimeline = (statusHistories: Orders['status_histories']) => {
       };
     })
     .reverse();
-
   return timeline;
 };
diff --git a/packages/features/Orders/OrderProgress/UpdateOrderStatusForm.tsx b/packages/features/Orders/OrderProgress/UpdateOrderStatusForm.tsx
new file mode 100644
index 00000000..fea40c05
--- /dev/null
+++ b/packages/features/Orders/OrderProgress/UpdateOrderStatusForm.tsx
@@ -0,0 +1,131 @@
+import { z } from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm } from "react-hook-form";
+import { Select, Card } from "ui";
+import {
+  Orders,
+  Order_Status_Enum,
+} from "@sahil/lib/graphql/__generated__/graphql";
+import { allStatuses } from "./constants";
+import { useAppendOrderStatus } from "@sahil/lib/hooks/orders";
+import { OrderInfoItem } from "../OrderDetails";
+import { formatDateTime } from "@sahil/lib/dates";
+import { HiOutlineHandRaised, HiCalendarDays } from "react-icons/hi2";
+import toast, { Toaster } from "react-hot-toast";
+
+const status = z.enum(allStatuses);
+
+const statusSchema = z.object({
+  status: status,
+  // note: z.string().min(10, 'Note must be at least 10 characters.'),
+});
+
+type FormData = z.infer<typeof statusSchema>;
+
+type Props = {
+  order: Orders;
+};
+
+export const UpdateOrderStatusForm = ({ order }: Props) => {
+  const { appendOrderStatus, loading } = useAppendOrderStatus();
+  const isCanceled =
+    order.status_histories?.[0]?.status === Order_Status_Enum.Canceled;
+
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+  } = useForm<FormData>({
+    resolver: zodResolver(statusSchema),
+  });
+
+  const orderInfoItems = [
+    {
+      icon: <HiCalendarDays />,
+      label: "Order Date",
+      value: formatDateTime(order?.created_at),
+    },
+    {
+      icon: <HiOutlineHandRaised />,
+      label: "Status",
+      value: order?.status_histories?.[0]?.status ?? "Pending",
+    },
+  ];
+
+  const onSubmit = async (data: FormData) => {
+    if (loading) return;
+    const validatedInput = statusSchema.parse(data);
+
+    try {
+      await appendOrderStatus({
+        variables: {
+          object: {
+            order_id: order.id,
+            status: validatedInput.status,
+          },
+        },
+      });
+      toast.success("Order status updated successfully");
+    } catch (error) {
+      console.error("Error appending order status:", error);
+      toast.error("Order status couldn't be updated, try again later.");
+    }
+  };
+
+  return (
+    <>
+      <Card>
+        <div className="space-y-4">
+          <div className="space-y-2">
+            <h3>Current Order Status</h3>
+            <div className="w-full grid grid-cols-1 md:grid-cols-2 gap-4">
+              {orderInfoItems.map((item, index) => (
+                <OrderInfoItem
+                  key={index}
+                  icon={item.icon}
+                  label={item.label}
+                  value={item.value}
+                />
+              ))}
+            </div>
+          </div>
+
+          <form
+            onSubmit={handleSubmit(onSubmit)}
+            className="space-y-2 max-w-xl"
+          >
+            <h3>Manage Order Status</h3>
+
+            <div className="grid grid-cols-2 gap-2">
+              <Select
+                name="status"
+                label="New Status"
+                register={register}
+                errors={errors}
+                options={status.options}
+                defaultValue={order?.status_histories?.[0]?.status as string}
+                disabled={isCanceled}
+              />
+
+              {!isCanceled && (
+                <button
+                  type="submit"
+                  className={`w-fit btn btn-sm normal-case btn-primary ${
+                    loading && "animate-pulse cursor-not-allowed"
+                  }`}
+                  disabled={loading}
+                >
+                  Update
+                </button>
+              )}
+            </div>
+          </form>
+        </div>
+
+        {order?.status_histories?.[0]?.status ===
+          Order_Status_Enum.Canceled && <p>Order Has Been Cancelled</p>}
+      </Card>
+      <Toaster position="bottom-center" reverseOrder={false} />
+    </>
+  );
+};
diff --git a/packages/features/Orders/OrderProgress/UpdateOrderStatusModal.tsx b/packages/features/Orders/OrderProgress/UpdateOrderStatusModal.tsx
deleted file mode 100644
index 2d9258bf..00000000
--- a/packages/features/Orders/OrderProgress/UpdateOrderStatusModal.tsx
+++ /dev/null
@@ -1,88 +0,0 @@
-import { z } from 'zod';
-import { useRef } from 'react';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useForm } from 'react-hook-form';
-import Modal from 'ui/components/Modal';
-import { Input, Select } from 'ui';
-import { Orders } from '@sahil/lib/graphql/__generated__/graphql';
-import { allStatuses } from './constants';
-import { useAppendOrderStatus } from '@sahil/lib/hooks/orders';
-
-const status = z.enum(allStatuses);
-
-const statusSchema = z.object({
-  status: status,
-  // note: z.string().min(10, 'Note must be at least 10 characters.'),
-});
-
-type FormData = z.infer<typeof statusSchema>;
-
-type Props = {
-  order: Orders;
-};
-
-export const UpdateOrderStatusModal = ({ order }: Props) => {
-  const id = `update-${order.id}-status`;
-  const closeBtn = useRef<HTMLButtonElement>(null);
-  const { appendOrderStatus, loading } = useAppendOrderStatus();
-
-  const {
-    register,
-    handleSubmit,
-    formState: { errors },
-  } = useForm<FormData>({
-    resolver: zodResolver(statusSchema),
-  });
-
-  const onSubmit = async (data: FormData) => {
-    if (loading) return;
-    const validatedInput = statusSchema.parse(data);
-
-    try {
-      await appendOrderStatus({
-        variables: {
-          object: {
-            order_id: order.id,
-            status: validatedInput.status,
-          },
-        },
-      });
-      closeBtn.current?.click();
-    } catch (error) {
-      console.error('Error appending order status:', error);
-    }
-  };
-
-  return (
-    <Modal
-      id={id}
-      CloseBtnRef={closeBtn}
-      btnSize='sm'
-      btnStyle='primary'
-      CTA='Update Status'
-      title='Append New Status'
-    >
-      <form onSubmit={handleSubmit(onSubmit)} className='space-y-4'>
-        <div className='my-4 space-y-2'>
-          <Select
-            name='status'
-            label='New Status'
-            register={register}
-            errors={errors}
-            options={status.options}
-          />
-          {/* <Input name='note' label='Note' register={register} errors={errors} /> */}
-        </div>
-
-        <button
-          type='submit'
-          className={`w-full btn normal-case btn-primary ${
-            loading && 'animate-pulse'
-          }`}
-        >
-          Submit
-        </button>
-      </form>
-    </Modal>
-  );
-};
diff --git a/packages/features/Orders/OrderProgress/constants.ts b/packages/features/Orders/OrderProgress/constants.ts
index c9432fba..5e36ec39 100644
--- a/packages/features/Orders/OrderProgress/constants.ts
+++ b/packages/features/Orders/OrderProgress/constants.ts
@@ -1,17 +1,17 @@
 export const allStatuses = [
-  'PENDING',
-  'CONFIRMED',
-  'ENROUTE',
-  'DELIVERED',
-  'FULFILLED',
-  'CANCELED',
+  "PENDING",
+  "CONFIRMED",
+  "ENROUTE",
+  "DELIVERED",
+  "FULFILLED",
+  "CANCELED",
 ] as const;
 
 export const statusLabels = {
-  PENDING: 'Order received, awaiting confirmation.',
-  CONFIRMED: 'Order confirmed, preparing for shipment.',
-  ENROUTE: 'Order in transit, awaiting delivery.',
-  DELIVERED: 'Order delivered, awaiting confirmation.',
-  FULFILLED: 'Order completed, thank you for shopping with us.',
+  PENDING: "Order received, awaiting confirmation.",
+  CONFIRMED: "Order confirmed, preparing for shipment.",
+  ENROUTE: "Order in transit, awaiting delivery.",
+  DELIVERED: "Order delivered, awaiting confirmation.",
+  FULFILLED: "Order completed, thank you for shopping with us.",
   CANCELED: "Order canceled, we're sorry for any inconvenience.",
 };
diff --git a/packages/features/Orders/constants.ts b/packages/features/Orders/constants.ts
index 9f364f80..1d857736 100644
--- a/packages/features/Orders/constants.ts
+++ b/packages/features/Orders/constants.ts
@@ -6,3 +6,61 @@ export const steps = [
   "payment_details",
   "summary",
 ] as const;
+
+import {
+  HiOutlineBell,
+  HiOutlineEnvelope,
+  HiOutlinePhone,
+  HiXMark,
+  HiOutlineCreditCard,
+  HiOutlineBanknotes,
+  HiArrowSmallRight,
+  HiOutlinePrinter,
+  HiOutlineBuildingOffice,
+  HiOutlineMapPin,
+} from "react-icons/hi2";
+
+export const paymentMethods = [
+  { id: "momo", label: "Momo Pay", icon: HiOutlineCreditCard, value: "momo" },
+  {
+    id: "cash",
+    label: "Cash On Delivery",
+    icon: HiOutlineBanknotes,
+    value: "cash",
+  },
+];
+
+export const deliveryMethods = [
+  {
+    id: "sahilCentre",
+    label: "Sahil Centre",
+    value: "sahilCentre",
+    icon: HiOutlineBuildingOffice,
+  },
+  {
+    id: "directDelivery",
+    label: "Direct Delivery",
+    value: "directDelivery",
+    icon: HiOutlineMapPin,
+  },
+];
+
+export const notificationOptions = [
+  {
+    id: "30min",
+    label: "30 minutes before",
+    value: "30min",
+    icon: HiOutlineBell,
+  },
+  {
+    id: "dayBefore",
+    label: "A day before",
+    value: "dayBefore",
+    icon: HiOutlineBell,
+  },
+];
+
+export const contactMethodOptions = [
+  { id: "email", label: "Email", value: "email", icon: HiOutlineEnvelope },
+  { id: "phone", label: "Phone", value: "phone", icon: HiOutlinePhone },
+];
diff --git a/packages/features/Orders/index.ts b/packages/features/Orders/index.ts
index 4ba11c13..ac7cb0c2 100644
--- a/packages/features/Orders/index.ts
+++ b/packages/features/Orders/index.ts
@@ -7,4 +7,4 @@ export * from "./OrderClient";
 export * from "./OrderDetails";
 
 export * from "./OrderProgress/OrderProgress";
-export * from "./OrderProgress/UpdateOrderStatusModal";
\ No newline at end of file
+export * from "./OrderProgress/UpdateOrderStatusForm";
diff --git a/packages/features/Products/ProductOverviewCard.tsx b/packages/features/Products/ProductOverviewCard.tsx
index 8fe0ecee..0e5cf0ec 100644
--- a/packages/features/Products/ProductOverviewCard.tsx
+++ b/packages/features/Products/ProductOverviewCard.tsx
@@ -42,9 +42,7 @@ export const ProductSummary = ({
   return (
     <div className="card card-bordered card-compact relative">
       <figure className="aspect-video relative">
-        <img 
-          src={product.mainImage || placeholder} alt={product.name} 
-        />
+        <img src={product.mainImage || placeholder} alt={product.name} />
         <div className="absolute top-0 right-0 mt-3 mr-3 badge badge-success items-center text-[0.65rem] text-white">
           98
           <HiOutlineSparkles />
@@ -71,7 +69,7 @@ export const ProductSummary = ({
             ) : null}
           </div>
         </div>
-        <hr className="my-3"/>
+        <hr className="my-3" />
         <div className="card-actions items-center">
           {isAdding ? (
             <QuantityInput
diff --git a/packages/features/Products/ProductsCatalogue.tsx b/packages/features/Products/ProductsCatalogue.tsx
index e6a50317..1c73d5cb 100644
--- a/packages/features/Products/ProductsCatalogue.tsx
+++ b/packages/features/Products/ProductsCatalogue.tsx
@@ -78,7 +78,7 @@ export const ProductsCatalogue = () => {
 
   return (
     <section className="space-y-4">
-      <ListHeader size={productsCount.count} sizeLabel="Products">
+      <ListHeader size={productsCount?.count} sizeLabel="Products">
         <ListPagination
           onNextPage={() => setOffset((prev) => prev + 10)}
           onPreviousPage={() => setOffset((prev) => prev - 10)}
diff --git a/packages/features/Suppliers/SupplierOverviewCard.tsx b/packages/features/Suppliers/SupplierOverviewCard.tsx
index 67f478b2..6b3137a2 100644
--- a/packages/features/Suppliers/SupplierOverviewCard.tsx
+++ b/packages/features/Suppliers/SupplierOverviewCard.tsx
@@ -30,8 +30,8 @@ export const SupplierOverviewCard: FC<Props> = ({ supplier }) => {
               </div>
             )}
           </Link>
-          <Link 
-            href={`/suppliers/${supplier.id}`} 
+          <Link
+            href={`/suppliers/${supplier.id}`}
             className="card-title max-w-[35ch] leading-tight text-base"
           >
             {supplier.name}
@@ -43,7 +43,7 @@ export const SupplierOverviewCard: FC<Props> = ({ supplier }) => {
       </div>
       <div className="mt-4 flex flex-col h-full">
         <div className="mt-1 overflow-hidden text-ellipsis">
-          <span className="font-medium">Category:</span> {''}
+          <span className="font-medium">Category:</span> {""}
           {supplier.categories.map(({ category_name: name }, index) => (
             <span key={name} className="text-xs text-zinc-500">
               {formatCategoryName(name)}
@@ -55,9 +55,7 @@ export const SupplierOverviewCard: FC<Props> = ({ supplier }) => {
       <div className="my-4 flex flex-col bg-base-100 border p-4 gap-4 rounded-lg">
         <div className="w-full flex justify-between items-center">
           <div className="font-semibold">
-            <p className="text-gray-500 text-xs font-normal">
-              Service Zone
-            </p>
+            <p className="text-gray-500 text-xs font-normal">Service Zone</p>
             <p className="capitalize">{supplier.zone}</p>
           </div>
           <div className="font-semibold">
diff --git a/packages/features/Users/CreateUser.tsx b/packages/features/Users/CreateUser.tsx
index f4473053..7b39dfbe 100644
--- a/packages/features/Users/CreateUser.tsx
+++ b/packages/features/Users/CreateUser.tsx
@@ -33,12 +33,7 @@ type FormData = z.infer<typeof userInfoSchema>;
 
 export const CreateUser = () => {
   // const { registerUser, data, loading, error } = useRegisterUserAction();
-  const {
-    addUserInvite,
-    data: invites,
-    loading,
-    error,
-  } = useAddUserInvite();
+  const { addUserInvite, data: invites, loading, error } = useAddUserInvite();
 
   const {
     register,
diff --git a/packages/features/Users/ListUsers.tsx b/packages/features/Users/ListUsers.tsx
index 1cdc2026..0f145951 100644
--- a/packages/features/Users/ListUsers.tsx
+++ b/packages/features/Users/ListUsers.tsx
@@ -1,30 +1,17 @@
 import { UserOverview } from "./UserOverview";
 import { UsersToolbar } from "./UsersToolbar";
+import {  useFetchUsers} from "@sahil/lib/hooks/users";
 
-const users = [
-  {
-    id: 1,
-    name: "John Doe",
-    avatar: "https://avatars.dicebear.com/api/initials/JD.svg",
-  },
-  {
-    id: 2,
-    name: "John Doe",
-    avatar: "https://avatars.dicebear.com/api/initials/JD.svg",
-  },
-  {
-    id: 3,
-    name: "John Doe",
-    avatar: "https://avatars.dicebear.com/api/initials/JD.svg",
-  },
-];
 
 export const ListUsers = () => {
+  const { data: users, loading, error } = useFetchUsers();
+  if (loading) return <div>Loading...</div>;
+  if (error) return <div>Error: {error.message}</div>;
   return (
     <section className="space-y-2">
       <UsersToolbar />
       <div className="space-y-2">
-        {users.map((user) => (
+        {users?.map((user) => (
           <UserOverview key={user.id} user={user} />
         ))}
       </div>
diff --git a/packages/features/Users/UserOverview.tsx b/packages/features/Users/UserOverview.tsx
index d9b167bc..ba924626 100644
--- a/packages/features/Users/UserOverview.tsx
+++ b/packages/features/Users/UserOverview.tsx
@@ -3,17 +3,11 @@ import { Avatar, Card } from "ui";
 import { Users } from "@sahil/lib/graphql/__generated__/graphql";
 import Link from "next/link";
 
-type Props = {
-  user: Users;
-} & {
-  avatar?: string;
-};
 
-export const UserOverview: FC<Props> = ({ user }) => {
+export const UserOverview = ({ user }: any) => {
   return (
     <Card>
       <div className="flex items-center gap-4">
-        {user?.avatar && <Avatar src={user?.avatar} alt={user.name} />}
         <h3>
           <Link href={`/users/${user.id}`}>{user.name}</Link>
         </h3>
diff --git a/packages/features/auth/AuthCard.tsx b/packages/features/auth/AuthCard.tsx
index 39a9af32..b2f1fcfd 100644
--- a/packages/features/auth/AuthCard.tsx
+++ b/packages/features/auth/AuthCard.tsx
@@ -10,7 +10,13 @@ type Props = {
   title: string;
 };
 
-const AuthCard = ({ providers=[], logo="", appTitle, illustration="", form }: Props) => {
+const AuthCard = ({
+  providers = [],
+  logo = "",
+  appTitle,
+  illustration = "",
+  form,
+}: Props) => {
   return (
     <section className="w-full max-w-7xl mx-auto lg:max-w-full">
       <div className="flex h-[90vh]">
@@ -26,13 +32,17 @@ const AuthCard = ({ providers=[], logo="", appTitle, illustration="", form }: Pr
                 />
                 <h3 className="text-sm font-semibold">{appTitle}</h3>
               </div>
-              <h2 className="my-4 text-xl font-semibold">Sign in to your account</h2>
+              <h2 className="my-4 text-xl font-semibold">
+                Sign in to your account
+              </h2>
             </div>
             {form}
             <div>
               {providers && (
                 <div className="w-full">
-                  <div className="py-3 w-3/6 mx-auto flex items-center my-3 text-xs text-neutral-500 uppercase before:flex-1 before:border-t before:border-zinc-200 before:me-6 after:flex-1 after:border-t after:border-zinc-200 after:ms-6">Or</div>
+                  <div className="py-3 w-3/6 mx-auto flex items-center my-3 text-xs text-neutral-500 uppercase before:flex-1 before:border-t before:border-zinc-200 before:me-6 after:flex-1 after:border-t after:border-zinc-200 after:ms-6">
+                    Or
+                  </div>
                   <AuthProviders providers={providers} />
                 </div>
               )}
@@ -45,7 +55,9 @@ const AuthCard = ({ providers=[], logo="", appTitle, illustration="", form }: Pr
               <div className="absolute w-16 h-16 top-0 right-0 bg-zinc-200 rounded-bl-full rounded-tr-none z-20" />
               <h3 className="text-xl mt-4 font-semibold">Join our Community</h3>
               <p className="text-sm my-2">
-                The best platform to find reliable suppliers, connect with businesses, manage orders, ensure timely deliveries and much more.
+                The best platform to find reliable suppliers, connect with
+                businesses, manage orders, ensure timely deliveries and much
+                more.
               </p>
             </div>
             <div className="overflow-hidden absolute bottom-0 left-0">
diff --git a/packages/features/businesses/BusinessOverviewCard.tsx b/packages/features/businesses/BusinessOverviewCard.tsx
index f2bb30a7..da67bf38 100644
--- a/packages/features/businesses/BusinessOverviewCard.tsx
+++ b/packages/features/businesses/BusinessOverviewCard.tsx
@@ -51,20 +51,14 @@ export const BusinessOverviewCard: FC<Props> = ({ business }) => {
       <div className="my-4 flex flex-col bg-base-100 border p-4 gap-4 rounded-lg">
         <div className="w-full flex justify-between items-center">
           <div className="font-semibold">
-            <p className="text-gray-500 text-xs font-normal">
-              Business Type
-            </p>
-            <p className="capitalize">
-              {business.type}
-            </p>
+            <p className="text-gray-500 text-xs font-normal">Business Type</p>
+            <p className="capitalize">{business.type}</p>
           </div>
           <div className="font-semibold">
             <p className="text-gray-500 text-xs font-normal text-right">
               Contact Name
             </p>
-            <p className="capitalize text-right">
-              {business.contactName}
-            </p>
+            <p className="capitalize text-right">{business.contactName}</p>
           </div>
         </div>
       </div>
@@ -78,8 +72,7 @@ export const BusinessOverviewCard: FC<Props> = ({ business }) => {
               </span>
               <p className="truncate ...">{address.street_address}</p>
             </div>
-          ))
-        }
+          ))}
       </div>
       <div className="my-3">
         <div className="flex items-center gap-2">
diff --git a/packages/lib/dates.ts b/packages/lib/dates.ts
index e60ae518..1b4d86fc 100644
--- a/packages/lib/dates.ts
+++ b/packages/lib/dates.ts
@@ -15,7 +15,7 @@ export const isValidTimeString = (time: string): boolean => {
 
 export const formatCurrentDate = (): string => {
   const currentDate = new Date();
-  return format(currentDate, 'EEEE, MMMM d, yyyy');
+  return format(currentDate, "EEEE, MMMM d, yyyy");
 };
 
 export const formatDateTime = (
diff --git a/packages/lib/graphql/__generated__/gql.ts b/packages/lib/graphql/__generated__/gql.ts
index 26cd0151..a94a725d 100644
--- a/packages/lib/graphql/__generated__/gql.ts
+++ b/packages/lib/graphql/__generated__/gql.ts
@@ -60,19 +60,19 @@ const documents = {
     types.GetCouriersByPkDocument,
   "\n  fragment DeliveryFields on delivery {\n    id\n    created_at\n  }\n":
     types.DeliveryFieldsFragmentDoc,
-  "\n  fragment DeliveryRequestFields on delivery_request {\n    id\n    created_at\n  }\n":
+  "\n  fragment DeliveryRequestFields on delivery_request {\n    id\n    created_at\n    delivery_method\n    status\n    courierId\n    created_at\n    updated_at\n  }\n":
     types.DeliveryRequestFieldsFragmentDoc,
-  "\n  \n  query getDeliveries {\n    delivery {\n      ...DeliveryFields\n    }\n    delivery_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n":
+  "\n  \n  query getDeliveries {\n    delivery {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n    delivery_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n":
     types.GetDeliveriesDocument,
-  "\n  \n  query getDeliveryByPK($id: uuid!) {\n    delivery(where: {id: {_eq: $id}}) {\n      ...DeliveryFields\n    }\n  }\n":
+  "\n  \n  query getDeliveryByPK($id: uuid!) {\n    delivery(where: { id: { _eq: $id } }) {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      status\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n  }\n":
     types.GetDeliveryByPkDocument,
-  "\n  \n  query getDeliveriesByCourier($courier_id: uuid!) {\n    delivery(where: {courierId: {_eq: $courier_id}}) {\n      ...DeliveryFields\n    }\n  }\n":
+  "\n  \n  query getDeliveriesByCourier($courier_id: uuid!) {\n    delivery(where: { courierId: { _eq: $courier_id } }) {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n  }\n":
     types.GetDeliveriesByCourierDocument,
-  "\n  \n  query getDeliveryRequests {\n    delivery_request {\n      ...DeliveryRequestFields\n    }\n    delivery_request_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n":
+  "\n  \n  query getDeliveryRequests {\n    delivery_request {\n      ...DeliveryRequestFields\n      delivery_request_orders {\n        id\n        order_id\n        order {\n          id\n          order_items {\n            id\n            product {\n              id\n              description\n              discount\n              inStock\n              mainImage\n              name\n              quantity\n              price\n            }\n          }\n        }\n      }\n    }\n    delivery_request_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n":
     types.GetDeliveryRequestsDocument,
-  "\n  \n  query getDeliveryRequestByPK($id: uuid!) {\n    delivery_request(where: {id: {_eq: $id}}) {\n      ...DeliveryRequestFields\n    }\n  }\n":
+  "\n  \n  query getDeliveryRequestByPK($id: uuid!) {\n    delivery_request(where: { id: { _eq: $id } }) {\n      ...DeliveryRequestFields\n      delivery_request_orders {\n        id\n        order_id\n        order {\n          id\n          order_items {\n            id\n            product {\n              id\n              description\n              discount\n              inStock\n              mainImage\n              name\n              quantity\n              price\n            }\n          }\n        }\n      }\n    }\n  }\n":
     types.GetDeliveryRequestByPkDocument,
-  "\n  \n  query getDeliveryRequestByCourier($courier_id: uuid!) {\n    delivery_request(where: {courierId: {_eq: $courier_id}}) {\n      ...DeliveryRequestFields\n    }\n  }\n":
+  "\n  \n  query getDeliveryRequestByCourier($courier_id: uuid!) {\n    delivery_request(where: { courierId: { _eq: $courier_id } }) {\n      ...DeliveryRequestFields\n    }\n  }\n":
     types.GetDeliveryRequestByCourierDocument,
   "\n  query fetchSahilZones {\n    locations {\n      id\n    }\n  }\n":
     types.FetchSahilZonesDocument,
@@ -88,7 +88,7 @@ const documents = {
     types.AllStatusHistoriesFragmentDoc,
   "\n  \n  \n  \n  query getOrders {\n    orders {\n      ...OrderCoreFields\n      ...LatestStatusHistory\n      business {\n        ...OrderBusinessFields\n      }\n    }\n    orders_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n":
     types.GetOrdersDocument,
-  "\n  \n  \n  \n  query getOrderByPK($id: uuid!) {\n    orders_by_pk(id: $id) {\n      ...OrderCoreFields\n      ...OrderItemsAggregate\n      ...AllStatusHistories\n      order_items {\n        id\n        product {\n          id\n          name\n          quantity\n          price\n        }\n      }\n      agent {\n        name\n      }\n    }\n  }\n":
+  "\n  \n  \n  \n  \n  query getOrderByPK($id: uuid!) {\n    orders_by_pk(id: $id) {\n      ...OrderCoreFields\n      ...OrderItemsAggregate\n      ...AllStatusHistories\n      business {\n        ...OrderBusinessFields\n      }\n      order_items {\n        id\n        product {\n          id\n          name\n          quantity\n          price\n        }\n      }\n      agent {\n        name\n      }\n    }\n  }\n":
     types.GetOrderByPkDocument,
   "\n  query getOrderDeliveries($orderId: uuid!) {\n    delivery {\n      status\n      id\n      created_at\n      courierId\n    }\n  }\n":
     types.GetOrderDeliveriesDocument,
@@ -138,7 +138,7 @@ const documents = {
     types.ZoneFieldsFragmentDoc,
   "\n  \n  query GetZones {\n    zones {\n      ...ZoneFields\n    }\n  }\n":
     types.GetZonesDocument,
-  "\n  \n  query GetZonesById($id: uuid!) {\n    zones(where: { id: {_eq: $id } }) {\n      ...ZoneFields\n    }\n  }\n":
+  "\n  \n  query GetZonesById($id: uuid!) {\n    zones(where: { id: { _eq: $id } }) {\n      ...ZoneFields\n    }\n  }\n":
     types.GetZonesByIdDocument,
 };
 
@@ -304,44 +304,44 @@ export function gql(
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  fragment DeliveryRequestFields on delivery_request {\n    id\n    created_at\n  }\n"
-): (typeof documents)["\n  fragment DeliveryRequestFields on delivery_request {\n    id\n    created_at\n  }\n"];
+  source: "\n  fragment DeliveryRequestFields on delivery_request {\n    id\n    created_at\n    delivery_method\n    status\n    courierId\n    created_at\n    updated_at\n  }\n"
+): (typeof documents)["\n  fragment DeliveryRequestFields on delivery_request {\n    id\n    created_at\n    delivery_method\n    status\n    courierId\n    created_at\n    updated_at\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query getDeliveries {\n    delivery {\n      ...DeliveryFields\n    }\n    delivery_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"
-): (typeof documents)["\n  \n  query getDeliveries {\n    delivery {\n      ...DeliveryFields\n    }\n    delivery_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"];
+  source: "\n  \n  query getDeliveries {\n    delivery {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n    delivery_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"
+): (typeof documents)["\n  \n  query getDeliveries {\n    delivery {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n    delivery_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query getDeliveryByPK($id: uuid!) {\n    delivery(where: {id: {_eq: $id}}) {\n      ...DeliveryFields\n    }\n  }\n"
-): (typeof documents)["\n  \n  query getDeliveryByPK($id: uuid!) {\n    delivery(where: {id: {_eq: $id}}) {\n      ...DeliveryFields\n    }\n  }\n"];
+  source: "\n  \n  query getDeliveryByPK($id: uuid!) {\n    delivery(where: { id: { _eq: $id } }) {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      status\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n  }\n"
+): (typeof documents)["\n  \n  query getDeliveryByPK($id: uuid!) {\n    delivery(where: { id: { _eq: $id } }) {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      status\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query getDeliveriesByCourier($courier_id: uuid!) {\n    delivery(where: {courierId: {_eq: $courier_id}}) {\n      ...DeliveryFields\n    }\n  }\n"
-): (typeof documents)["\n  \n  query getDeliveriesByCourier($courier_id: uuid!) {\n    delivery(where: {courierId: {_eq: $courier_id}}) {\n      ...DeliveryFields\n    }\n  }\n"];
+  source: "\n  \n  query getDeliveriesByCourier($courier_id: uuid!) {\n    delivery(where: { courierId: { _eq: $courier_id } }) {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n  }\n"
+): (typeof documents)["\n  \n  query getDeliveriesByCourier($courier_id: uuid!) {\n    delivery(where: { courierId: { _eq: $courier_id } }) {\n      ...DeliveryFields\n      order {\n      customerId\n      created_at\n      order_items {\n        product {\n          created_at\n          description\n          discount\n          name\n          price\n          quantity\n          inStock\n        }\n      }\n    }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query getDeliveryRequests {\n    delivery_request {\n      ...DeliveryRequestFields\n    }\n    delivery_request_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"
-): (typeof documents)["\n  \n  query getDeliveryRequests {\n    delivery_request {\n      ...DeliveryRequestFields\n    }\n    delivery_request_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"];
+  source: "\n  \n  query getDeliveryRequests {\n    delivery_request {\n      ...DeliveryRequestFields\n      delivery_request_orders {\n        id\n        order_id\n        order {\n          id\n          order_items {\n            id\n            product {\n              id\n              description\n              discount\n              inStock\n              mainImage\n              name\n              quantity\n              price\n            }\n          }\n        }\n      }\n    }\n    delivery_request_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"
+): (typeof documents)["\n  \n  query getDeliveryRequests {\n    delivery_request {\n      ...DeliveryRequestFields\n      delivery_request_orders {\n        id\n        order_id\n        order {\n          id\n          order_items {\n            id\n            product {\n              id\n              description\n              discount\n              inStock\n              mainImage\n              name\n              quantity\n              price\n            }\n          }\n        }\n      }\n    }\n    delivery_request_aggregate {\n      aggregate {\n        count(columns: id, distinct: true)\n      }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query getDeliveryRequestByPK($id: uuid!) {\n    delivery_request(where: {id: {_eq: $id}}) {\n      ...DeliveryRequestFields\n    }\n  }\n"
-): (typeof documents)["\n  \n  query getDeliveryRequestByPK($id: uuid!) {\n    delivery_request(where: {id: {_eq: $id}}) {\n      ...DeliveryRequestFields\n    }\n  }\n"];
+  source: "\n  \n  query getDeliveryRequestByPK($id: uuid!) {\n    delivery_request(where: { id: { _eq: $id } }) {\n      ...DeliveryRequestFields\n      delivery_request_orders {\n        id\n        order_id\n        order {\n          id\n          order_items {\n            id\n            product {\n              id\n              description\n              discount\n              inStock\n              mainImage\n              name\n              quantity\n              price\n            }\n          }\n        }\n      }\n    }\n  }\n"
+): (typeof documents)["\n  \n  query getDeliveryRequestByPK($id: uuid!) {\n    delivery_request(where: { id: { _eq: $id } }) {\n      ...DeliveryRequestFields\n      delivery_request_orders {\n        id\n        order_id\n        order {\n          id\n          order_items {\n            id\n            product {\n              id\n              description\n              discount\n              inStock\n              mainImage\n              name\n              quantity\n              price\n            }\n          }\n        }\n      }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query getDeliveryRequestByCourier($courier_id: uuid!) {\n    delivery_request(where: {courierId: {_eq: $courier_id}}) {\n      ...DeliveryRequestFields\n    }\n  }\n"
-): (typeof documents)["\n  \n  query getDeliveryRequestByCourier($courier_id: uuid!) {\n    delivery_request(where: {courierId: {_eq: $courier_id}}) {\n      ...DeliveryRequestFields\n    }\n  }\n"];
+  source: "\n  \n  query getDeliveryRequestByCourier($courier_id: uuid!) {\n    delivery_request(where: { courierId: { _eq: $courier_id } }) {\n      ...DeliveryRequestFields\n    }\n  }\n"
+): (typeof documents)["\n  \n  query getDeliveryRequestByCourier($courier_id: uuid!) {\n    delivery_request(where: { courierId: { _eq: $courier_id } }) {\n      ...DeliveryRequestFields\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
@@ -388,8 +388,8 @@ export function gql(
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  \n  \n  query getOrderByPK($id: uuid!) {\n    orders_by_pk(id: $id) {\n      ...OrderCoreFields\n      ...OrderItemsAggregate\n      ...AllStatusHistories\n      order_items {\n        id\n        product {\n          id\n          name\n          quantity\n          price\n        }\n      }\n      agent {\n        name\n      }\n    }\n  }\n"
-): (typeof documents)["\n  \n  \n  \n  query getOrderByPK($id: uuid!) {\n    orders_by_pk(id: $id) {\n      ...OrderCoreFields\n      ...OrderItemsAggregate\n      ...AllStatusHistories\n      order_items {\n        id\n        product {\n          id\n          name\n          quantity\n          price\n        }\n      }\n      agent {\n        name\n      }\n    }\n  }\n"];
+  source: "\n  \n  \n  \n  \n  query getOrderByPK($id: uuid!) {\n    orders_by_pk(id: $id) {\n      ...OrderCoreFields\n      ...OrderItemsAggregate\n      ...AllStatusHistories\n      business {\n        ...OrderBusinessFields\n      }\n      order_items {\n        id\n        product {\n          id\n          name\n          quantity\n          price\n        }\n      }\n      agent {\n        name\n      }\n    }\n  }\n"
+): (typeof documents)["\n  \n  \n  \n  \n  query getOrderByPK($id: uuid!) {\n    orders_by_pk(id: $id) {\n      ...OrderCoreFields\n      ...OrderItemsAggregate\n      ...AllStatusHistories\n      business {\n        ...OrderBusinessFields\n      }\n      order_items {\n        id\n        product {\n          id\n          name\n          quantity\n          price\n        }\n      }\n      agent {\n        name\n      }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
@@ -538,8 +538,8 @@ export function gql(
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: "\n  \n  query GetZonesById($id: uuid!) {\n    zones(where: { id: {_eq: $id } }) {\n      ...ZoneFields\n    }\n  }\n"
-): (typeof documents)["\n  \n  query GetZonesById($id: uuid!) {\n    zones(where: { id: {_eq: $id } }) {\n      ...ZoneFields\n    }\n  }\n"];
+  source: "\n  \n  query GetZonesById($id: uuid!) {\n    zones(where: { id: { _eq: $id } }) {\n      ...ZoneFields\n    }\n  }\n"
+): (typeof documents)["\n  \n  query GetZonesById($id: uuid!) {\n    zones(where: { id: { _eq: $id } }) {\n      ...ZoneFields\n    }\n  }\n"];
 
 export function gql(source: string) {
   return (documents as any)[source] ?? {};
diff --git a/packages/lib/graphql/__generated__/graphql.ts b/packages/lib/graphql/__generated__/graphql.ts
index 73e1d81f..b93b3b71 100644
--- a/packages/lib/graphql/__generated__/graphql.ts
+++ b/packages/lib/graphql/__generated__/graphql.ts
@@ -36,6 +36,29 @@ export type Scalars = {
   uuid: { input: any; output: any };
 };
 
+export type AccountBalanceResponse = {
+  __typename?: "AccountBalanceResponse";
+  availableBalance?: Maybe<Scalars["String"]["output"]>;
+  currency?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type Address = {
+  __typename?: "Address";
+  location?: Maybe<GeoCoords>;
+  placeId?: Maybe<Scalars["String"]["output"]>;
+  types?: Maybe<Array<Maybe<Scalars["String"]["output"]>>>;
+};
+
+export type BasicUserInfoResponse = {
+  __typename?: "BasicUserInfoResponse";
+  birthdate?: Maybe<Scalars["String"]["output"]>;
+  family_name?: Maybe<Scalars["String"]["output"]>;
+  gender?: Maybe<Scalars["String"]["output"]>;
+  given_name?: Maybe<Scalars["String"]["output"]>;
+  locale?: Maybe<Scalars["String"]["output"]>;
+  status?: Maybe<Scalars["String"]["output"]>;
+};
+
 /** Boolean expression to compare columns of type "Boolean". All fields are combined with logical 'AND'. */
 export type Boolean_Array_Comparison_Exp = {
   /** is the array contained in the given array value */
@@ -66,6 +89,37 @@ export type Boolean_Comparison_Exp = {
   _nin?: InputMaybe<Array<Scalars["Boolean"]["input"]>>;
 };
 
+export type CreateAccessTokenResponse = {
+  __typename?: "CreateAccessTokenResponse";
+  expires_in?: Maybe<Scalars["Int"]["output"]>;
+  token?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type DirectionLeg = {
+  __typename?: "DirectionLeg";
+  distance?: Maybe<LegDistance>;
+  duration?: Maybe<LegDuration>;
+};
+
+export type DirectionRoute = {
+  __typename?: "DirectionRoute";
+  legs?: Maybe<Array<Maybe<DirectionLeg>>>;
+  name?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type Directions = {
+  __typename?: "Directions";
+  endLocation?: Maybe<GeoCoords>;
+  routes?: Maybe<DirectionRoute>;
+  startLocation?: Maybe<GeoCoords>;
+};
+
+export type GeoCoords = {
+  __typename?: "GeoCoords";
+  lat?: Maybe<Scalars["Float"]["output"]>;
+  lng?: Maybe<Scalars["Float"]["output"]>;
+};
+
 /** Boolean expression to compare columns of type "Int". All fields are combined with logical 'AND'. */
 export type Int_Comparison_Exp = {
   _eq?: InputMaybe<Scalars["Int"]["input"]>;
@@ -79,6 +133,25 @@ export type Int_Comparison_Exp = {
   _nin?: InputMaybe<Array<Scalars["Int"]["input"]>>;
 };
 
+export type LegDistance = {
+  __typename?: "LegDistance";
+  text?: Maybe<Scalars["String"]["output"]>;
+  value?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type LegDuration = {
+  __typename?: "LegDuration";
+  text?: Maybe<Scalars["String"]["output"]>;
+  value?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type LocationByCoords = {
+  __typename?: "LocationByCoords";
+  location?: Maybe<GeoCoords>;
+  placeId?: Maybe<Scalars["String"]["output"]>;
+  types?: Maybe<Array<Maybe<Scalars["String"]["output"]>>>;
+};
+
 export type OrderStatusHistoryOutput = {
   __typename?: "OrderStatusHistoryOutput";
   created_at: Scalars["timestamptz"]["output"];
@@ -87,6 +160,66 @@ export type OrderStatusHistoryOutput = {
   status: Scalars["String"]["output"];
 };
 
+export type PayerInput = {
+  partyId: Scalars["String"]["input"];
+  partyIdType: Scalars["String"]["input"];
+};
+
+export type PaymentStatusResponse = {
+  __typename?: "PaymentStatusResponse";
+  financialTransactionId?: Maybe<Scalars["String"]["output"]>;
+  reason?: Maybe<Scalars["String"]["output"]>;
+  referenceId?: Maybe<Scalars["String"]["output"]>;
+  status?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type Places = {
+  __typename?: "Places";
+  address?: Maybe<Scalars["String"]["output"]>;
+  lat?: Maybe<Scalars["Float"]["output"]>;
+  lng?: Maybe<Scalars["Float"]["output"]>;
+  location?: Maybe<Scalars["String"]["output"]>;
+  name?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type PreApprovalStatusResponse = {
+  __typename?: "PreApprovalStatusResponse";
+  expirationDateTime?: Maybe<Scalars["String"]["output"]>;
+  payer?: Maybe<Scalars["String"]["output"]>;
+  payerCurrency?: Maybe<Scalars["String"]["output"]>;
+  payerMessage?: Maybe<Scalars["String"]["output"]>;
+  reason?: Maybe<Scalars["String"]["output"]>;
+  status?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type RequestToPayInput = {
+  amount: Scalars["Float"]["input"];
+  currency?: InputMaybe<Scalars["String"]["input"]>;
+  externalId: Scalars["String"]["input"];
+  payeeNote?: InputMaybe<Scalars["String"]["input"]>;
+  payer: PayerInput;
+  payerMessage?: InputMaybe<Scalars["String"]["input"]>;
+};
+
+export type RequestToPayResponse = {
+  __typename?: "RequestToPayResponse";
+  message?: Maybe<Scalars["String"]["output"]>;
+  status?: Maybe<Scalars["String"]["output"]>;
+};
+
+export type RequestToPayTransactionStatusResponse = {
+  __typename?: "RequestToPayTransactionStatusResponse";
+  amount?: Maybe<Scalars["String"]["output"]>;
+  currency?: Maybe<Scalars["String"]["output"]>;
+  externalId?: Maybe<Scalars["String"]["output"]>;
+  financialTransactionId?: Maybe<Scalars["String"]["output"]>;
+  payeeNote?: Maybe<Scalars["String"]["output"]>;
+  payer?: Maybe<Scalars["String"]["output"]>;
+  payerMessage?: Maybe<Scalars["String"]["output"]>;
+  reason?: Maybe<Scalars["String"]["output"]>;
+  status?: Maybe<Scalars["String"]["output"]>;
+};
+
 /** Boolean expression to compare columns of type "String". All fields are combined with logical 'AND'. */
 export type String_Comparison_Exp = {
   _eq?: InputMaybe<Scalars["String"]["input"]>;
@@ -120,6 +253,34 @@ export type String_Comparison_Exp = {
   _similar?: InputMaybe<Scalars["String"]["input"]>;
 };
 
+export type UserInfoWithConsentResponse = {
+  __typename?: "UserInfoWithConsentResponse";
+  active?: Maybe<Scalars["Boolean"]["output"]>;
+  address?: Maybe<Scalars["String"]["output"]>;
+  birthdate?: Maybe<Scalars["String"]["output"]>;
+  city_of_birth?: Maybe<Scalars["String"]["output"]>;
+  country_of_birth?: Maybe<Scalars["String"]["output"]>;
+  credit_score?: Maybe<Scalars["String"]["output"]>;
+  email?: Maybe<Scalars["String"]["output"]>;
+  email_verified?: Maybe<Scalars["Boolean"]["output"]>;
+  employer_name?: Maybe<Scalars["String"]["output"]>;
+  family_name?: Maybe<Scalars["String"]["output"]>;
+  gender?: Maybe<Scalars["String"]["output"]>;
+  given_name?: Maybe<Scalars["String"]["output"]>;
+  identification_type?: Maybe<Scalars["String"]["output"]>;
+  identification_value?: Maybe<Scalars["String"]["output"]>;
+  locale?: Maybe<Scalars["String"]["output"]>;
+  middle_name?: Maybe<Scalars["String"]["output"]>;
+  name?: Maybe<Scalars["String"]["output"]>;
+  occupation?: Maybe<Scalars["String"]["output"]>;
+  phone_number?: Maybe<Scalars["String"]["output"]>;
+  phone_number_verified?: Maybe<Scalars["Boolean"]["output"]>;
+  region_of_birth?: Maybe<Scalars["String"]["output"]>;
+  status?: Maybe<Scalars["String"]["output"]>;
+  sub?: Maybe<Scalars["String"]["output"]>;
+  updated_at?: Maybe<Scalars["Int"]["output"]>;
+};
+
 /** columns and relationships of "accounts" */
 export type Accounts = {
   __typename?: "accounts";
@@ -3391,6 +3552,10 @@ export type Delivery_Request = {
   courierId?: Maybe<Scalars["uuid"]["output"]>;
   created_at: Scalars["timestamptz"]["output"];
   delivery_method?: Maybe<Scalars["String"]["output"]>;
+  /** An array relationship */
+  delivery_request_orders: Array<Delivery_Request_Orders>;
+  /** An aggregate relationship */
+  delivery_request_orders_aggregate: Delivery_Request_Orders_Aggregate;
   id: Scalars["uuid"]["output"];
   /** An object relationship */
   request_status?: Maybe<Delivery_Request_Status>;
@@ -3398,6 +3563,24 @@ export type Delivery_Request = {
   updated_at?: Maybe<Scalars["timestamptz"]["output"]>;
 };
 
+/** columns and relationships of "delivery_request" */
+export type Delivery_RequestDelivery_Request_OrdersArgs = {
+  distinct_on?: InputMaybe<Array<Delivery_Request_Orders_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Delivery_Request_Orders_Order_By>>;
+  where?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+};
+
+/** columns and relationships of "delivery_request" */
+export type Delivery_RequestDelivery_Request_Orders_AggregateArgs = {
+  distinct_on?: InputMaybe<Array<Delivery_Request_Orders_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Delivery_Request_Orders_Order_By>>;
+  where?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+};
+
 /** aggregated selection of "delivery_request" */
 export type Delivery_Request_Aggregate = {
   __typename?: "delivery_request_aggregate";
@@ -3405,6 +3588,17 @@ export type Delivery_Request_Aggregate = {
   nodes: Array<Delivery_Request>;
 };
 
+export type Delivery_Request_Aggregate_Bool_Exp = {
+  count?: InputMaybe<Delivery_Request_Aggregate_Bool_Exp_Count>;
+};
+
+export type Delivery_Request_Aggregate_Bool_Exp_Count = {
+  arguments?: InputMaybe<Array<Delivery_Request_Select_Column>>;
+  distinct?: InputMaybe<Scalars["Boolean"]["input"]>;
+  filter?: InputMaybe<Delivery_Request_Bool_Exp>;
+  predicate: Int_Comparison_Exp;
+};
+
 /** aggregate fields of "delivery_request" */
 export type Delivery_Request_Aggregate_Fields = {
   __typename?: "delivery_request_aggregate_fields";
@@ -3419,6 +3613,20 @@ export type Delivery_Request_Aggregate_FieldsCountArgs = {
   distinct?: InputMaybe<Scalars["Boolean"]["input"]>;
 };
 
+/** order by aggregate values of table "delivery_request" */
+export type Delivery_Request_Aggregate_Order_By = {
+  count?: InputMaybe<Order_By>;
+  max?: InputMaybe<Delivery_Request_Max_Order_By>;
+  min?: InputMaybe<Delivery_Request_Min_Order_By>;
+};
+
+/** input type for inserting array relation for remote table "delivery_request" */
+export type Delivery_Request_Arr_Rel_Insert_Input = {
+  data: Array<Delivery_Request_Insert_Input>;
+  /** upsert condition */
+  on_conflict?: InputMaybe<Delivery_Request_On_Conflict>;
+};
+
 /** Boolean expression to filter rows from the table "delivery_request". All fields are combined with a logical 'AND'. */
 export type Delivery_Request_Bool_Exp = {
   _and?: InputMaybe<Array<Delivery_Request_Bool_Exp>>;
@@ -3427,6 +3635,8 @@ export type Delivery_Request_Bool_Exp = {
   courierId?: InputMaybe<Uuid_Comparison_Exp>;
   created_at?: InputMaybe<Timestamptz_Comparison_Exp>;
   delivery_method?: InputMaybe<String_Comparison_Exp>;
+  delivery_request_orders?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+  delivery_request_orders_aggregate?: InputMaybe<Delivery_Request_Orders_Aggregate_Bool_Exp>;
   id?: InputMaybe<Uuid_Comparison_Exp>;
   request_status?: InputMaybe<Delivery_Request_Status_Bool_Exp>;
   status?: InputMaybe<Delivery_Request_Status_Enum_Comparison_Exp>;
@@ -3444,6 +3654,7 @@ export type Delivery_Request_Insert_Input = {
   courierId?: InputMaybe<Scalars["uuid"]["input"]>;
   created_at?: InputMaybe<Scalars["timestamptz"]["input"]>;
   delivery_method?: InputMaybe<Scalars["String"]["input"]>;
+  delivery_request_orders?: InputMaybe<Delivery_Request_Orders_Arr_Rel_Insert_Input>;
   id?: InputMaybe<Scalars["uuid"]["input"]>;
   request_status?: InputMaybe<Delivery_Request_Status_Obj_Rel_Insert_Input>;
   status?: InputMaybe<Delivery_Request_Status_Enum>;
@@ -3460,6 +3671,15 @@ export type Delivery_Request_Max_Fields = {
   updated_at?: Maybe<Scalars["timestamptz"]["output"]>;
 };
 
+/** order by max() on columns of table "delivery_request" */
+export type Delivery_Request_Max_Order_By = {
+  courierId?: InputMaybe<Order_By>;
+  created_at?: InputMaybe<Order_By>;
+  delivery_method?: InputMaybe<Order_By>;
+  id?: InputMaybe<Order_By>;
+  updated_at?: InputMaybe<Order_By>;
+};
+
 /** aggregate min on columns */
 export type Delivery_Request_Min_Fields = {
   __typename?: "delivery_request_min_fields";
@@ -3470,6 +3690,15 @@ export type Delivery_Request_Min_Fields = {
   updated_at?: Maybe<Scalars["timestamptz"]["output"]>;
 };
 
+/** order by min() on columns of table "delivery_request" */
+export type Delivery_Request_Min_Order_By = {
+  courierId?: InputMaybe<Order_By>;
+  created_at?: InputMaybe<Order_By>;
+  delivery_method?: InputMaybe<Order_By>;
+  id?: InputMaybe<Order_By>;
+  updated_at?: InputMaybe<Order_By>;
+};
+
 /** response of any mutation on the table "delivery_request" */
 export type Delivery_Request_Mutation_Response = {
   __typename?: "delivery_request_mutation_response";
@@ -3479,6 +3708,13 @@ export type Delivery_Request_Mutation_Response = {
   returning: Array<Delivery_Request>;
 };
 
+/** input type for inserting object relation for remote table "delivery_request" */
+export type Delivery_Request_Obj_Rel_Insert_Input = {
+  data: Delivery_Request_Insert_Input;
+  /** upsert condition */
+  on_conflict?: InputMaybe<Delivery_Request_On_Conflict>;
+};
+
 /** on_conflict condition type for table "delivery_request" */
 export type Delivery_Request_On_Conflict = {
   constraint: Delivery_Request_Constraint;
@@ -3491,6 +3727,7 @@ export type Delivery_Request_Order_By = {
   courierId?: InputMaybe<Order_By>;
   created_at?: InputMaybe<Order_By>;
   delivery_method?: InputMaybe<Order_By>;
+  delivery_request_orders_aggregate?: InputMaybe<Delivery_Request_Orders_Aggregate_Order_By>;
   id?: InputMaybe<Order_By>;
   request_status?: InputMaybe<Delivery_Request_Status_Order_By>;
   status?: InputMaybe<Order_By>;
@@ -3501,8 +3738,12 @@ export type Delivery_Request_Order_By = {
 export type Delivery_Request_Orders = {
   __typename?: "delivery_request_orders";
   created_at: Scalars["timestamptz"]["output"];
+  /** An object relationship */
+  delivery_request: Delivery_Request;
   delivery_request_id: Scalars["uuid"]["output"];
   id: Scalars["uuid"]["output"];
+  /** An object relationship */
+  order: Orders;
   order_id: Scalars["uuid"]["output"];
 };
 
@@ -3513,6 +3754,17 @@ export type Delivery_Request_Orders_Aggregate = {
   nodes: Array<Delivery_Request_Orders>;
 };
 
+export type Delivery_Request_Orders_Aggregate_Bool_Exp = {
+  count?: InputMaybe<Delivery_Request_Orders_Aggregate_Bool_Exp_Count>;
+};
+
+export type Delivery_Request_Orders_Aggregate_Bool_Exp_Count = {
+  arguments?: InputMaybe<Array<Delivery_Request_Orders_Select_Column>>;
+  distinct?: InputMaybe<Scalars["Boolean"]["input"]>;
+  filter?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+  predicate: Int_Comparison_Exp;
+};
+
 /** aggregate fields of "delivery_request_orders" */
 export type Delivery_Request_Orders_Aggregate_Fields = {
   __typename?: "delivery_request_orders_aggregate_fields";
@@ -3527,14 +3779,30 @@ export type Delivery_Request_Orders_Aggregate_FieldsCountArgs = {
   distinct?: InputMaybe<Scalars["Boolean"]["input"]>;
 };
 
+/** order by aggregate values of table "delivery_request_orders" */
+export type Delivery_Request_Orders_Aggregate_Order_By = {
+  count?: InputMaybe<Order_By>;
+  max?: InputMaybe<Delivery_Request_Orders_Max_Order_By>;
+  min?: InputMaybe<Delivery_Request_Orders_Min_Order_By>;
+};
+
+/** input type for inserting array relation for remote table "delivery_request_orders" */
+export type Delivery_Request_Orders_Arr_Rel_Insert_Input = {
+  data: Array<Delivery_Request_Orders_Insert_Input>;
+  /** upsert condition */
+  on_conflict?: InputMaybe<Delivery_Request_Orders_On_Conflict>;
+};
+
 /** Boolean expression to filter rows from the table "delivery_request_orders". All fields are combined with a logical 'AND'. */
 export type Delivery_Request_Orders_Bool_Exp = {
   _and?: InputMaybe<Array<Delivery_Request_Orders_Bool_Exp>>;
   _not?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
   _or?: InputMaybe<Array<Delivery_Request_Orders_Bool_Exp>>;
   created_at?: InputMaybe<Timestamptz_Comparison_Exp>;
+  delivery_request?: InputMaybe<Delivery_Request_Bool_Exp>;
   delivery_request_id?: InputMaybe<Uuid_Comparison_Exp>;
   id?: InputMaybe<Uuid_Comparison_Exp>;
+  order?: InputMaybe<Orders_Bool_Exp>;
   order_id?: InputMaybe<Uuid_Comparison_Exp>;
 };
 
@@ -3547,8 +3815,10 @@ export enum Delivery_Request_Orders_Constraint {
 /** input type for inserting data into table "delivery_request_orders" */
 export type Delivery_Request_Orders_Insert_Input = {
   created_at?: InputMaybe<Scalars["timestamptz"]["input"]>;
+  delivery_request?: InputMaybe<Delivery_Request_Obj_Rel_Insert_Input>;
   delivery_request_id?: InputMaybe<Scalars["uuid"]["input"]>;
   id?: InputMaybe<Scalars["uuid"]["input"]>;
+  order?: InputMaybe<Orders_Obj_Rel_Insert_Input>;
   order_id?: InputMaybe<Scalars["uuid"]["input"]>;
 };
 
@@ -3561,6 +3831,14 @@ export type Delivery_Request_Orders_Max_Fields = {
   order_id?: Maybe<Scalars["uuid"]["output"]>;
 };
 
+/** order by max() on columns of table "delivery_request_orders" */
+export type Delivery_Request_Orders_Max_Order_By = {
+  created_at?: InputMaybe<Order_By>;
+  delivery_request_id?: InputMaybe<Order_By>;
+  id?: InputMaybe<Order_By>;
+  order_id?: InputMaybe<Order_By>;
+};
+
 /** aggregate min on columns */
 export type Delivery_Request_Orders_Min_Fields = {
   __typename?: "delivery_request_orders_min_fields";
@@ -3570,6 +3848,14 @@ export type Delivery_Request_Orders_Min_Fields = {
   order_id?: Maybe<Scalars["uuid"]["output"]>;
 };
 
+/** order by min() on columns of table "delivery_request_orders" */
+export type Delivery_Request_Orders_Min_Order_By = {
+  created_at?: InputMaybe<Order_By>;
+  delivery_request_id?: InputMaybe<Order_By>;
+  id?: InputMaybe<Order_By>;
+  order_id?: InputMaybe<Order_By>;
+};
+
 /** response of any mutation on the table "delivery_request_orders" */
 export type Delivery_Request_Orders_Mutation_Response = {
   __typename?: "delivery_request_orders_mutation_response";
@@ -3589,8 +3875,10 @@ export type Delivery_Request_Orders_On_Conflict = {
 /** Ordering options when selecting data from "delivery_request_orders". */
 export type Delivery_Request_Orders_Order_By = {
   created_at?: InputMaybe<Order_By>;
+  delivery_request?: InputMaybe<Delivery_Request_Order_By>;
   delivery_request_id?: InputMaybe<Order_By>;
   id?: InputMaybe<Order_By>;
+  order?: InputMaybe<Orders_Order_By>;
   order_id?: InputMaybe<Order_By>;
 };
 
@@ -3688,9 +3976,31 @@ export type Delivery_Request_Set_Input = {
 /** columns and relationships of "delivery_request_status" */
 export type Delivery_Request_Status = {
   __typename?: "delivery_request_status";
+  /** An array relationship */
+  delivery_requests: Array<Delivery_Request>;
+  /** An aggregate relationship */
+  delivery_requests_aggregate: Delivery_Request_Aggregate;
   status: Scalars["String"]["output"];
 };
 
+/** columns and relationships of "delivery_request_status" */
+export type Delivery_Request_StatusDelivery_RequestsArgs = {
+  distinct_on?: InputMaybe<Array<Delivery_Request_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Delivery_Request_Order_By>>;
+  where?: InputMaybe<Delivery_Request_Bool_Exp>;
+};
+
+/** columns and relationships of "delivery_request_status" */
+export type Delivery_Request_StatusDelivery_Requests_AggregateArgs = {
+  distinct_on?: InputMaybe<Array<Delivery_Request_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Delivery_Request_Order_By>>;
+  where?: InputMaybe<Delivery_Request_Bool_Exp>;
+};
+
 /** aggregated selection of "delivery_request_status" */
 export type Delivery_Request_Status_Aggregate = {
   __typename?: "delivery_request_status_aggregate";
@@ -3717,6 +4027,8 @@ export type Delivery_Request_Status_Bool_Exp = {
   _and?: InputMaybe<Array<Delivery_Request_Status_Bool_Exp>>;
   _not?: InputMaybe<Delivery_Request_Status_Bool_Exp>;
   _or?: InputMaybe<Array<Delivery_Request_Status_Bool_Exp>>;
+  delivery_requests?: InputMaybe<Delivery_Request_Bool_Exp>;
+  delivery_requests_aggregate?: InputMaybe<Delivery_Request_Aggregate_Bool_Exp>;
   status?: InputMaybe<String_Comparison_Exp>;
 };
 
@@ -3744,6 +4056,7 @@ export type Delivery_Request_Status_Enum_Comparison_Exp = {
 
 /** input type for inserting data into table "delivery_request_status" */
 export type Delivery_Request_Status_Insert_Input = {
+  delivery_requests?: InputMaybe<Delivery_Request_Arr_Rel_Insert_Input>;
   status?: InputMaybe<Scalars["String"]["input"]>;
 };
 
@@ -3784,6 +4097,7 @@ export type Delivery_Request_Status_On_Conflict = {
 
 /** Ordering options when selecting data from "delivery_request_status". */
 export type Delivery_Request_Status_Order_By = {
+  delivery_requests_aggregate?: InputMaybe<Delivery_Request_Aggregate_Order_By>;
   status?: InputMaybe<Order_By>;
 };
 
@@ -4745,6 +5059,7 @@ export type Mutation_Root = {
   __typename?: "mutation_root";
   /** add_order_status_history */
   add_order_status_history?: Maybe<OrderStatusHistoryOutput>;
+  createAccessToken?: Maybe<CreateAccessTokenResponse>;
   /** delete data from the table: "accounts" */
   delete_accounts?: Maybe<Accounts_Mutation_Response>;
   /** delete single row from the table: "accounts" */
@@ -5095,6 +5410,7 @@ export type Mutation_Root = {
   insert_zones?: Maybe<Zones_Mutation_Response>;
   /** insert a single row into the table: "zones" */
   insert_zones_one?: Maybe<Zones>;
+  requestToPay?: Maybe<RequestToPayResponse>;
   /** update data of the table: "accounts" */
   update_accounts?: Maybe<Accounts_Mutation_Response>;
   /** update single row of the table: "accounts" */
@@ -6374,6 +6690,11 @@ export type Mutation_RootInsert_Zones_OneArgs = {
   on_conflict?: InputMaybe<Zones_On_Conflict>;
 };
 
+/** mutation root */
+export type Mutation_RootRequestToPayArgs = {
+  object?: InputMaybe<RequestToPayInput>;
+};
+
 /** mutation root */
 export type Mutation_RootUpdate_AccountsArgs = {
   _inc?: InputMaybe<Accounts_Inc_Input>;
@@ -7841,12 +8162,34 @@ export type Order_Preference_Updates = {
 export type Order_Status = {
   __typename?: "order_status";
   /** An array relationship */
+  order_status_histories: Array<Order_Status_History>;
+  /** An aggregate relationship */
+  order_status_histories_aggregate: Order_Status_History_Aggregate;
+  /** An array relationship */
   orders: Array<Orders>;
   /** An aggregate relationship */
   orders_aggregate: Orders_Aggregate;
   status: Scalars["String"]["output"];
 };
 
+/** columns and relationships of "order_status" */
+export type Order_StatusOrder_Status_HistoriesArgs = {
+  distinct_on?: InputMaybe<Array<Order_Status_History_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Order_Status_History_Order_By>>;
+  where?: InputMaybe<Order_Status_History_Bool_Exp>;
+};
+
+/** columns and relationships of "order_status" */
+export type Order_StatusOrder_Status_Histories_AggregateArgs = {
+  distinct_on?: InputMaybe<Array<Order_Status_History_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Order_Status_History_Order_By>>;
+  where?: InputMaybe<Order_Status_History_Bool_Exp>;
+};
+
 /** columns and relationships of "order_status" */
 export type Order_StatusOrdersArgs = {
   distinct_on?: InputMaybe<Array<Orders_Select_Column>>;
@@ -7891,6 +8234,8 @@ export type Order_Status_Bool_Exp = {
   _and?: InputMaybe<Array<Order_Status_Bool_Exp>>;
   _not?: InputMaybe<Order_Status_Bool_Exp>;
   _or?: InputMaybe<Array<Order_Status_Bool_Exp>>;
+  order_status_histories?: InputMaybe<Order_Status_History_Bool_Exp>;
+  order_status_histories_aggregate?: InputMaybe<Order_Status_History_Aggregate_Bool_Exp>;
   orders?: InputMaybe<Orders_Bool_Exp>;
   orders_aggregate?: InputMaybe<Orders_Aggregate_Bool_Exp>;
   status?: InputMaybe<String_Comparison_Exp>;
@@ -7925,7 +8270,11 @@ export type Order_Status_History = {
   __typename?: "order_status_history";
   created_at: Scalars["timestamptz"]["output"];
   id: Scalars["uuid"]["output"];
+  /** An object relationship */
+  order: Orders;
   order_id: Scalars["uuid"]["output"];
+  /** An object relationship */
+  order_status: Order_Status;
   status: Order_Status_Enum;
 };
 
@@ -7982,7 +8331,9 @@ export type Order_Status_History_Bool_Exp = {
   _or?: InputMaybe<Array<Order_Status_History_Bool_Exp>>;
   created_at?: InputMaybe<Timestamptz_Comparison_Exp>;
   id?: InputMaybe<Uuid_Comparison_Exp>;
+  order?: InputMaybe<Orders_Bool_Exp>;
   order_id?: InputMaybe<Uuid_Comparison_Exp>;
+  order_status?: InputMaybe<Order_Status_Bool_Exp>;
   status?: InputMaybe<Order_Status_Enum_Comparison_Exp>;
 };
 
@@ -7996,7 +8347,9 @@ export enum Order_Status_History_Constraint {
 export type Order_Status_History_Insert_Input = {
   created_at?: InputMaybe<Scalars["timestamptz"]["input"]>;
   id?: InputMaybe<Scalars["uuid"]["input"]>;
+  order?: InputMaybe<Orders_Obj_Rel_Insert_Input>;
   order_id?: InputMaybe<Scalars["uuid"]["input"]>;
+  order_status?: InputMaybe<Order_Status_Obj_Rel_Insert_Input>;
   status?: InputMaybe<Order_Status_Enum>;
 };
 
@@ -8050,7 +8403,9 @@ export type Order_Status_History_On_Conflict = {
 export type Order_Status_History_Order_By = {
   created_at?: InputMaybe<Order_By>;
   id?: InputMaybe<Order_By>;
+  order?: InputMaybe<Orders_Order_By>;
   order_id?: InputMaybe<Order_By>;
+  order_status?: InputMaybe<Order_Status_Order_By>;
   status?: InputMaybe<Order_By>;
 };
 
@@ -8116,6 +8471,7 @@ export type Order_Status_History_Updates = {
 
 /** input type for inserting data into table "order_status" */
 export type Order_Status_Insert_Input = {
+  order_status_histories?: InputMaybe<Order_Status_History_Arr_Rel_Insert_Input>;
   orders?: InputMaybe<Orders_Arr_Rel_Insert_Input>;
   status?: InputMaybe<Scalars["String"]["input"]>;
 };
@@ -8141,6 +8497,13 @@ export type Order_Status_Mutation_Response = {
   returning: Array<Order_Status>;
 };
 
+/** input type for inserting object relation for remote table "order_status" */
+export type Order_Status_Obj_Rel_Insert_Input = {
+  data: Order_Status_Insert_Input;
+  /** upsert condition */
+  on_conflict?: InputMaybe<Order_Status_On_Conflict>;
+};
+
 /** on_conflict condition type for table "order_status" */
 export type Order_Status_On_Conflict = {
   constraint: Order_Status_Constraint;
@@ -8150,6 +8513,7 @@ export type Order_Status_On_Conflict = {
 
 /** Ordering options when selecting data from "order_status". */
 export type Order_Status_Order_By = {
+  order_status_histories_aggregate?: InputMaybe<Order_Status_History_Aggregate_Order_By>;
   orders_aggregate?: InputMaybe<Orders_Aggregate_Order_By>;
   status?: InputMaybe<Order_By>;
 };
@@ -8417,6 +8781,10 @@ export type Orders = {
   deliveries: Array<Delivery>;
   /** An aggregate relationship */
   deliveries_aggregate: Delivery_Aggregate;
+  /** An array relationship */
+  delivery_request_orders: Array<Delivery_Request_Orders>;
+  /** An aggregate relationship */
+  delivery_request_orders_aggregate: Delivery_Request_Orders_Aggregate;
   destination?: Maybe<Scalars["String"]["output"]>;
   fulfillment_type?: Maybe<Order_Fulfillment_Type_Enum>;
   id: Scalars["uuid"]["output"];
@@ -8427,6 +8795,8 @@ export type Orders = {
   order_items: Array<Order_Item>;
   /** An aggregate relationship */
   order_items_aggregate: Order_Item_Aggregate;
+  /** An object relationship */
+  order_status?: Maybe<Order_Status>;
   /** An array relationship */
   order_suppliers: Array<Order_Supplier>;
   /** An aggregate relationship */
@@ -8458,6 +8828,24 @@ export type OrdersDeliveries_AggregateArgs = {
   where?: InputMaybe<Delivery_Bool_Exp>;
 };
 
+/** columns and relationships of "orders" */
+export type OrdersDelivery_Request_OrdersArgs = {
+  distinct_on?: InputMaybe<Array<Delivery_Request_Orders_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Delivery_Request_Orders_Order_By>>;
+  where?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+};
+
+/** columns and relationships of "orders" */
+export type OrdersDelivery_Request_Orders_AggregateArgs = {
+  distinct_on?: InputMaybe<Array<Delivery_Request_Orders_Select_Column>>;
+  limit?: InputMaybe<Scalars["Int"]["input"]>;
+  offset?: InputMaybe<Scalars["Int"]["input"]>;
+  order_by?: InputMaybe<Array<Delivery_Request_Orders_Order_By>>;
+  where?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+};
+
 /** columns and relationships of "orders" */
 export type OrdersOrder_ItemsArgs = {
   distinct_on?: InputMaybe<Array<Order_Item_Select_Column>>;
@@ -8569,6 +8957,8 @@ export type Orders_Bool_Exp = {
   customerId?: InputMaybe<Uuid_Comparison_Exp>;
   deliveries?: InputMaybe<Delivery_Bool_Exp>;
   deliveries_aggregate?: InputMaybe<Delivery_Aggregate_Bool_Exp>;
+  delivery_request_orders?: InputMaybe<Delivery_Request_Orders_Bool_Exp>;
+  delivery_request_orders_aggregate?: InputMaybe<Delivery_Request_Orders_Aggregate_Bool_Exp>;
   destination?: InputMaybe<String_Comparison_Exp>;
   fulfillment_type?: InputMaybe<Order_Fulfillment_Type_Enum_Comparison_Exp>;
   id?: InputMaybe<Uuid_Comparison_Exp>;
@@ -8576,6 +8966,7 @@ export type Orders_Bool_Exp = {
   order_fulfillment_type?: InputMaybe<Order_Fulfillment_Type_Bool_Exp>;
   order_items?: InputMaybe<Order_Item_Bool_Exp>;
   order_items_aggregate?: InputMaybe<Order_Item_Aggregate_Bool_Exp>;
+  order_status?: InputMaybe<Order_Status_Bool_Exp>;
   order_suppliers?: InputMaybe<Order_Supplier_Bool_Exp>;
   order_suppliers_aggregate?: InputMaybe<Order_Supplier_Aggregate_Bool_Exp>;
   origin?: InputMaybe<String_Comparison_Exp>;
@@ -8598,12 +8989,14 @@ export type Orders_Insert_Input = {
   created_at?: InputMaybe<Scalars["timestamptz"]["input"]>;
   customerId?: InputMaybe<Scalars["uuid"]["input"]>;
   deliveries?: InputMaybe<Delivery_Arr_Rel_Insert_Input>;
+  delivery_request_orders?: InputMaybe<Delivery_Request_Orders_Arr_Rel_Insert_Input>;
   destination?: InputMaybe<Scalars["String"]["input"]>;
   fulfillment_type?: InputMaybe<Order_Fulfillment_Type_Enum>;
   id?: InputMaybe<Scalars["uuid"]["input"]>;
   orderId?: InputMaybe<Scalars["String"]["input"]>;
   order_fulfillment_type?: InputMaybe<Order_Fulfillment_Type_Obj_Rel_Insert_Input>;
   order_items?: InputMaybe<Order_Item_Arr_Rel_Insert_Input>;
+  order_status?: InputMaybe<Order_Status_Obj_Rel_Insert_Input>;
   order_suppliers?: InputMaybe<Order_Supplier_Arr_Rel_Insert_Input>;
   origin?: InputMaybe<Scalars["String"]["input"]>;
   processedBy?: InputMaybe<Scalars["uuid"]["input"]>;
@@ -8687,12 +9080,14 @@ export type Orders_Order_By = {
   created_at?: InputMaybe<Order_By>;
   customerId?: InputMaybe<Order_By>;
   deliveries_aggregate?: InputMaybe<Delivery_Aggregate_Order_By>;
+  delivery_request_orders_aggregate?: InputMaybe<Delivery_Request_Orders_Aggregate_Order_By>;
   destination?: InputMaybe<Order_By>;
   fulfillment_type?: InputMaybe<Order_By>;
   id?: InputMaybe<Order_By>;
   orderId?: InputMaybe<Order_By>;
   order_fulfillment_type?: InputMaybe<Order_Fulfillment_Type_Order_By>;
   order_items_aggregate?: InputMaybe<Order_Item_Aggregate_Order_By>;
+  order_status?: InputMaybe<Order_Status_Order_By>;
   order_suppliers_aggregate?: InputMaybe<Order_Supplier_Aggregate_Order_By>;
   origin?: InputMaybe<Order_By>;
   processedBy?: InputMaybe<Order_By>;
@@ -9281,12 +9676,14 @@ export type Products_Variance_Order_By = {
 
 export type Query_Root = {
   __typename?: "query_root";
+  accountBalance?: Maybe<AccountBalanceResponse>;
   /** An array relationship */
   accounts: Array<Accounts>;
   /** An aggregate relationship */
   accounts_aggregate: Accounts_Aggregate;
   /** fetch data from the table: "accounts" using primary key columns */
   accounts_by_pk?: Maybe<Accounts>;
+  address?: Maybe<Address>;
   /** An array relationship */
   addresses: Array<Addresses>;
   /** An aggregate relationship */
@@ -9305,6 +9702,7 @@ export type Query_Root = {
   agent_type_aggregate: Agent_Type_Aggregate;
   /** fetch data from the table: "agent_type" using primary key columns */
   agent_type_by_pk?: Maybe<Agent_Type>;
+  basicUserInfo?: Maybe<BasicUserInfoResponse>;
   /** fetch data from the table: "business" */
   business: Array<Business>;
   /** fetch aggregated fields from the table: "business" */
@@ -9329,6 +9727,7 @@ export type Query_Root = {
   contact_details_aggregate: Contact_Details_Aggregate;
   /** fetch data from the table: "contact_details" using primary key columns */
   contact_details_by_pk?: Maybe<Contact_Details>;
+  coords?: Maybe<LocationByCoords>;
   /** An array relationship */
   courier_rides: Array<Courier_Rides>;
   /** An aggregate relationship */
@@ -9365,9 +9764,9 @@ export type Query_Root = {
   delivery_request_aggregate: Delivery_Request_Aggregate;
   /** fetch data from the table: "delivery_request" using primary key columns */
   delivery_request_by_pk?: Maybe<Delivery_Request>;
-  /** fetch data from the table: "delivery_request_orders" */
+  /** An array relationship */
   delivery_request_orders: Array<Delivery_Request_Orders>;
-  /** fetch aggregated fields from the table: "delivery_request_orders" */
+  /** An aggregate relationship */
   delivery_request_orders_aggregate: Delivery_Request_Orders_Aggregate;
   /** fetch data from the table: "delivery_request_orders" using primary key columns */
   delivery_request_orders_by_pk?: Maybe<Delivery_Request_Orders>;
@@ -9383,6 +9782,7 @@ export type Query_Root = {
   delivery_status_aggregate: Delivery_Status_Aggregate;
   /** fetch data from the table: "delivery_status" using primary key columns */
   delivery_status_by_pk?: Maybe<Delivery_Status>;
+  directions?: Maybe<Directions>;
   /** fetch data from the table: "geography_columns" */
   geography_columns: Array<Geography_Columns>;
   /** fetch aggregated fields from the table: "geography_columns" */
@@ -9439,6 +9839,9 @@ export type Query_Root = {
   orders_aggregate: Orders_Aggregate;
   /** fetch data from the table: "orders" using primary key columns */
   orders_by_pk?: Maybe<Orders>;
+  paymentStatus?: Maybe<PaymentStatusResponse>;
+  places?: Maybe<Array<Maybe<Places>>>;
+  preApprovalStatus?: Maybe<PreApprovalStatusResponse>;
   /** An array relationship */
   products: Array<Products>;
   /** An aggregate relationship */
@@ -9457,6 +9860,7 @@ export type Query_Root = {
   reports_aggregate: Reports_Aggregate;
   /** fetch data from the table: "reports" using primary key columns */
   reports_by_pk?: Maybe<Reports>;
+  requestToPayTransactionStatus?: Maybe<RequestToPayTransactionStatusResponse>;
   /** fetch data from the table: "ride_status" */
   ride_status: Array<Ride_Status>;
   /** fetch aggregated fields from the table: "ride_status" */
@@ -9505,6 +9909,7 @@ export type Query_Root = {
   suppliers_categories_aggregate: Suppliers_Categories_Aggregate;
   /** fetch data from the table: "suppliers_categories" using primary key columns */
   suppliers_categories_by_pk?: Maybe<Suppliers_Categories>;
+  userInfoWithConsent?: Maybe<UserInfoWithConsentResponse>;
   /** An array relationship */
   user_invites: Array<User_Invites>;
   /** An aggregate relationship */
@@ -9569,6 +9974,11 @@ export type Query_RootAccounts_By_PkArgs = {
   id: Scalars["uuid"]["input"];
 };
 
+export type Query_RootAddressArgs = {
+  lat: Scalars["Float"]["input"];
+  lng: Scalars["Float"]["input"];
+};
+
 export type Query_RootAddressesArgs = {
   distinct_on?: InputMaybe<Array<Addresses_Select_Column>>;
   limit?: InputMaybe<Scalars["Int"]["input"]>;
@@ -9629,6 +10039,10 @@ export type Query_RootAgent_Type_By_PkArgs = {
   type: Scalars["String"]["input"];
 };
 
+export type Query_RootBasicUserInfoArgs = {
+  accountHolderMSISDN: Scalars["String"]["input"];
+};
+
 export type Query_RootBusinessArgs = {
   distinct_on?: InputMaybe<Array<Business_Select_Column>>;
   limit?: InputMaybe<Scalars["Int"]["input"]>;
@@ -9709,6 +10123,10 @@ export type Query_RootContact_Details_By_PkArgs = {
   id: Scalars["uuid"]["input"];
 };
 
+export type Query_RootCoordsArgs = {
+  address: Scalars["String"]["input"];
+};
+
 export type Query_RootCourier_RidesArgs = {
   distinct_on?: InputMaybe<Array<Courier_Rides_Select_Column>>;
   limit?: InputMaybe<Scalars["Int"]["input"]>;
@@ -9889,6 +10307,11 @@ export type Query_RootDelivery_Status_By_PkArgs = {
   status: Scalars["String"]["input"];
 };
 
+export type Query_RootDirectionsArgs = {
+  destination: Scalars["String"]["input"];
+  origin: Scalars["String"]["input"];
+};
+
 export type Query_RootGeography_ColumnsArgs = {
   distinct_on?: InputMaybe<Array<Geography_Columns_Select_Column>>;
   limit?: InputMaybe<Scalars["Int"]["input"]>;
@@ -10081,6 +10504,19 @@ export type Query_RootOrders_By_PkArgs = {
   id: Scalars["uuid"]["input"];
 };
 
+export type Query_RootPaymentStatusArgs = {
+  referenceId: Scalars["String"]["input"];
+};
+
+export type Query_RootPlacesArgs = {
+  lat: Scalars["Float"]["input"];
+  lng: Scalars["Float"]["input"];
+};
+
+export type Query_RootPreApprovalStatusArgs = {
+  referenceId: Scalars["String"]["input"];
+};
+
 export type Query_RootProductsArgs = {
   distinct_on?: InputMaybe<Array<Products_Select_Column>>;
   limit?: InputMaybe<Scalars["Int"]["input"]>;
@@ -10141,6 +10577,10 @@ export type Query_RootReports_By_PkArgs = {
   id: Scalars["uuid"]["input"];
 };
 
+export type Query_RootRequestToPayTransactionStatusArgs = {
+  referenceId: Scalars["String"]["input"];
+};
+
 export type Query_RootRide_StatusArgs = {
   distinct_on?: InputMaybe<Array<Ride_Status_Select_Column>>;
   limit?: InputMaybe<Scalars["Int"]["input"]>;
@@ -11634,9 +12074,9 @@ export type Subscription_Root = {
   delivery_request_aggregate: Delivery_Request_Aggregate;
   /** fetch data from the table: "delivery_request" using primary key columns */
   delivery_request_by_pk?: Maybe<Delivery_Request>;
-  /** fetch data from the table: "delivery_request_orders" */
+  /** An array relationship */
   delivery_request_orders: Array<Delivery_Request_Orders>;
-  /** fetch aggregated fields from the table: "delivery_request_orders" */
+  /** An aggregate relationship */
   delivery_request_orders_aggregate: Delivery_Request_Orders_Aggregate;
   /** fetch data from the table: "delivery_request_orders" using primary key columns */
   delivery_request_orders_by_pk?: Maybe<Delivery_Request_Orders>;
@@ -16045,13 +16485,39 @@ export type DeliveryRequestFieldsFragment = {
   __typename?: "delivery_request";
   id: any;
   created_at: any;
+  delivery_method?: string | null;
+  status?: Delivery_Request_Status_Enum | null;
+  courierId?: any | null;
+  updated_at?: any | null;
 };
 
 export type GetDeliveriesQueryVariables = Exact<{ [key: string]: never }>;
 
 export type GetDeliveriesQuery = {
   __typename?: "query_root";
-  delivery: Array<{ __typename?: "delivery"; id: any; created_at: any }>;
+  delivery: Array<{
+    __typename?: "delivery";
+    id: any;
+    created_at: any;
+    order: {
+      __typename?: "orders";
+      customerId?: any | null;
+      created_at: any;
+      order_items: Array<{
+        __typename?: "order_item";
+        product: {
+          __typename?: "products";
+          created_at: any;
+          description?: string | null;
+          discount?: number | null;
+          name?: string | null;
+          price?: number | null;
+          quantity: number;
+          inStock: boolean;
+        };
+      }>;
+    };
+  }>;
   delivery_aggregate: {
     __typename?: "delivery_aggregate";
     aggregate?: {
@@ -16067,7 +16533,30 @@ export type GetDeliveryByPkQueryVariables = Exact<{
 
 export type GetDeliveryByPkQuery = {
   __typename?: "query_root";
-  delivery: Array<{ __typename?: "delivery"; id: any; created_at: any }>;
+  delivery: Array<{
+    __typename?: "delivery";
+    id: any;
+    created_at: any;
+    order: {
+      __typename?: "orders";
+      customerId?: any | null;
+      created_at: any;
+      status?: Order_Status_Enum | null;
+      order_items: Array<{
+        __typename?: "order_item";
+        product: {
+          __typename?: "products";
+          created_at: any;
+          description?: string | null;
+          discount?: number | null;
+          name?: string | null;
+          price?: number | null;
+          quantity: number;
+          inStock: boolean;
+        };
+      }>;
+    };
+  }>;
 };
 
 export type GetDeliveriesByCourierQueryVariables = Exact<{
@@ -16076,17 +16565,67 @@ export type GetDeliveriesByCourierQueryVariables = Exact<{
 
 export type GetDeliveriesByCourierQuery = {
   __typename?: "query_root";
-  delivery: Array<{ __typename?: "delivery"; id: any; created_at: any }>;
-};
-
-export type GetDeliveryRequestsQueryVariables = Exact<{ [key: string]: never }>;
-
-export type GetDeliveryRequestsQuery = {
-  __typename?: "query_root";
-  delivery_request: Array<{
+  delivery: Array<{
+    __typename?: "delivery";
+    id: any;
+    created_at: any;
+    order: {
+      __typename?: "orders";
+      customerId?: any | null;
+      created_at: any;
+      order_items: Array<{
+        __typename?: "order_item";
+        product: {
+          __typename?: "products";
+          created_at: any;
+          description?: string | null;
+          discount?: number | null;
+          name?: string | null;
+          price?: number | null;
+          quantity: number;
+          inStock: boolean;
+        };
+      }>;
+    };
+  }>;
+};
+
+export type GetDeliveryRequestsQueryVariables = Exact<{ [key: string]: never }>;
+
+export type GetDeliveryRequestsQuery = {
+  __typename?: "query_root";
+  delivery_request: Array<{
     __typename?: "delivery_request";
     id: any;
     created_at: any;
+    delivery_method?: string | null;
+    status?: Delivery_Request_Status_Enum | null;
+    courierId?: any | null;
+    updated_at?: any | null;
+    delivery_request_orders: Array<{
+      __typename?: "delivery_request_orders";
+      id: any;
+      order_id: any;
+      order: {
+        __typename?: "orders";
+        id: any;
+        order_items: Array<{
+          __typename?: "order_item";
+          id: any;
+          product: {
+            __typename?: "products";
+            id: any;
+            description?: string | null;
+            discount?: number | null;
+            inStock: boolean;
+            mainImage?: string | null;
+            name?: string | null;
+            quantity: number;
+            price?: number | null;
+          };
+        }>;
+      };
+    }>;
   }>;
   delivery_request_aggregate: {
     __typename?: "delivery_request_aggregate";
@@ -16107,6 +16646,34 @@ export type GetDeliveryRequestByPkQuery = {
     __typename?: "delivery_request";
     id: any;
     created_at: any;
+    delivery_method?: string | null;
+    status?: Delivery_Request_Status_Enum | null;
+    courierId?: any | null;
+    updated_at?: any | null;
+    delivery_request_orders: Array<{
+      __typename?: "delivery_request_orders";
+      id: any;
+      order_id: any;
+      order: {
+        __typename?: "orders";
+        id: any;
+        order_items: Array<{
+          __typename?: "order_item";
+          id: any;
+          product: {
+            __typename?: "products";
+            id: any;
+            description?: string | null;
+            discount?: number | null;
+            inStock: boolean;
+            mainImage?: string | null;
+            name?: string | null;
+            quantity: number;
+            price?: number | null;
+          };
+        }>;
+      };
+    }>;
   }>;
 };
 
@@ -16120,6 +16687,10 @@ export type GetDeliveryRequestByCourierQuery = {
     __typename?: "delivery_request";
     id: any;
     created_at: any;
+    delivery_method?: string | null;
+    status?: Delivery_Request_Status_Enum | null;
+    courierId?: any | null;
+    updated_at?: any | null;
   }>;
 };
 
@@ -16225,6 +16796,13 @@ export type GetOrderByPkQuery = {
     customerId?: any | null;
     origin?: string | null;
     status?: Order_Status_Enum | null;
+    business?: {
+      __typename?: "business";
+      id: any;
+      contactName?: string | null;
+      phoneNumber?: string | null;
+      name?: string | null;
+    } | null;
     order_items: Array<{
       __typename?: "order_item";
       id: any;
@@ -16823,6 +17401,11 @@ export const DeliveryRequestFieldsFragmentDoc = {
         selections: [
           { kind: "Field", name: { kind: "Name", value: "id" } },
           { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "delivery_method" } },
+          { kind: "Field", name: { kind: "Name", value: "status" } },
+          { kind: "Field", name: { kind: "Name", value: "courierId" } },
+          { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "updated_at" } },
         ],
       },
     },
@@ -18871,6 +19454,72 @@ export const GetDeliveriesDocument = {
                   kind: "FragmentSpread",
                   name: { kind: "Name", value: "DeliveryFields" },
                 },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "order" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "customerId" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "created_at" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order_items" },
+                        selectionSet: {
+                          kind: "SelectionSet",
+                          selections: [
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "product" },
+                              selectionSet: {
+                                kind: "SelectionSet",
+                                selections: [
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "created_at" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: {
+                                      kind: "Name",
+                                      value: "description",
+                                    },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "discount" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "name" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "price" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "quantity" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "inStock" },
+                                  },
+                                ],
+                              },
+                            },
+                          ],
+                        },
+                      },
+                    ],
+                  },
+                },
               ],
             },
           },
@@ -18986,6 +19635,76 @@ export const GetDeliveryByPkDocument = {
                   kind: "FragmentSpread",
                   name: { kind: "Name", value: "DeliveryFields" },
                 },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "order" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "customerId" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "created_at" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "status" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order_items" },
+                        selectionSet: {
+                          kind: "SelectionSet",
+                          selections: [
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "product" },
+                              selectionSet: {
+                                kind: "SelectionSet",
+                                selections: [
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "created_at" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: {
+                                      kind: "Name",
+                                      value: "description",
+                                    },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "discount" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "name" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "price" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "quantity" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "inStock" },
+                                  },
+                                ],
+                              },
+                            },
+                          ],
+                        },
+                      },
+                    ],
+                  },
+                },
               ],
             },
           },
@@ -19073,6 +19792,72 @@ export const GetDeliveriesByCourierDocument = {
                   kind: "FragmentSpread",
                   name: { kind: "Name", value: "DeliveryFields" },
                 },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "order" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "customerId" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "created_at" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order_items" },
+                        selectionSet: {
+                          kind: "SelectionSet",
+                          selections: [
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "product" },
+                              selectionSet: {
+                                kind: "SelectionSet",
+                                selections: [
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "created_at" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: {
+                                      kind: "Name",
+                                      value: "description",
+                                    },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "discount" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "name" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "price" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "quantity" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "inStock" },
+                                  },
+                                ],
+                              },
+                            },
+                          ],
+                        },
+                      },
+                    ],
+                  },
+                },
               ],
             },
           },
@@ -19119,6 +19904,105 @@ export const GetDeliveryRequestsDocument = {
                   kind: "FragmentSpread",
                   name: { kind: "Name", value: "DeliveryRequestFields" },
                 },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "delivery_request_orders" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      { kind: "Field", name: { kind: "Name", value: "id" } },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order_id" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order" },
+                        selectionSet: {
+                          kind: "SelectionSet",
+                          selections: [
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "id" },
+                            },
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "order_items" },
+                              selectionSet: {
+                                kind: "SelectionSet",
+                                selections: [
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "id" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "product" },
+                                    selectionSet: {
+                                      kind: "SelectionSet",
+                                      selections: [
+                                        {
+                                          kind: "Field",
+                                          name: { kind: "Name", value: "id" },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "description",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "discount",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "inStock",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "mainImage",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: { kind: "Name", value: "name" },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "quantity",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "price",
+                                          },
+                                        },
+                                      ],
+                                    },
+                                  },
+                                ],
+                              },
+                            },
+                          ],
+                        },
+                      },
+                    ],
+                  },
+                },
               ],
             },
           },
@@ -19171,6 +20055,11 @@ export const GetDeliveryRequestsDocument = {
         selections: [
           { kind: "Field", name: { kind: "Name", value: "id" } },
           { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "delivery_method" } },
+          { kind: "Field", name: { kind: "Name", value: "status" } },
+          { kind: "Field", name: { kind: "Name", value: "courierId" } },
+          { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "updated_at" } },
         ],
       },
     },
@@ -19237,6 +20126,105 @@ export const GetDeliveryRequestByPkDocument = {
                   kind: "FragmentSpread",
                   name: { kind: "Name", value: "DeliveryRequestFields" },
                 },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "delivery_request_orders" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      { kind: "Field", name: { kind: "Name", value: "id" } },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order_id" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "order" },
+                        selectionSet: {
+                          kind: "SelectionSet",
+                          selections: [
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "id" },
+                            },
+                            {
+                              kind: "Field",
+                              name: { kind: "Name", value: "order_items" },
+                              selectionSet: {
+                                kind: "SelectionSet",
+                                selections: [
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "id" },
+                                  },
+                                  {
+                                    kind: "Field",
+                                    name: { kind: "Name", value: "product" },
+                                    selectionSet: {
+                                      kind: "SelectionSet",
+                                      selections: [
+                                        {
+                                          kind: "Field",
+                                          name: { kind: "Name", value: "id" },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "description",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "discount",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "inStock",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "mainImage",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: { kind: "Name", value: "name" },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "quantity",
+                                          },
+                                        },
+                                        {
+                                          kind: "Field",
+                                          name: {
+                                            kind: "Name",
+                                            value: "price",
+                                          },
+                                        },
+                                      ],
+                                    },
+                                  },
+                                ],
+                              },
+                            },
+                          ],
+                        },
+                      },
+                    ],
+                  },
+                },
               ],
             },
           },
@@ -19255,6 +20243,11 @@ export const GetDeliveryRequestByPkDocument = {
         selections: [
           { kind: "Field", name: { kind: "Name", value: "id" } },
           { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "delivery_method" } },
+          { kind: "Field", name: { kind: "Name", value: "status" } },
+          { kind: "Field", name: { kind: "Name", value: "courierId" } },
+          { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "updated_at" } },
         ],
       },
     },
@@ -19342,6 +20335,11 @@ export const GetDeliveryRequestByCourierDocument = {
         selections: [
           { kind: "Field", name: { kind: "Name", value: "id" } },
           { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "delivery_method" } },
+          { kind: "Field", name: { kind: "Name", value: "status" } },
+          { kind: "Field", name: { kind: "Name", value: "courierId" } },
+          { kind: "Field", name: { kind: "Name", value: "created_at" } },
+          { kind: "Field", name: { kind: "Name", value: "updated_at" } },
         ],
       },
     },
@@ -19586,6 +20584,19 @@ export const GetOrderByPkDocument = {
                   kind: "FragmentSpread",
                   name: { kind: "Name", value: "AllStatusHistories" },
                 },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "business" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      {
+                        kind: "FragmentSpread",
+                        name: { kind: "Name", value: "OrderBusinessFields" },
+                      },
+                    ],
+                  },
+                },
                 {
                   kind: "Field",
                   name: { kind: "Name", value: "order_items" },
@@ -19728,6 +20739,23 @@ export const GetOrderByPkDocument = {
         ],
       },
     },
+    {
+      kind: "FragmentDefinition",
+      name: { kind: "Name", value: "OrderBusinessFields" },
+      typeCondition: {
+        kind: "NamedType",
+        name: { kind: "Name", value: "business" },
+      },
+      selectionSet: {
+        kind: "SelectionSet",
+        selections: [
+          { kind: "Field", name: { kind: "Name", value: "id" } },
+          { kind: "Field", name: { kind: "Name", value: "contactName" } },
+          { kind: "Field", name: { kind: "Name", value: "phoneNumber" } },
+          { kind: "Field", name: { kind: "Name", value: "name" } },
+        ],
+      },
+    },
   ],
 } as unknown as DocumentNode<GetOrderByPkQuery, GetOrderByPkQueryVariables>;
 export const GetOrderDeliveriesDocument = {
diff --git a/packages/lib/graphql/fragments/orders.ts b/packages/lib/graphql/fragments/orders.ts
index 0bca1a1c..0f2d89d2 100644
--- a/packages/lib/graphql/fragments/orders.ts
+++ b/packages/lib/graphql/fragments/orders.ts
@@ -4,4 +4,4 @@ export const ORDER_FRAGMENT = gql`
   fragment order on orders {
     id
   }
-`;
\ No newline at end of file
+`;
diff --git a/packages/lib/graphql/queries/deliveries.ts b/packages/lib/graphql/queries/deliveries.ts
index 0fa3eaa3..136daf3f 100644
--- a/packages/lib/graphql/queries/deliveries.ts
+++ b/packages/lib/graphql/queries/deliveries.ts
@@ -1,4 +1,5 @@
 import { gql } from "@apollo/client";
+// import { OrderCoreFiel}
 
 export const DELIVERY_FIELDS = gql`
   fragment DeliveryFields on delivery {
@@ -11,6 +12,11 @@ export const DELIVERY_REQUEST_FIELDS = gql`
   fragment DeliveryRequestFields on delivery_request {
     id
     created_at
+    delivery_method
+    status
+    courierId
+    created_at
+    updated_at
   }
 `;
 
@@ -19,6 +25,21 @@ export const FETCH_DELIVERIES = gql`
   query getDeliveries {
     delivery {
       ...DeliveryFields
+      order {
+      customerId
+      created_at
+      order_items {
+        product {
+          created_at
+          description
+          discount
+          name
+          price
+          quantity
+          inStock
+        }
+      }
+    }
     }
     delivery_aggregate {
       aggregate {
@@ -31,26 +52,77 @@ export const FETCH_DELIVERIES = gql`
 export const FETCH_DELIVERY_BY_PK = gql`
   ${DELIVERY_FIELDS}
   query getDeliveryByPK($id: uuid!) {
-    delivery(where: {id: {_eq: $id}}) {
+    delivery(where: { id: { _eq: $id } }) {
       ...DeliveryFields
+      order {
+      customerId
+      created_at
+      status
+      order_items {
+        product {
+          created_at
+          description
+          discount
+          name
+          price
+          quantity
+          inStock
+        }
+      }
+    }
     }
   }
-`;  
+`;
 
 export const FETCH_DELIVERIES_BY_COURIER = gql`
   ${DELIVERY_FIELDS}
   query getDeliveriesByCourier($courier_id: uuid!) {
-    delivery(where: {courierId: {_eq: $courier_id}}) {
+    delivery(where: { courierId: { _eq: $courier_id } }) {
       ...DeliveryFields
+      order {
+      customerId
+      created_at
+      order_items {
+        product {
+          created_at
+          description
+          discount
+          name
+          price
+          quantity
+          inStock
+        }
+      }
+    }
     }
   }
-`;  
+`;
 
 export const FETCH_DELIVERY_REQUESTS = gql`
   ${DELIVERY_REQUEST_FIELDS}
   query getDeliveryRequests {
     delivery_request {
       ...DeliveryRequestFields
+      delivery_request_orders {
+        id
+        order_id
+        order {
+          id
+          order_items {
+            id
+            product {
+              id
+              description
+              discount
+              inStock
+              mainImage
+              name
+              quantity
+              price
+            }
+          }
+        }
+      }
     }
     delivery_request_aggregate {
       aggregate {
@@ -58,13 +130,33 @@ export const FETCH_DELIVERY_REQUESTS = gql`
       }
     }
   }
-`; 
+`;
 
 export const FETCH_DELIVERY_REQUEST_BY_PK = gql`
   ${DELIVERY_REQUEST_FIELDS}
   query getDeliveryRequestByPK($id: uuid!) {
-    delivery_request(where: {id: {_eq: $id}}) {
+    delivery_request(where: { id: { _eq: $id } }) {
       ...DeliveryRequestFields
+      delivery_request_orders {
+        id
+        order_id
+        order {
+          id
+          order_items {
+            id
+            product {
+              id
+              description
+              discount
+              inStock
+              mainImage
+              name
+              quantity
+              price
+            }
+          }
+        }
+      }
     }
   }
 `;
@@ -72,8 +164,8 @@ export const FETCH_DELIVERY_REQUEST_BY_PK = gql`
 export const FETCH_DELIVERY_REQUEST_BY_COURIER = gql`
   ${DELIVERY_REQUEST_FIELDS}
   query getDeliveryRequestByCourier($courier_id: uuid!) {
-    delivery_request(where: {courierId: {_eq: $courier_id}}) {
+    delivery_request(where: { courierId: { _eq: $courier_id } }) {
       ...DeliveryRequestFields
     }
   }
-`;
\ No newline at end of file
+`;
diff --git a/packages/lib/graphql/queries/orders.ts b/packages/lib/graphql/queries/orders.ts
index 69c59bfe..bb3e76cd 100644
--- a/packages/lib/graphql/queries/orders.ts
+++ b/packages/lib/graphql/queries/orders.ts
@@ -1,4 +1,4 @@
-import { gql } from '@apollo/client';
+import { gql } from "@apollo/client";
 
 export const ORDER_CORE_FIELDS = gql`
   fragment OrderCoreFields on orders {
@@ -72,11 +72,15 @@ export const FETCH_ORDER_BY_PK = gql`
   ${ORDER_CORE_FIELDS}
   ${ORDER_ITEMS_AGGREGATE}
   ${ALL_STATUS_HISTORIES}
+  ${ORDER_BUSINESS_FIELDS}
   query getOrderByPK($id: uuid!) {
     orders_by_pk(id: $id) {
       ...OrderCoreFields
       ...OrderItemsAggregate
       ...AllStatusHistories
+      business {
+        ...OrderBusinessFields
+      }
       order_items {
         id
         product {
diff --git a/packages/lib/graphql/queries/zones.ts b/packages/lib/graphql/queries/zones.ts
index ff0408af..073bca5b 100644
--- a/packages/lib/graphql/queries/zones.ts
+++ b/packages/lib/graphql/queries/zones.ts
@@ -22,8 +22,8 @@ export const GET_ZONES = gql`
 export const GET_ZONE_BY_ID = gql`
   ${ZONE_FIELDS}
   query GetZonesById($id: uuid!) {
-    zones(where: { id: {_eq: $id } }) {
+    zones(where: { id: { _eq: $id } }) {
       ...ZoneFields
     }
   }
-`;
\ No newline at end of file
+`;
diff --git a/packages/lib/hooks/businesses.tsx b/packages/lib/hooks/businesses.tsx
index 80bdab11..cbb61144 100644
--- a/packages/lib/hooks/businesses.tsx
+++ b/packages/lib/hooks/businesses.tsx
@@ -51,9 +51,8 @@ export const useFetchBusinesses = () => {
 };
 
 export const useRegisterBusiness = () => {
-  const [registerBusinessAction, { data, loading, error }] = useMutation(
-    INSERT_NEW_BUSINESS
-  );
+  const [registerBusinessAction, { data, loading, error }] =
+    useMutation(INSERT_NEW_BUSINESS);
   return {
     data: data?.registerBusinessAction,
     loading,
diff --git a/packages/lib/hooks/couriers.tsx b/packages/lib/hooks/couriers.tsx
index 659242c8..339100bd 100644
--- a/packages/lib/hooks/couriers.tsx
+++ b/packages/lib/hooks/couriers.tsx
@@ -9,6 +9,8 @@ import {
 import {
   GetCouriersQuery,
   GetCouriersQueryVariables,
+  GetCouriersByPkQuery,
+  GetCouriersByPkQueryVariables,
 } from "@sahil/lib/graphql/__generated__/graphql";
 
 export const useFetchCouriers = () => {
@@ -25,11 +27,12 @@ export const useFetchCouriers = () => {
 };
 
 export const useFetchCourierByPK = (id: string) => {
-  const { error, data, loading } = useQuery(FETCH_COURIER_BY_PK, {
+  const { error, data, loading } = useQuery<GetCouriersByPkQuery, GetCouriersByPkQueryVariables>(FETCH_COURIER_BY_PK, {
     variables: {
       id,
     },
   });
+  console.log("data", data);
   return { error, data: data?.couriers_by_pk, loading };
 };
 
diff --git a/packages/lib/hooks/deliveries.tsx b/packages/lib/hooks/deliveries.tsx
index 750aaf47..b4fd32e3 100644
--- a/packages/lib/hooks/deliveries.tsx
+++ b/packages/lib/hooks/deliveries.tsx
@@ -1,33 +1,49 @@
 import { useQuery, useMutation } from "@apollo/client";
-import { FETCH_DELIVERIES, FETCH_DELIVERY_BY_PK, FETCH_DELIVERIES_BY_COURIER, FETCH_DELIVERY_REQUESTS, FETCH_DELIVERY_REQUEST_BY_COURIER, FETCH_DELIVERY_REQUEST_BY_PK } from "../graphql/queries/deliveries";
+import {
+  FETCH_DELIVERIES,
+  FETCH_DELIVERY_BY_PK,
+  FETCH_DELIVERIES_BY_COURIER,
+  FETCH_DELIVERY_REQUESTS,
+  FETCH_DELIVERY_REQUEST_BY_COURIER,
+  FETCH_DELIVERY_REQUEST_BY_PK,
+} from "../graphql/queries/deliveries";
+
+import { GetDeliveriesQuery, GetDeliveriesQueryVariables, GetDeliveryByPkQuery, GetDeliveryByPkQueryVariables, GetDeliveriesByCourierQuery, GetDeliveriesByCourierQueryVariables, GetDeliveryRequestsQuery, GetDeliveryRequestsQueryVariables, GetDeliveryRequestByPkQuery, GetDeliveryRequestByPkQueryVariables, GetDeliveryRequestByCourierQuery, GetDeliveryRequestByCourierQueryVariables } from "../graphql/__generated__/graphql";
 
 export const useFetchDeliveries = () => {
-  const { loading, error, data } = useQuery(FETCH_DELIVERIES);
-  return { loading, error, data };
+  const { loading, error, data } = useQuery<GetDeliveriesQuery, GetDeliveriesQueryVariables>(FETCH_DELIVERIES);
+  return { loading, error, data:data?.delivery };
 };
 
 export const useFetchDeliveryByPK = (id: string) => {
-  const { loading, error, data } = useQuery(FETCH_DELIVERY_BY_PK, { variables: { id } });
+  const { loading, error, data } = useQuery<GetDeliveryByPkQuery, GetDeliveryByPkQueryVariables>(FETCH_DELIVERY_BY_PK, {
+    variables: { id },
+  });
   return { loading, error, data: data?.delivery };
 };
 
 export const useFetchDeliveriesByCourier = (courier_id: string) => {
-  const { loading, error, data } = useQuery(FETCH_DELIVERIES_BY_COURIER, { variables: { courier_id } });
-  return { loading, error, data };
+  const { loading, error, data } = useQuery<GetDeliveriesByCourierQuery, GetDeliveriesByCourierQueryVariables>(FETCH_DELIVERIES_BY_COURIER, {
+    variables: { courier_id },
+  });
+  return { loading, error, data: data?.delivery };
 };
 
 export const useFetchDeliveryRequests = () => {
-  const { loading, error, data } = useQuery(FETCH_DELIVERY_REQUESTS);
+  const { loading, error, data } = useQuery<GetDeliveryRequestsQuery, GetDeliveryRequestsQueryVariables>(FETCH_DELIVERY_REQUESTS);
   return { loading, error, data: data?.delivery_request };
 };
 
 export const useFetchDeliveryRequestByPK = (id: string) => {
-  const { loading, error, data } = useQuery(FETCH_DELIVERY_REQUEST_BY_PK, { variables: { id } });
-  return { loading, error, data: data?.delivery_request[0] };
+  const { loading, error, data } = useQuery<GetDeliveryRequestByPkQuery, GetDeliveryRequestByPkQueryVariables>(FETCH_DELIVERY_REQUEST_BY_PK, {
+    variables: { id },
+  });
+  return { loading, error, data: data?.delivery_request };
 };
 
-
 export const useFetchDeliveryRequestByCourier = (courier_id: string) => {
-  const { loading, error, data } = useQuery(FETCH_DELIVERY_REQUEST_BY_COURIER, { variables: { courier_id } });
-  return { loading, error, data };
-};
\ No newline at end of file
+  const { loading, error, data } = useQuery<GetDeliveryRequestByCourierQuery, GetDeliveryRequestByCourierQueryVariables>(FETCH_DELIVERY_REQUEST_BY_COURIER, {
+    variables: { courier_id },
+  });
+  return { loading, error, data: data?.delivery_request };
+};
diff --git a/packages/lib/hooks/orders.tsx b/packages/lib/hooks/orders.tsx
index 57486d1e..c44ca9f6 100644
--- a/packages/lib/hooks/orders.tsx
+++ b/packages/lib/hooks/orders.tsx
@@ -12,6 +12,12 @@ import {
 import {
   GetOrdersQuery,
   GetOrdersQueryVariables,
+  GetOrderByPkQuery, 
+  GetOrderByPkQueryVariables,
+  GetOrderDeliveriesQuery,
+  GetOrderDeliveriesQueryVariables,
+  GetOrdersStatsQuery,
+  GetOrdersStatsQueryVariables,
 } from "@sahil/lib/graphql/__generated__/graphql";
 
 export const useFetchOrders = () => {
@@ -28,7 +34,7 @@ export const useFetchOrders = () => {
 };
 
 export const useFetchOrderByPK = (id: string) => {
-  const { error, data, loading } = useQuery(FETCH_ORDER_BY_PK, {
+  const { error, data, loading } = useQuery<GetOrderByPkQuery, GetOrderByPkQueryVariables>(FETCH_ORDER_BY_PK, {
     variables: {
       id,
     },
@@ -37,7 +43,7 @@ export const useFetchOrderByPK = (id: string) => {
 };
 
 export const useFetchOrderDeliveriesByPK = (id: string) => {
-  const { error, data, loading } = useQuery(FETCH_ORDER_DELIVERIES, {
+  const { error, data, loading } = useQuery<GetOrderDeliveriesQuery, GetOrderDeliveriesQueryVariables>(FETCH_ORDER_DELIVERIES, {
     variables: {
       orderId: id,
     },
@@ -52,7 +58,7 @@ export const usePlaceBusinessOrder = () => {
 };
 
 export const useGetOrdersStats = () => {
-  const { data, loading, error } = useQuery(FETCH_ORDERS_STATS);
+  const { data, loading, error } = useQuery<GetOrdersStatsQuery, GetOrdersStatsQueryVariables>(FETCH_ORDERS_STATS);
 
   return { error, ordersCount: data?.orders_aggregate?.aggregate, loading };
 };
diff --git a/packages/lib/hooks/products.ts b/packages/lib/hooks/products.ts
index 514a3c38..7b6031dd 100644
--- a/packages/lib/hooks/products.ts
+++ b/packages/lib/hooks/products.ts
@@ -1,6 +1,12 @@
 import { useMutation, useQuery } from "@apollo/client";
 import { FETCH_PRODUCTS } from "@sahil/lib/graphql";
 
+// graphql types
+import {
+  GetProductsQuery,
+  GetProductsQueryVariables,
+} from "@sahil/lib/graphql/__generated__/graphql";
+
 export const useFetchProducts = ({
   limit = 10,
   offset = 0,
@@ -8,7 +14,7 @@ export const useFetchProducts = ({
   limit?: number;
   offset: number;
 }) => {
-  const { error, data, loading } = useQuery(FETCH_PRODUCTS, {
+  const { error, data, loading } = useQuery<GetProductsQuery, GetProductsQueryVariables>(FETCH_PRODUCTS, {
     variables: {
       limit,
       offset,
diff --git a/packages/lib/hooks/users.tsx b/packages/lib/hooks/users.tsx
index 85a6eb05..4aaeff73 100644
--- a/packages/lib/hooks/users.tsx
+++ b/packages/lib/hooks/users.tsx
@@ -1,12 +1,15 @@
 import { useMutation, useQuery } from "@apollo/client";
 import {
   GET_LATEST_USER_INVITE,
+  GET_USERS,
   INSERT_NEW_INVITE,
   // INSERT_NEW_USER,
 } from "@sahil/lib/graphql";
 import {
   GetUserInvitesQuery,
+  GetUsersQuery,
   GetUserInvitesQueryVariables,
+  GetUsersQueryVariables,
   InsertNewInviteMutation,
   InsertNewInviteMutationVariables,
 } from "../graphql/__generated__/graphql";
@@ -33,3 +36,11 @@ export const useFetchUserInvites = () => {
   >(GET_LATEST_USER_INVITE);
   return { error, data: data?.user_invites, loading };
 };
+
+export const useFetchUsers = () => {
+  const { error, data, loading } = useQuery<
+    GetUsersQuery,
+    GetUsersQueryVariables
+  >(GET_USERS);
+  return { error, data: data?.users, loading };
+};
diff --git a/packages/lib/hooks/zones.tsx b/packages/lib/hooks/zones.tsx
index 90fbe0c4..e5b5cccf 100644
--- a/packages/lib/hooks/zones.tsx
+++ b/packages/lib/hooks/zones.tsx
@@ -1,7 +1,6 @@
 import { useMutation, useQuery } from "@apollo/client";
 import { GET_ZONES, GET_ZONE_BY_ID } from "@sahil/lib/graphql/queries/zones";
 
-
 export const useGetZoneByIdAction = (id: string) => {
   const { data, loading, error } = useQuery(GET_ZONE_BY_ID, {
     variables: { id },
@@ -14,4 +13,4 @@ export const useGetZones = () => {
   const { data, loading, error } = useQuery(GET_ZONES);
 
   return { error, data: data?.zones, loading };
-};
\ No newline at end of file
+};
diff --git a/packages/ui/components/Card/Card.tsx b/packages/ui/components/Card/Card.tsx
index 69e36760..5603c2e9 100644
--- a/packages/ui/components/Card/Card.tsx
+++ b/packages/ui/components/Card/Card.tsx
@@ -17,7 +17,7 @@ export const Card = ({
   titleSize = "md",
   titleCentered = false,
 }: CardProps) => {
-  const merged = twMerge("card card-compact card-bordered", className);
+  const merged = twMerge("card card-compact bg-white card-bordered", className);
   return (
     <div className={merged}>
       <div className="card-body flex-col">
diff --git a/packages/ui/components/FormControl.tsx b/packages/ui/components/FormControl.tsx
index 714e5af8..f7bd5ee8 100644
--- a/packages/ui/components/FormControl.tsx
+++ b/packages/ui/components/FormControl.tsx
@@ -1,5 +1,5 @@
-import { FC } from 'react';
-import { useAutoAnimate } from '@formkit/auto-animate/react';
+import { FC } from "react";
+import { useAutoAnimate } from "@formkit/auto-animate/react";
 
 export type FormControlProps = {
   children: any;
@@ -13,17 +13,17 @@ type FormControlErrorProps = {
 export const FormControlError: FC<FormControlErrorProps> = ({ message }) => {
   const [parent, enableAnimations] = useAutoAnimate(/* optional config */);
   return (
-    <label className='label'>
-      <span className='label-text-alt text-error'>{message}</span>
+    <label className="label">
+      <span className="label-text-alt text-error">{message}</span>
     </label>
   );
 };
 export const FormControl: FC<FormControlProps> = ({ children, label }) => {
   return (
-    <div className='form-control w-full'>
+    <div className="form-control w-full">
       {label && (
-        <label className='label'>
-          <span className='label-text'>{label}</span>
+        <label className="label">
+          <span className="label-text">{label}</span>
         </label>
       )}
       {children}
diff --git a/packages/ui/components/List/List.tsx b/packages/ui/components/List/List.tsx
index 4f43dcc1..75c23c5c 100644
--- a/packages/ui/components/List/List.tsx
+++ b/packages/ui/components/List/List.tsx
@@ -3,13 +3,13 @@ import { useAutoAnimate } from "@formkit/auto-animate/react";
 import { Card } from "../Card";
 import type { ApolloError } from "@apollo/client";
 import { ListEmptyState } from "./ListEmptyState";
+import { HiOutlineExclamationCircle } from "react-icons/hi2";
 
 type ListProps<T> = {
   data?: T[] | null;
   error?: ApolloError;
   loading?: boolean;
   renderItem: (item: T) => JSX.Element;
-
   cols?: number;
 };
 
@@ -19,17 +19,23 @@ type ListAsyncResultProps = {
 };
 
 export const ListErrorState: FC<ListAsyncResultProps> = ({
-  heading,
-  message,
+  heading = "An error occurred",
+  message = "We're having trouble loading the data. Please try again later.",
 }) => (
   <Card title={heading} titleSize="sm">
-    <p>{message}</p>
-    <div className="card-actions">
-      <button className="btn btn-sm btn-secondary">Reload</button>
-      <button className="btn btn-sm btn-outline">Go Back</button>
+    <div className="flex flex-col items-center">
+      <span className="text-4xl mb-4">
+        <HiOutlineExclamationCircle />
+      </span>
+      <p>{message}</p>
+      <div className="card-actions mt-4">
+        <button className="btn btn-sm btn-secondary">Reload</button>
+        <button className="btn btn-sm btn-outline">Go Back</button>
+      </div>
     </div>
   </Card>
 );
+
 export const ListLoadingState: FC<ListAsyncResultProps> = ({
   heading = "Loading Data",
   message,
@@ -51,9 +57,8 @@ export const List = <T extends unknown>({
   if (error) {
     return (
       <ListErrorState
-        heading="Unable to load products..."
-        message="Products aren't loading due to a technical problem on our side. Please
-      try again."
+        heading="Unable to load data"
+        message="We're experiencing technical difficulties. Please try again later."
       />
     );
   }
diff --git a/packages/ui/components/Modal.tsx b/packages/ui/components/Modal.tsx
index 72e37a80..eb89faa1 100644
--- a/packages/ui/components/Modal.tsx
+++ b/packages/ui/components/Modal.tsx
@@ -13,7 +13,7 @@ export type ModalProps = {
   className?: string;
 };
 
-const Modal = ({
+export const Modal = ({
   id,
   children,
   title,
diff --git a/packages/ui/components/Navbar.tsx b/packages/ui/components/Navbar.tsx
index 6343dbcc..7814e84d 100644
--- a/packages/ui/components/Navbar.tsx
+++ b/packages/ui/components/Navbar.tsx
@@ -8,8 +8,9 @@ import {
   HiOutlineArrowRightOnRectangle,
   HiOutlineUser,
   HiOutlineCog6Tooth,
-  HiOutlineBell
+  HiOutlineBell,
 } from "react-icons/hi2";
+import { useRouter } from "next/router";
 
 type NavbarLink = {
   name: string;
@@ -33,6 +34,8 @@ export const Navbar: FC<NavbarProps> = ({
   onSignOut,
   user,
 }) => {
+  const router = useRouter();
+
   return (
     <header className="bg-white navbar border-b">
       <div className="w-full flex items-center gap-2">
@@ -113,6 +116,8 @@ const Right = ({
   onSignOut?: () => void;
   children?: ReactNode;
 }) => {
+  const router = useRouter();
+
   if (!user) {
     return (
       <div className="navbar-end">
@@ -199,4 +204,4 @@ const Right = ({
       {children}
     </div>
   );
-};
+};
\ No newline at end of file
diff --git a/packages/ui/components/Radio.tsx b/packages/ui/components/Radio.tsx
index ad9e777a..dca080c3 100644
--- a/packages/ui/components/Radio.tsx
+++ b/packages/ui/components/Radio.tsx
@@ -12,6 +12,7 @@ type Option = {
 
 type RadioGroupProps = BaseInputProps<any> & {
   options: Option[];
+  readOnly?: boolean;
 };
 
 export const RadioGroup: FC<RadioGroupProps> = ({
@@ -20,17 +21,18 @@ export const RadioGroup: FC<RadioGroupProps> = ({
   register,
   errors,
   options,
+  readOnly = false,
 }) => {
   //handle nested errors
   const errorPath = name.split(".");
   let errorMessage;
 
-  if (errorPath.length > 1) {
+  if (errors && errorPath.length > 1) {
     errorMessage = errorPath.reduce(
       (obj, key) => obj && obj[key],
       errors
     )?.message;
-  } else {
+  } else if (errors) {
     errorMessage = errors[name]?.message;
   }
 
@@ -38,7 +40,13 @@ export const RadioGroup: FC<RadioGroupProps> = ({
     <FormControl label={label!}>
       <div className="flex flex-wrap gap-2">
         {options.map((option, index) => (
-          <Radio key={index} register={register} name={name} option={option} />
+          <Radio 
+            key={index} 
+            register={register} 
+            name={name} 
+            option={option} 
+            readOnly={readOnly}
+          />
         ))}
       </div>
       {errorMessage && <FormControlError message={errorMessage} />}
@@ -50,25 +58,30 @@ type RadioProps = {
   option: Option;
   name: string;
   register: BaseInputProps<any>["register"];
+  readOnly?: boolean;
 };
 
-const Radio = ({
+export const Radio = ({
   name,
   register,
   option: { value, label, icon },
+  readOnly = false,
 }: RadioProps) => {
   return (
-    <label className="label cursor-pointer">
+    <label className={`label cursor-pointer ${readOnly ? 'opacity-50' : ''}`}>
       <input
         type="radio"
         value={value}
         className="radio radio-sm checked:bg-secondary"
-        {...register(name)}
+        {...(register ? register(name) : {})}
+        disabled={readOnly}
       />
       <div className="flex ml-4 items-center gap-2">
-        <span className="shadow p-2 rounded-md">
-          <Icon icon={icon!} />
-        </span>
+        {icon && (
+          <span className="shadow p-2 rounded-md">
+            <Icon icon={icon} />
+          </span>
+        )}
         <span className="label-text">{label}</span>
       </div>
     </label>
diff --git a/packages/ui/components/SectionHeader.tsx b/packages/ui/components/SectionHeader.tsx
index 7bda90ee..6e7af497 100644
--- a/packages/ui/components/SectionHeader.tsx
+++ b/packages/ui/components/SectionHeader.tsx
@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 import { Card } from "ui";
-import Link from 'next/link';
+import Link from "next/link";
 
 interface Action {
   label: string;
@@ -15,22 +15,26 @@ interface SectionHeaderProps {
   children: ReactNode;
 }
 
-export const SectionHeader = ({ title, actions, children }: SectionHeaderProps) => {
+export const SectionHeader = ({
+  title,
+  actions,
+  children,
+}: SectionHeaderProps) => {
   return (
     <section className="space-y-4">
       <Card>
         <div className="flex flex-wrap items-center gap-2 justify-between md:flex-row">
           <div>
-            <h1 className="text-xl">
-              {title}
-            </h1>
+            <h1 className="text-xl">{title}</h1>
           </div>
           <div className="flex gap-2">
             {actions.map((action, index) => (
               <Link
                 key={index}
                 href={action.href}
-                className={`btn btn-sm ${action.primary ? 'btn-primary' : ''} normal-case`}
+                className={`btn btn-sm ${
+                  action.primary ? "btn-primary" : ""
+                } normal-case`}
               >
                 {action.icon}
                 {action.label}
diff --git a/packages/ui/components/Select.tsx b/packages/ui/components/Select.tsx
index 28093ea3..d1e287b6 100644
--- a/packages/ui/components/Select.tsx
+++ b/packages/ui/components/Select.tsx
@@ -3,6 +3,8 @@ import { BaseInputProps } from "../types";
 
 type SelectProps = BaseInputProps<any> & {
   options: any[];
+  defaultValue?: string;
+  disabled?: boolean;
 };
 
 export const Select = ({
@@ -11,14 +13,19 @@ export const Select = ({
   name,
   register,
   errors,
+  defaultValue,
+  disabled = false,
 }: SelectProps) => {
   return (
-    <FormControl label={label}>
+    <FormControl>
       <select
         className="select select-sm select-bordered w-full max-w-lg"
         title={label}
         {...register(name)}
+        defaultValue={defaultValue}
+        disabled={disabled}
       >
+        {defaultValue && <option value="">{defaultValue}</option>}
         {options.map((option, index) => (
           <option key={index}>{option}</option>
         ))}
diff --git a/packages/ui/components/Tabs.tsx b/packages/ui/components/Tabs.tsx
index c5ae26cd..a9f0529f 100644
--- a/packages/ui/components/Tabs.tsx
+++ b/packages/ui/components/Tabs.tsx
@@ -15,7 +15,12 @@ type TabsProps = {
   className?: string;
 };
 
-export const Tabs = ({ items, onTabClick, currentTab, className = "" }: TabsProps) => {
+export const Tabs = ({
+  items,
+  onTabClick,
+  currentTab,
+  className = "",
+}: TabsProps) => {
   return (
     <div className={`tabs tabs-boxed flex flex-wrap ${className}`}>
       {items.map((tab, index) => (
diff --git a/packages/ui/components/Timeline.tsx b/packages/ui/components/Timeline.tsx
index 936a41f9..ed260d77 100644
--- a/packages/ui/components/Timeline.tsx
+++ b/packages/ui/components/Timeline.tsx
@@ -2,9 +2,9 @@ import {
   HiOutlineCheckCircle,
   HiOutlineMinusCircle,
   HiOutlineXCircle,
-} from 'react-icons/hi2';
+} from "react-icons/hi2";
 
-type Status = 'completed' | 'pending' | 'cancelled';
+type Status = "completed" | "pending" | "cancelled";
 
 type TimelineItem = {
   prefix?: string;
@@ -18,14 +18,14 @@ type Props = {
 };
 
 const statusConfig = {
-  completed: { icon: <HiOutlineCheckCircle />, color: 'success' },
-  pending: { icon: <HiOutlineMinusCircle />, color: 'base-300' },
-  cancelled: { icon: <HiOutlineXCircle />, color: 'red-500' },
+  completed: { icon: <HiOutlineCheckCircle />, color: "success" },
+  pending: { icon: <HiOutlineMinusCircle />, color: "base-300" },
+  cancelled: { icon: <HiOutlineXCircle />, color: "red-500" },
 };
 
 export const Timeline = ({ items }: Props) => {
   return (
-    <ul className='timeline timeline-vertical timeline-snap-icon'>
+    <ul className="timeline timeline-vertical timeline-snap-icon w-fit">
       {items.map((item, index) => (
         <TimelineItem
           key={index}
@@ -60,11 +60,11 @@ const TimelineItem = ({
   return (
     <li>
       {!isFirst && <hr className={`bg-${color}`} />}
-      <div className='timeline-start'>{prefix}</div>
+      <div className="timeline-start timeline-box">{prefix}</div>
       <div className={`timeline-middle text-xl text-${color}`}>{icon}</div>
-      <div className='timeline-end space-y-1' style={{ gridRowStart: 2 }}>
-        <span className='font-semibold'>{label}</span>
-        <p className='text-sm'>{description}</p>
+      <div className="timeline-end space-y-1" style={{ gridRowStart: 2 }}>
+        <div className={`badge py-2 text-${color}`}>{label}</div>
+        <p className="text-sm">{description}</p>
       </div>
       {!isLast && <hr className={`bg-${nextColor}`} />}
     </li>
diff --git a/turbo.json b/turbo.json
index 255461b8..31937712 100644
--- a/turbo.json
+++ b/turbo.json
@@ -1,5 +1,5 @@
 {
-  "globalDotEnv": [".env"],
+  "globalEnv": [".env"],
   "$schema": "https://turbo.build/schema.json",
   "globalDependencies": ["**/.env.*local", ".env.development", ".env.production"],
   "remoteCache": {
@@ -30,4 +30,4 @@
       "persistent": true
     }
   }
-}
+}
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index d4c68e6e..94526747 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4429,7 +4429,7 @@ escodegen@^2.1.0:
   optionalDependencies:
     source-map "~0.6.1"
 
-eslint-config-next@14.2.3, eslint-config-next@^14.2.3:
+eslint-config-next@^14.2.3:
   version "14.2.3"
   resolved "https://registry.yarnpkg.com/eslint-config-next/-/eslint-config-next-14.2.3.tgz#2fb0f7c4eccda530a4b5054438162b2303786d4f"
   integrity sha512-ZkNztm3Q7hjqvB1rRlOX8P9E/cXRL9ajRcs8jufEtwMfTVYRqnmtnaSu57QqHyBlovMuiB8LEzfLBkh5RYV6Fg==
@@ -6763,7 +6763,7 @@ next-auth@^4.24.7:
     preact-render-to-string "^5.1.19"
     uuid "^8.3.2"
 
-next@14.2.3, next@^14.2.3:
+next@^14.2.3:
   version "14.2.3"
   resolved "https://registry.yarnpkg.com/next/-/next-14.2.3.tgz#f117dd5d5f20c307e7b8e4f9c1c97d961008925d"
   integrity sha512-dowFkFTR8v79NPJO4QsBUtxv0g9BrS/phluVpMAt2ku7H+cbcBJlopXjkWlwxrk/xGqMemr7JkGPGemPrLLX7A==
@@ -8590,7 +8590,7 @@ tailwindcss@3.3.3:
     resolve "^1.22.2"
     sucrase "^3.32.0"
 
-tailwindcss@^3.3.0, tailwindcss@^3.4.1:
+tailwindcss@^3.3.0:
   version "3.4.1"
   resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.1.tgz#f512ca5d1dd4c9503c7d3d28a968f1ad8f5c839d"
   integrity sha512-qAYmXRfk3ENzuPBakNK0SRrUDipP8NQnEY6772uDhflcQz5EhRdD7JNZxyrFHVQNCwULPBn6FNPp9brpO7ctcA==