diff --git a/apps/admin/tailwind.config.ts b/apps/admin/tailwind.config.ts
index 8ee6306e..52e44e93 100644
--- a/apps/admin/tailwind.config.ts
+++ b/apps/admin/tailwind.config.ts
@@ -5,7 +5,7 @@ const baseConfig: Config = require("@sahil/configs/tailwind/tailwind.config");
 const extendedConfig: Config = {
   ...baseConfig,
   content: [
-    // @ts-expect-error
+    // @ts-ignore
     ...baseConfig.content,
     "./src/Addresses/**/**.{js,ts,jsx,tsx,mdx}",
     "./src/Agents/**/*.{js,ts,tsx,tsx,mdx}",
diff --git a/apps/agent/next.config.js b/apps/agent/next.config.js
index 7ee104e6..1636fe5c 100644
--- a/apps/agent/next.config.js
+++ b/apps/agent/next.config.js
@@ -2,6 +2,7 @@
 const nextConfig = {
   reactStrictMode: true,
   transpilePackages: ['@sahil/lib', 'ui', '@sahil/configs'],
+  output: "standalone",
   images: {
     remotePatterns: [
       {
diff --git a/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessInfo.tsx b/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessInfo.tsx
index f2c4c970..fa35ba29 100644
--- a/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessInfo.tsx
+++ b/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessInfo.tsx
@@ -25,7 +25,7 @@ export const BusinessInfo = () => {
 
   const router = useRouter();
 
-  const { formData } = useBusinessFormStore((state) => state);
+  //const { formData } = useBusinessFormStore((state) => state);
   const onSubmit: SubmitHandler<FormData> = async (data) => {
     const validatedInput = businessInfoSchema.parse(data);
   };
@@ -36,7 +36,7 @@ export const BusinessInfo = () => {
           <input
             type="text"
             className="input input-sm input-bordered w-full bg-gray-100"
-            placeholder="Keji's Foods"
+            placeholder="Keji Foods"
           />
         </FormControl>
         <div className="btn btn-sm btn-primary w-fit">
diff --git a/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessStepsPaginator.tsx b/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessStepsPaginator.tsx
index 2748331b..2e4f0bdb 100644
--- a/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessStepsPaginator.tsx
+++ b/apps/agent/src/Businesses/BusinessRegistrationForm/BusinessStepsPaginator.tsx
@@ -14,7 +14,7 @@ export const BusinessStepsPaginator = ({
   onNextStep,
   onPrevStep,
 }: Props) => {
-  const { steps, currentStep } = useBusinessFormStore((state) => state);
+  const { steps, currentStep } = useBusinessFormStore()((state) => state);
   const currentIndex = steps.indexOf(currentStep);
   return (
     <>
diff --git a/apps/agent/src/Couriers/CourierRegistrationForm/CourierContactDetails.tsx b/apps/agent/src/Couriers/CourierRegistrationForm/CourierContactDetails.tsx
index 685a6def..66ae57e2 100644
--- a/apps/agent/src/Couriers/CourierRegistrationForm/CourierContactDetails.tsx
+++ b/apps/agent/src/Couriers/CourierRegistrationForm/CourierContactDetails.tsx
@@ -22,6 +22,7 @@ const courierContactSchema = z.object({
 type FormData = z.infer<typeof courierContactSchema>;
 
 export const CourierContactDetails = () => {
+  // @ts-ignore
   const { goToStep, updateStepFormData } = useCourierFormStore((state) => ({
     formData: state.formData,
     goToStep: state.goToStep,
diff --git a/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormStepsPaginator.tsx b/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormStepsPaginator.tsx
index e027a734..2423d5ed 100644
--- a/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormStepsPaginator.tsx
+++ b/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormStepsPaginator.tsx
@@ -4,7 +4,8 @@ import { JoinGrid } from "ui";
 import { HiArrowSmallLeft, HiArrowSmallRight } from "react-icons/hi2";
 
 export const CourierFormStepPaginator = () => {
-  const { steps, goToStep, currentStep } = useCourierFormStore(
+  // @ts-ignore
+  const { steps, goToStep, currentStep } = useCourierFormStore()(
     (state) => state
   );
   const router = useRouter();
diff --git a/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormSummary.tsx b/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormSummary.tsx
index 11270030..2d4b08c8 100644
--- a/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormSummary.tsx
+++ b/apps/agent/src/Couriers/CourierRegistrationForm/CourierFormSummary.tsx
@@ -7,7 +7,7 @@ import toast, { Toaster } from "react-hot-toast";
 
 export const CourierFormSummary = () => {
   const router = useRouter();
-  const formData = useCourierFormStore((state) => state.formData);
+  const formData = useCourierFormStore()((state) => state.formData);
 
   const { insertCourier, loading, error } = useRegisterCourier();
 
diff --git a/apps/agent/src/Couriers/CourierRegistrationForm/CourierPersonalInfo.tsx b/apps/agent/src/Couriers/CourierRegistrationForm/CourierPersonalInfo.tsx
index 4bf1b16b..a4c3da42 100644
--- a/apps/agent/src/Couriers/CourierRegistrationForm/CourierPersonalInfo.tsx
+++ b/apps/agent/src/Couriers/CourierRegistrationForm/CourierPersonalInfo.tsx
@@ -24,7 +24,7 @@ const courierInfoSchema = z.object({
 type FormData = z.infer<typeof courierInfoSchema>;
 
 export const CourierPersonalInfo = () => {
-  const { goToStep, updateStepFormData } = useCourierFormStore((state) => ({
+  const { goToStep, updateStepFormData } = useCourierFormStore()((state) => ({
     formData: state.formData,
     goToStep: state.goToStep,
     updateStepFormData: state.updateStepFormData,
diff --git a/apps/agent/src/Couriers/CourierRegistrationForm/CourierVehicleInfo.tsx b/apps/agent/src/Couriers/CourierRegistrationForm/CourierVehicleInfo.tsx
index 9748164f..84464749 100644
--- a/apps/agent/src/Couriers/CourierRegistrationForm/CourierVehicleInfo.tsx
+++ b/apps/agent/src/Couriers/CourierRegistrationForm/CourierVehicleInfo.tsx
@@ -24,7 +24,7 @@ const courierVehicleSchema = z.object({
 type FormData = z.infer<typeof courierVehicleSchema>;
 
 export const CourierVehicleInfo = () => {
-  const { goToStep, updateStepFormData } = useCourierFormStore((state) => ({
+  const { goToStep, updateStepFormData } = useCourierFormStore()((state) => ({
     formData: state.formData,
     goToStep: state.goToStep,
     updateStepFormData: state.updateStepFormData,
diff --git a/apps/agent/src/Couriers/types.ts b/apps/agent/src/Couriers/types.ts
index e69de29b..da367feb 100644
--- a/apps/agent/src/Couriers/types.ts
+++ b/apps/agent/src/Couriers/types.ts
@@ -0,0 +1 @@
+export const em = "";
diff --git a/apps/agent/src/Orders/OrderProcessingForm/DeliveryDetails.tsx b/apps/agent/src/Orders/OrderProcessingForm/DeliveryDetails.tsx
index 3ef11b64..065fdc43 100644
--- a/apps/agent/src/Orders/OrderProcessingForm/DeliveryDetails.tsx
+++ b/apps/agent/src/Orders/OrderProcessingForm/DeliveryDetails.tsx
@@ -35,7 +35,7 @@ export const DeliveryDetails = ({ navigateToNextStep }) => {
     watch,
     formState: { errors },
   } = useForm<FormData>({
-    // @ts-expect-error
+    // @ts-ignore
     resolver: zodResolver(deliveryDetailsSchema),
   });
   const onSubmit: SubmitHandler<FormData> = async (data) => {
diff --git a/apps/agent/src/Orders/OrderProcessingForm/OrderSummary.tsx b/apps/agent/src/Orders/OrderProcessingForm/OrderSummary.tsx
index 209569ea..2ab37faf 100644
--- a/apps/agent/src/Orders/OrderProcessingForm/OrderSummary.tsx
+++ b/apps/agent/src/Orders/OrderProcessingForm/OrderSummary.tsx
@@ -58,7 +58,7 @@ export const OrderSummary = () => {
     watch,
     formState: { errors },
   } = useForm<FormData>({
-    // @ts-expect-error
+    // @ts-ignore
     resolver: zodResolver(checkoutSchema),
   });
   const orderItems = useOrderItemsStore((state) => state.orderItems);
diff --git a/apps/agent/src/Orders/ProductsCatalogue.tsx b/apps/agent/src/Orders/ProductsCatalogue.tsx
index ac7a5272..6d7e0421 100644
--- a/apps/agent/src/Orders/ProductsCatalogue.tsx
+++ b/apps/agent/src/Orders/ProductsCatalogue.tsx
@@ -38,8 +38,8 @@ export const ProductsCatalogue = () => {
           <HiSignalSlash />
         </span>
         <p>
-          Products aren't loading due to a technical problem on our side. Please
-          try again. If the issue continues,{" "}
+          Products are not loading due to a technical problem on our side.
+          Please try again. If the issue continues,{" "}
           <span className="text-primary">contact support.</span>
         </p>
         <div className="card-actions justify-end">
diff --git a/apps/agent/src/Suppliers/FilterSuppliersModal.tsx b/apps/agent/src/Suppliers/FilterSuppliersModal.tsx
index a026a615..d2b21787 100644
--- a/apps/agent/src/Suppliers/FilterSuppliersModal.tsx
+++ b/apps/agent/src/Suppliers/FilterSuppliersModal.tsx
@@ -40,7 +40,7 @@ const FilterSuppliersModal = () => {
       <button
         className="btn btn-sm normal-case"
         onClick={() => {
-          // @ts-expect-error
+          // @ts-ignore
           return document.getElementById("filter_suppliers_modal")?.showModal();
         }}
       >
diff --git a/apps/agent/src/Suppliers/SupplierProductForm.tsx b/apps/agent/src/Suppliers/SupplierProductForm.tsx
index 8c0e7d29..ab95fc2f 100644
--- a/apps/agent/src/Suppliers/SupplierProductForm.tsx
+++ b/apps/agent/src/Suppliers/SupplierProductForm.tsx
@@ -37,7 +37,7 @@ const SupplierProductForm = ({
     setValue,
     formState: { errors },
   } = useForm<ProductFormData>({
-    // @ts-expect-error
+    // @ts-ignore
     resolver: zodResolver(supplierProductSchema),
   });
 
diff --git a/apps/agent/src/Suppliers/SupplierRegistrationForm/PreviewSupplierInfo.tsx b/apps/agent/src/Suppliers/SupplierRegistrationForm/PreviewSupplierInfo.tsx
index 7f220874..7d48f5bf 100644
--- a/apps/agent/src/Suppliers/SupplierRegistrationForm/PreviewSupplierInfo.tsx
+++ b/apps/agent/src/Suppliers/SupplierRegistrationForm/PreviewSupplierInfo.tsx
@@ -13,7 +13,7 @@ export const PreviewSupplierInfo = () => {
     formState: { errors },
   } = useForm<FormData>();
   const router = useRouter();
-  const formData = useSupplierFormStore((state) => state.formData);
+  const formData = useSupplierFormStore()((state) => state.formData);
 
   const { error, insertSupplier, loading, supplier } = useRegisterSupplier();
 
diff --git a/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBasicInfoForm.tsx b/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBasicInfoForm.tsx
index d39008e3..418fad69 100644
--- a/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBasicInfoForm.tsx
+++ b/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBasicInfoForm.tsx
@@ -13,7 +13,7 @@ const supplierBasicInfoSchema = z.object({
 type FormData = z.infer<typeof supplierBasicInfoSchema>;
 
 export const SupplierBasicInfoForm = () => {
-  const { formData, goToStep, updateStepFormData } = useSupplierFormStore(
+  const { formData, goToStep, updateStepFormData } = useSupplierFormStore()(
     (state) => ({
       formData: state.formData,
       goToStep: state.goToStep,
@@ -26,7 +26,7 @@ export const SupplierBasicInfoForm = () => {
     handleSubmit,
     formState: { errors },
   } = useForm<FormData>({
-    // @ts-expect-error
+    // @ts-ignore
     resolver: zodResolver(supplierBasicInfoSchema),
   });
 
diff --git a/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBusinessInfoForm.tsx b/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBusinessInfoForm.tsx
index b89df60a..6912b631 100644
--- a/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBusinessInfoForm.tsx
+++ b/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierBusinessInfoForm.tsx
@@ -15,7 +15,7 @@ const supplierContactInfoSchema = z.object({
 type FormData = z.infer<typeof supplierContactInfoSchema>;
 
 export const SupplierBusinessInfoForm = () => {
-  const { currentStep, goToStep, updateStepFormData } = useSupplierFormStore(
+  const { currentStep, goToStep, updateStepFormData } = useSupplierFormStore()(
     (state) => state
   );
   const {
@@ -24,7 +24,7 @@ export const SupplierBusinessInfoForm = () => {
     watch,
     formState: { errors },
   } = useForm<FormData>({
-    // @ts-expect-error
+    // @ts-ignore
     resolver: zodResolver(supplierContactInfoSchema),
   });
   const router = useRouter();
diff --git a/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierPreferencesForm.tsx b/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierPreferencesForm.tsx
index 8c30b49b..9578ef8e 100644
--- a/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierPreferencesForm.tsx
+++ b/apps/agent/src/Suppliers/SupplierRegistrationForm/SupplierPreferencesForm.tsx
@@ -12,7 +12,7 @@ const supplierPrefencesSchema = z.object({
 type FormData = z.infer<typeof supplierPrefencesSchema>;
 
 export const SupplierPreferencesForm = () => {
-  const { goToStep, updateStepFormData } = useSupplierFormStore((state) => ({
+  const { goToStep, updateStepFormData } = useSupplierFormStore()((state) => ({
     goToStep: state.goToStep,
     updateStepFormData: state.updateStepFormData,
   }));
@@ -22,7 +22,7 @@ export const SupplierPreferencesForm = () => {
     watch,
     formState: { errors },
   } = useForm<FormData>({
-    // @ts-expect-error
+    // @ts-ignore
     resolver: zodResolver(supplierPrefencesSchema),
   });
   const router = useRouter();
diff --git a/apps/agent/src/hooks/suppliers.ts b/apps/agent/src/hooks/suppliers.ts
index f9b461b5..7be77e43 100644
--- a/apps/agent/src/hooks/suppliers.ts
+++ b/apps/agent/src/hooks/suppliers.ts
@@ -61,7 +61,7 @@ export const useFetchSupplierProducts = (page: number = 0, id?: string) => {
   // Memoize the result based on the page and ids
   return useMemo(() => {
     return { error, data: data?.products, loading };
-  }, [page, id, product, supplierId, error, data, loading]);
+  }, [error, data, loading]);
 };
 
 export const useRegisterSupplier = () => {
diff --git a/apps/agent/src/hooks/useBusinessFormStore.ts b/apps/agent/src/hooks/useBusinessFormStore.ts
index 2e757423..60b09b0f 100644
--- a/apps/agent/src/hooks/useBusinessFormStore.ts
+++ b/apps/agent/src/hooks/useBusinessFormStore.ts
@@ -9,4 +9,5 @@ const steps = [
   "summary",
 ] as const;
 
-export const useBusinessFormStore = useCreateFormStore(INITIAL_STEP, steps);
+export const useBusinessFormStore = () =>
+  useCreateFormStore(INITIAL_STEP, steps);
diff --git a/apps/agent/src/hooks/useCourierFormStore.tsx b/apps/agent/src/hooks/useCourierFormStore.tsx
index 02eff953..c0aabf78 100644
--- a/apps/agent/src/hooks/useCourierFormStore.tsx
+++ b/apps/agent/src/hooks/useCourierFormStore.tsx
@@ -1,4 +1,5 @@
 import { INITIAL_STEP, steps } from "@/Couriers/constants";
 import { useCreateFormStore } from "@sahil/lib";
 
-export const useCourierFormStore = useCreateFormStore(INITIAL_STEP, steps);
+export const useCourierFormStore = () =>
+  useCreateFormStore(INITIAL_STEP, steps);
diff --git a/apps/agent/src/hooks/useSupplierFormStore.ts b/apps/agent/src/hooks/useSupplierFormStore.ts
index ac87a6c8..eb83802c 100644
--- a/apps/agent/src/hooks/useSupplierFormStore.ts
+++ b/apps/agent/src/hooks/useSupplierFormStore.ts
@@ -8,4 +8,5 @@ const steps = [
   "preview",
 ] as const;
 
-export const useSupplierFormStore = useCreateFormStore(INITIAL_STEP, steps);
+export const useSupplierFormStore = () =>
+  useCreateFormStore(INITIAL_STEP, steps);
diff --git a/apps/agent/src/pages/auth/signin.tsx b/apps/agent/src/pages/auth/signin.tsx
index 70069085..117292ec 100644
--- a/apps/agent/src/pages/auth/signin.tsx
+++ b/apps/agent/src/pages/auth/signin.tsx
@@ -1,4 +1,3 @@
-// @ts-ignore
 import { useEffect } from "react";
 import type { NextPage } from "next";
 import { getProviders, signIn, useSession } from "next-auth/react";
@@ -12,7 +11,7 @@ const SignInPage: NextPage = ({ providers }: any) => {
     if (session) {
       router.push("/auth/new");
     }
-  }, [session]);
+  }, [router, session]);
 
   return (
     <div className="p-4">
diff --git a/apps/agent/src/pages/businesses/register/[...step].tsx b/apps/agent/src/pages/businesses/register/[...step].tsx
index e2c6ea40..b4e8e8ce 100644
--- a/apps/agent/src/pages/businesses/register/[...step].tsx
+++ b/apps/agent/src/pages/businesses/register/[...step].tsx
@@ -45,7 +45,7 @@ const headers = [
 
 export default function BusinessRegistrationPage() {
   const { currentStep, goToStep, steps, updateStepByIndex } =
-    useBusinessFormStore((state) => state);
+    useBusinessFormStore()((state) => state);
   const currentIndex = steps.indexOf(currentStep);
   const router = useRouter();
 
diff --git a/apps/agent/src/pages/couriers/register/[...step].tsx b/apps/agent/src/pages/couriers/register/[...step].tsx
index 21b30093..a1bfa41c 100644
--- a/apps/agent/src/pages/couriers/register/[...step].tsx
+++ b/apps/agent/src/pages/couriers/register/[...step].tsx
@@ -48,7 +48,7 @@ const headers = [
 
 export default function CourierRegistrationPage() {
   const { steps, currentStep, goToStep, updateStepByIndex } =
-    useCourierFormStore((state) => state);
+    useCourierFormStore()((state) => state);
   const router = useRouter();
   const params = useParams();
   const currentIndex = steps.indexOf(currentStep);
diff --git a/apps/agent/src/pages/suppliers/register/[[...step]].tsx b/apps/agent/src/pages/suppliers/register/[[...step]].tsx
index 1d902315..be1a4b37 100644
--- a/apps/agent/src/pages/suppliers/register/[[...step]].tsx
+++ b/apps/agent/src/pages/suppliers/register/[[...step]].tsx
@@ -15,7 +15,7 @@ import { Card, IconButton } from "ui";
 import { HiArrowSmallLeft, HiArrowSmallRight } from "react-icons/hi2";
 
 const StepsPaginator = () => {
-  const { steps, goToStep, currentStep } = useSupplierFormStore(
+  const { steps, goToStep, currentStep } = useSupplierFormStore()(
     (state) => state
   );
   const router = useRouter();
@@ -82,7 +82,7 @@ const headers = [
 ];
 
 export default function SupplierRegistrationPage() {
-  const { steps, currentStep, updateStepByIndex } = useSupplierFormStore(
+  const { steps, currentStep, updateStepByIndex } = useSupplierFormStore()(
     (state) => state
   );
   const router = useRouter();
diff --git a/apps/agent/tailwind.config.ts b/apps/agent/tailwind.config.ts
index fed7bffa..6b390ca8 100644
--- a/apps/agent/tailwind.config.ts
+++ b/apps/agent/tailwind.config.ts
@@ -5,7 +5,7 @@ const baseConfig: Config = require("@sahil/configs/tailwind/tailwind.config");
 const extendedConfig: Config = {
   ...baseConfig,
   content: [
-    // @ts-expect-error
+    // @ts-ignore
     ...baseConfig.content,
     "./src/Suppliers/**/**.{js,ts,jsx,tsx,mdx}",
     "./src/Businesses/**/*.{js,ts,tsx,tsx,mdx}",
diff --git a/apps/client/next.config.js b/apps/client/next.config.js
index 7ee104e6..1636fe5c 100644
--- a/apps/client/next.config.js
+++ b/apps/client/next.config.js
@@ -2,6 +2,7 @@
 const nextConfig = {
   reactStrictMode: true,
   transpilePackages: ['@sahil/lib', 'ui', '@sahil/configs'],
+  output: "standalone",
   images: {
     remotePatterns: [
       {
diff --git a/apps/client/package.json b/apps/client/package.json
index b81e1f88..dcdad20e 100644
--- a/apps/client/package.json
+++ b/apps/client/package.json
@@ -9,22 +9,33 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@apollo/client": "^3.8.10",
+    "@formkit/auto-animate": "^0.8.1",
+    "@hookform/resolvers": "^3.3.4",
+    "@react-google-maps/api": "^2.19.2",
+    "@sahil/configs": "*",
+    "@sahil/lib": "*",
+    "daisyui": "^4.6.0",
+    "date-fns": "^3.2.0",
+    "graphql": "^16.8.1",
+    "next": "14.0.1",
     "react": "^18",
     "react-dom": "^18",
-    "next": "14.0.1",
+    "react-hook-form": "^7.49.3",
+    "react-icons": "^5.0.1",
     "ui": "*",
-    "@sahil/lib": "*",
-    "@sahil/configs": "*"
+    "zod": "^3.22.4",
+    "zustand": "^4.4.7"
   },
   "devDependencies": {
-    "typescript": "^5",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "autoprefixer": "^10.0.1",
+    "eslint": "^8",
+    "eslint-config-next": "14.0.1",
     "postcss": "^8",
     "tailwindcss": "^3.3.0",
-    "eslint": "^8",
-    "eslint-config-next": "14.0.1"
+    "typescript": "^5"
   }
 }
diff --git a/apps/client/src/Products/ProductsCatalogue.tsx b/apps/client/src/Products/ProductsCatalogue.tsx
index 2c257d34..feca30e3 100644
--- a/apps/client/src/Products/ProductsCatalogue.tsx
+++ b/apps/client/src/Products/ProductsCatalogue.tsx
@@ -31,10 +31,10 @@ export const ProductsCatalogue = () => {
     orderItems,
     setProducts,
     products: availableProducts,
-  } = useOrderItemsStore((state) => state);
+  } = useOrderItemsStore((state: any) => state);
 
   const orderItemsMap = new Map(
-    orderItems.map((item) => [item.productId, item])
+    orderItems.map((item: any) => [item.productId, item])
   );
 
   useEffect(() => {
@@ -49,8 +49,8 @@ export const ProductsCatalogue = () => {
           <HiSignalSlash />
         </span>
         <p>
-          Products aren't loading due to a technical problem on our side. Please
-          try again. If the issue continues,{" "}
+          Products are not loading due to a technical problem on our side.
+          Please try again. If the issue continues,{" "}
           <span className="text-primary">contact support.</span>
         </p>
         <div className="card-actions justify-end">
@@ -104,7 +104,7 @@ export const ProductsCatalogue = () => {
         error={error}
         loading={loading}
         cols={4}
-        renderItem={(product) => {
+        renderItem={(product: any) => {
           const isInCart = orderItemsMap.has(product.id);
           return (
             <ProductSummary
diff --git a/apps/client/tailwind.config.ts b/apps/client/tailwind.config.ts
index 14154776..d4391870 100644
--- a/apps/client/tailwind.config.ts
+++ b/apps/client/tailwind.config.ts
@@ -5,7 +5,7 @@ const baseConfig: Config = require("@sahil/configs/tailwind/tailwind.config");
 const extendedConfig: Config = {
   ...baseConfig,
   content: [
-    // @ts-expect-error
+    // @ts-ignore
     ...baseConfig.content,
     "./src/Addresses/**/**.{js,ts,jsx,tsx,mdx}",
     "./src/Maps/**/*.{js,ts,tsx,tsx,mdx}",
@@ -23,7 +23,7 @@ const extendedConfig: Config = {
       ...baseConfig.theme?.extend,
     },
   },
-  // @ts-expect-error
+  // @ts-ignore
   plugins: [...baseConfig.plugins, require("daisyui")],
   daisyui: {
     themes: [
diff --git a/docker-compose.yml b/docker-compose.yml
index cab726a2..70dc535c 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -11,6 +11,8 @@ services:
     restart: always
     ports:
       - '3000:3000'
+    environment:
+      - name=value
 
   # API
   sahil-api:
@@ -22,8 +24,8 @@ services:
     restart: always
     ports:
       - '8000:8000'
-    env_file:
-      - path: ./apps/api/.env
+    # env_file:
+    #   - path: ./apps/api/.env
       #- path: ./apps/api/.env.production
 
   # AGENT
@@ -35,9 +37,9 @@ services:
     image: sahil-agent
     restart: always
     ports:
-      - '3000:3000'
-    env_file:
-      - path: ./apps/agent/.env
+      - '3001:3001'
+    #env_file:
+      # - path: .env
       #- path: ./apps/agent/.env.production
   
   # CLIENT
@@ -49,10 +51,13 @@ services:
     image: sahil-client
     restart: always
     ports:
-      - '3000:3000'
-    env_file:
-      - path: ./apps/client/.env
-      #- path: ./apps/client/.env.production
+      - '3003:3003'
+    # env_file:
+    #   - path: .env
+    #   #- path: ./apps/client/.env.production
+    environment:
+      - HASURA_GRAPHQL_ENDPOINT=${HASURA_GRAPHQL_ENDPOINT}
+      - HASURA_GRAPHQL_ADMIN_SECRET=${HASURA_GRAPHQL_ADMIN_SECRET}
 
   #### LOCAL DEV ENVIRONMENTS ####
 
diff --git a/packages/ui/components/DatePicker.tsx b/packages/ui/components/DatePicker.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/packages/ui/components/Stepper.tsx b/packages/ui/components/Stepper.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/packages/ui/components/TimePicker.tsx b/packages/ui/components/TimePicker.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/yarn.lock b/yarn.lock
index 80e1e4be..4a067814 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -44,6 +44,24 @@
     tslib "^2.3.0"
     zen-observable-ts "^1.2.5"
 
+"@apollo/client@^3.8.10":
+  version "3.8.10"
+  resolved "https://registry.yarnpkg.com/@apollo/client/-/client-3.8.10.tgz#db6ee4378212d93c1f22b90a2aa474f6e9664b68"
+  integrity sha512-p/22RZ8ehHyvySnC20EHPPe0gdu8Xp6ZCiXOfdEe1ZORw5cUteD/TLc66tfKv8qu8NLIfbiWoa+6s70XnKvxqg==
+  dependencies:
+    "@graphql-typed-document-node/core" "^3.1.1"
+    "@wry/equality" "^0.5.6"
+    "@wry/trie" "^0.5.0"
+    graphql-tag "^2.12.6"
+    hoist-non-react-statics "^3.3.2"
+    optimism "^0.18.0"
+    prop-types "^15.7.2"
+    response-iterator "^0.2.6"
+    symbol-observable "^4.0.0"
+    ts-invariant "^0.10.3"
+    tslib "^2.3.0"
+    zen-observable-ts "^1.2.5"
+
 "@apollo/datasource-rest@^6.1.0", "@apollo/datasource-rest@^6.2.2":
   version "6.2.2"
   resolved "https://registry.yarnpkg.com/@apollo/datasource-rest/-/datasource-rest-6.2.2.tgz#a9c2285a7d0a904ef536d106b32d446ecebb982e"
@@ -920,6 +938,11 @@
   resolved "https://registry.yarnpkg.com/@formkit/auto-animate/-/auto-animate-0.7.0.tgz#7a68df578e972d63d999378571ce6e012d9059ae"
   integrity sha512-RczHUr0AhRPssREoNdRjLfk2b/id9/DFnbIq18QM8L7E4zNV3XH+WO480EZ46BQHDEsv76YPJ0JbG2Y2i3GfXw==
 
+"@formkit/auto-animate@^0.8.1":
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/@formkit/auto-animate/-/auto-animate-0.8.1.tgz#bcaba2969609ca3a7453eacd42b383a2739dfa35"
+  integrity sha512-0/Z2cuNXWVVIG/l0SpcHAWFhGdvLJ8DRvEfRWvmojtmRWfEy+LWNwgDazbZqY0qQYtkHcoEK3jBLkhiZaB/4Ig==
+
 "@googlemaps/google-maps-services-js@^3.3.41":
   version "3.3.41"
   resolved "https://registry.yarnpkg.com/@googlemaps/google-maps-services-js/-/google-maps-services-js-3.3.41.tgz#1e8e15059b3ba887b20a8d91c2174c0e48225525"
@@ -1477,6 +1500,11 @@
   resolved "https://registry.yarnpkg.com/@hookform/resolvers/-/resolvers-3.3.2.tgz#5c40f06fe8137390b071d961c66d27ee8f76f3bc"
   integrity sha512-Tw+GGPnBp+5DOsSg4ek3LCPgkBOuOgS5DsDV7qsWNH9LZc433kgsWICjlsh2J9p04H2K66hsXPPb9qn9ILdUtA==
 
+"@hookform/resolvers@^3.3.4":
+  version "3.3.4"
+  resolved "https://registry.yarnpkg.com/@hookform/resolvers/-/resolvers-3.3.4.tgz#de9b668c2835eb06892290192de6e2a5c906229b"
+  integrity sha512-o5cgpGOuJYrd+iMKvkttOclgwRW86EsWJZZRC23prf0uU2i48Htq4PuT73AVb9ionFyZrwYEITuOFGF+BydEtQ==
+
 "@humanwhocodes/config-array@^0.11.10", "@humanwhocodes/config-array@^0.11.13":
   version "0.11.13"
   resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.13.tgz#075dc9684f40a531d9b26b0822153c1e832ee297"
@@ -2515,6 +2543,13 @@
     fast-querystring "^1.1.1"
     tslib "^2.3.1"
 
+"@wry/caches@^1.0.0":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@wry/caches/-/caches-1.0.1.tgz#8641fd3b6e09230b86ce8b93558d44cf1ece7e52"
+  integrity sha512-bXuaUNLVVkD20wcGBWRyo7j9N3TxePEWFZj2Y+r9OoUzfqmavM84+mFykRicNsBqatba5JLay1t48wxaXaWnlA==
+  dependencies:
+    tslib "^2.3.0"
+
 "@wry/context@^0.7.0", "@wry/context@^0.7.3":
   version "0.7.4"
   resolved "https://registry.yarnpkg.com/@wry/context/-/context-0.7.4.tgz#e32d750fa075955c4ab2cfb8c48095e1d42d5990"
@@ -2543,6 +2578,13 @@
   dependencies:
     tslib "^2.3.0"
 
+"@wry/trie@^0.5.0":
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/@wry/trie/-/trie-0.5.0.tgz#11e783f3a53f6e4cd1d42d2d1323f5bc3fa99c94"
+  integrity sha512-FNoYzHawTMk/6KMQoEG5O4PuioX19UbwdQKF44yw0nLfOypfQdjtfZzo/UIJWAJ23sNIFbD1Ug9lbaDGMwbqQA==
+  dependencies:
+    tslib "^2.3.0"
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -3755,6 +3797,16 @@ daisyui@4.4.20:
     picocolors "^1"
     postcss-js "^4"
 
+daisyui@^4.6.0:
+  version "4.6.0"
+  resolved "https://registry.yarnpkg.com/daisyui/-/daisyui-4.6.0.tgz#3b2d34ba2995633530b510ebaf9fbc6ed03374c1"
+  integrity sha512-B5ZB/sczXpp4LMdo/SZrtYY/U2hq+Vr9I15QawuWZ0VwgtSAbuZpAZUftKVryEsPuv3BM0yVlBED0nAmtis/dw==
+  dependencies:
+    css-selector-tokenizer "^0.8"
+    culori "^3"
+    picocolors "^1"
+    postcss-js "^4"
+
 damerau-levenshtein@^1.0.8:
   version "1.0.8"
   resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz#b43d286ccbd36bc5b2f7ed41caf2d0aba1f8a6e7"
@@ -3777,6 +3829,11 @@ date-fns@^2.30.0:
   dependencies:
     "@babel/runtime" "^7.21.0"
 
+date-fns@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-3.2.0.tgz#c97cf685b62c829aa4ecba554e4a51768cf0bffc"
+  integrity sha512-E4KWKavANzeuusPi0jUjpuI22SURAznGkx7eZV+4i6x2A+IZxAMcajgkvuDAU1bg40+xuhW1zRdVIIM/4khuIg==
+
 debounce@^1.2.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/debounce/-/debounce-1.2.1.tgz#38881d8f4166a5c5848020c11827b834bcb3e0a5"
@@ -6741,6 +6798,16 @@ optimism@^0.17.5:
     "@wry/trie" "^0.4.3"
     tslib "^2.3.0"
 
+optimism@^0.18.0:
+  version "0.18.0"
+  resolved "https://registry.yarnpkg.com/optimism/-/optimism-0.18.0.tgz#e7bb38b24715f3fdad8a9a7fc18e999144bbfa63"
+  integrity sha512-tGn8+REwLRNFnb9WmcY5IfpOqeX2kpaYJ1s6Ae3mn12AeydLkR3j+jSCmVQFoXqU8D41PAJ1RG1rCRNWmNZVmQ==
+  dependencies:
+    "@wry/caches" "^1.0.0"
+    "@wry/context" "^0.7.0"
+    "@wry/trie" "^0.4.3"
+    tslib "^2.3.0"
+
 optionator@^0.9.1, optionator@^0.9.3:
   version "0.9.3"
   resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.3.tgz#007397d44ed1872fdc6ed31360190f81814e2c64"
@@ -7324,6 +7391,11 @@ react-hook-form@^7.45.4:
   resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.48.2.tgz#01150354d2be61412ff56a030b62a119283b9935"
   integrity sha512-H0T2InFQb1hX7qKtDIZmvpU1Xfn/bdahWBN1fH19gSe4bBEqTfmlr7H3XWTaVtiK4/tpPaI1F3355GPMZYge+A==
 
+react-hook-form@^7.49.3:
+  version "7.49.3"
+  resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.49.3.tgz#576a4567f8a774830812f4855e89f5da5830435c"
+  integrity sha512-foD6r3juidAT1cOZzpmD/gOKt7fRsDhXXZ0y28+Al1CHgX+AY1qIN9VSIIItXRq1dN68QrRwl1ORFlwjBaAqeQ==
+
 react-hot-toast@^2.4.1:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.4.1.tgz#df04295eda8a7b12c4f968e54a61c8d36f4c0994"
@@ -7336,6 +7408,11 @@ react-icons@^4.12.0:
   resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-4.12.0.tgz#54806159a966961bfd5cdb26e492f4dafd6a8d78"
   integrity sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==
 
+react-icons@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-5.0.1.tgz#1694e11bfa2a2888cab47dcc30154ce90485feee"
+  integrity sha512-WqLZJ4bLzlhmsvme6iFdgO8gfZP17rfjYEJ2m9RsZjZ+cc4k1hTzknEz63YS1MeT50kVzoa1Nz36f4BEx+Wigw==
+
 react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -8995,3 +9072,10 @@ zustand@^4.4.1:
   integrity sha512-Rb16eW55gqL4W2XZpJh0fnrATxYEG3Apl2gfHTyDSE965x/zxslTikpNch0JgNjJA9zK6gEFW8Fl6d1rTZaqgg==
   dependencies:
     use-sync-external-store "1.2.0"
+
+zustand@^4.4.7:
+  version "4.4.7"
+  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.4.7.tgz#355406be6b11ab335f59a66d2cf9815e8f24038c"
+  integrity sha512-QFJWJMdlETcI69paJwhSMJz7PPWjVP8Sjhclxmxmxv/RYI7ZOvR5BHX+ktH0we9gTWQMxcne8q1OY8xxz604gw==
+  dependencies:
+    use-sync-external-store "1.2.0"