From 6d880c73b4d65a67c00c5908c07931f950dbe063 Mon Sep 17 00:00:00 2001
From: Bodhish Thomas <bodhish@gmail.com>
Date: Sun, 2 Feb 2025 20:46:36 +0530
Subject: [PATCH 01/19] Add create questionnaire route and enhance
 questionnaire editor functionality (#10363)

---
 src/Routers/routes/questionnaireRoutes.tsx    |   1 +
 .../Questionnaire/QuestionnaireEditor.tsx     | 207 ++++++++++++++++--
 src/components/Questionnaire/show.tsx         |   2 +-
 src/components/ui/button.tsx                  |   2 +-
 src/components/ui/input.tsx                   |   2 +-
 src/components/ui/phone-input.tsx             |   2 +-
 src/components/ui/select.tsx                  |   2 +-
 src/components/ui/textarea.tsx                |   2 +-
 8 files changed, 196 insertions(+), 24 deletions(-)

diff --git a/src/Routers/routes/questionnaireRoutes.tsx b/src/Routers/routes/questionnaireRoutes.tsx
index ccc89f17f90..670861016a7 100644
--- a/src/Routers/routes/questionnaireRoutes.tsx
+++ b/src/Routers/routes/questionnaireRoutes.tsx
@@ -6,6 +6,7 @@ import { AppRoutes } from "@/Routers/AppRouter";
 
 const QuestionnaireRoutes: AppRoutes = {
   "/questionnaire": () => <QuestionnaireList />,
+  "/questionnaire/create": () => <QuestionnaireEditor />,
   "/questionnaire/:id": ({ id }) => <QuestionnaireShow id={id} />,
   "/questionnaire/:id/edit": ({ id }) => <QuestionnaireEditor id={id} />,
 };
diff --git a/src/components/Questionnaire/QuestionnaireEditor.tsx b/src/components/Questionnaire/QuestionnaireEditor.tsx
index 22f4a701058..880d42b4547 100644
--- a/src/components/Questionnaire/QuestionnaireEditor.tsx
+++ b/src/components/Questionnaire/QuestionnaireEditor.tsx
@@ -1,5 +1,6 @@
 import { DragDropContext, Draggable, Droppable } from "@hello-pangea/dnd";
 import { useMutation, useQuery } from "@tanstack/react-query";
+import { Building, Check, Loader2, X } from "lucide-react";
 import { useNavigate } from "raviger";
 import { useEffect, useState } from "react";
 import { toast } from "sonner";
@@ -15,6 +16,14 @@ import {
   CollapsibleContent,
   CollapsibleTrigger,
 } from "@/components/ui/collapsible";
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+} from "@/components/ui/command";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import {
@@ -32,6 +41,7 @@ import Loading from "@/components/Common/Loading";
 
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
+import organizationApi from "@/types/organization/organizationApi";
 import {
   AnswerOption,
   EnableWhen,
@@ -46,10 +56,11 @@ import {
 } from "@/types/questionnaire/questionnaire";
 import questionnaireApi from "@/types/questionnaire/questionnaireApi";
 
+import ManageQuestionnaireOrganizationsSheet from "./ManageQuestionnaireOrganizationsSheet";
 import { QuestionnaireForm } from "./QuestionnaireForm";
 
 interface QuestionnaireEditorProps {
-  id: string;
+  id?: string;
 }
 
 export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
@@ -58,6 +69,8 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
   const [expandedQuestions, setExpandedQuestions] = useState<Set<string>>(
     new Set(),
   );
+  const [selectedOrgIds, setSelectedOrgIds] = useState<string[]>([]);
+  const [orgSearchQuery, setOrgSearchQuery] = useState("");
 
   const {
     data: initialQuestionnaire,
@@ -66,13 +79,36 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
   } = useQuery({
     queryKey: ["questionnaireDetail", id],
     queryFn: query(questionnaireApi.detail, {
-      pathParams: { id },
+      pathParams: { id: id! },
     }),
+    enabled: !!id,
+  });
+
+  const { data: availableOrganizations, isLoading: isLoadingOrganizations } =
+    useQuery({
+      queryKey: ["organizations", orgSearchQuery],
+      queryFn: query(organizationApi.list, {
+        queryParams: {
+          org_type: "role",
+          name: orgSearchQuery || undefined,
+        },
+      }),
+    });
+
+  const { mutate: createQuestionnaire, isPending: isCreating } = useMutation({
+    mutationFn: mutate(questionnaireApi.create),
+    onSuccess: (data: QuestionnaireDetail) => {
+      toast.success("Questionnaire created successfully");
+      navigate(`/questionnaire/${data.slug}`);
+    },
+    onError: (_error) => {
+      toast.error("Failed to create questionnaire");
+    },
   });
 
-  const { mutate: updateQuestionnaire, isPending } = useMutation({
+  const { mutate: updateQuestionnaire, isPending: isUpdating } = useMutation({
     mutationFn: mutate(questionnaireApi.update, {
-      pathParams: { id },
+      pathParams: { id: id! },
     }),
     onSuccess: () => {
       toast.success("Questionnaire updated successfully");
@@ -83,7 +119,22 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
   });
 
   const [questionnaire, setQuestionnaire] =
-    useState<QuestionnaireDetail | null>(null);
+    useState<QuestionnaireDetail | null>(() => {
+      if (!id) {
+        return {
+          id: "",
+          title: "",
+          description: "",
+          status: "draft",
+          version: "1.0",
+          subject_type: "patient",
+          questions: [],
+          slug: "",
+          tags: [],
+        } as QuestionnaireDetail;
+      }
+      return null;
+    });
 
   useEffect(() => {
     if (initialQuestionnaire) {
@@ -91,7 +142,7 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
     }
   }, [initialQuestionnaire]);
 
-  if (isLoading) return <Loading />;
+  if (id && isLoading) return <Loading />;
   if (error) {
     return (
       <Alert variant="destructive">
@@ -122,8 +173,19 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
     setQuestionnaire((prev) => (prev ? { ...prev, [field]: value } : null));
   };
 
+  const handleSave = () => {
+    if (id) {
+      updateQuestionnaire(questionnaire);
+    } else {
+      createQuestionnaire({
+        ...questionnaire,
+        organizations: selectedOrgIds,
+      });
+    }
+  };
+
   const handleCancel = () => {
-    navigate(`/questionnaire/${id}`);
+    navigate(id ? `/questionnaire/${id}` : "/questionnaire");
   };
 
   const handleDragEnd = (result: any) => {
@@ -148,12 +210,21 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
     });
   };
 
+  const handleToggleOrganization = (orgId: string) => {
+    setSelectedOrgIds((current) =>
+      current.includes(orgId)
+        ? current.filter((id) => id !== orgId)
+        : [...current, orgId],
+    );
+  };
+
   return (
     <div className="container mx-auto px-4 py-6">
-      {/* Top bar: Title + Buttons */}
       <div className="mb-4 flex items-center justify-between">
         <div>
-          <h1 className="text-2xl font-bold">Edit Questionnaire</h1>
+          <h1 className="text-2xl font-bold">
+            {id ? "Edit Questionnaire" : "Create Questionnaire"}
+          </h1>
           <p className="text-sm text-gray-500">{questionnaire.description}</p>
         </div>
         <div className="flex gap-2">
@@ -161,12 +232,9 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
             <CareIcon icon="l-arrow-left" className="mr-2 h-4 w-4" />
             Cancel
           </Button>
-          <Button
-            onClick={() => updateQuestionnaire(questionnaire)}
-            disabled={isPending}
-          >
+          <Button onClick={handleSave} disabled={isCreating || isUpdating}>
             <CareIcon icon="l-save" className="mr-2 h-4 w-4" />
-            Save
+            {id ? "Save" : "Create"}
           </Button>
         </div>
       </div>
@@ -182,7 +250,6 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
 
         <TabsContent value="edit">
           <div className="grid gap-6 lg:grid-cols-[300px,1fr]">
-            {/* Left Sidebar: Navigation */}
             <div className="space-y-4">
               <Card>
                 <CardHeader>
@@ -318,11 +385,100 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
                       </SelectContent>
                     </Select>
                   </div>
+
+                  <div>
+                    <Label>Organizations</Label>
+                    {id ? (
+                      <ManageQuestionnaireOrganizationsSheet
+                        questionnaireId={id}
+                        trigger={
+                          <Button
+                            variant="outline"
+                            className="w-full justify-start"
+                          >
+                            <Building className="mr-2 h-4 w-4" />
+                            Manage Organizations
+                          </Button>
+                        }
+                      />
+                    ) : (
+                      <div className="space-y-4">
+                        <div className="flex flex-wrap gap-2">
+                          {selectedOrgIds.length > 0 ? (
+                            availableOrganizations?.results
+                              .filter((org) => selectedOrgIds.includes(org.id))
+                              .map((org) => (
+                                <Badge
+                                  key={org.id}
+                                  variant="secondary"
+                                  className="flex items-center gap-1"
+                                >
+                                  {org.name}
+                                  <Button
+                                    variant="ghost"
+                                    size="icon"
+                                    className="h-4 w-4 p-0 hover:bg-transparent"
+                                    onClick={() =>
+                                      handleToggleOrganization(org.id)
+                                    }
+                                  >
+                                    <X className="h-3 w-3" />
+                                  </Button>
+                                </Badge>
+                              ))
+                          ) : (
+                            <p className="text-sm text-muted-foreground">
+                              No organizations selected
+                            </p>
+                          )}
+                        </div>
+
+                        <Command className="rounded-lg border shadow-md">
+                          <CommandInput
+                            placeholder="Search organizations..."
+                            onValueChange={setOrgSearchQuery}
+                          />
+                          <CommandList>
+                            <CommandEmpty>No organizations found.</CommandEmpty>
+                            <CommandGroup>
+                              {isLoadingOrganizations ? (
+                                <div className="flex items-center justify-center py-6">
+                                  <Loader2 className="h-6 w-6 animate-spin" />
+                                </div>
+                              ) : (
+                                availableOrganizations?.results.map((org) => (
+                                  <CommandItem
+                                    key={org.id}
+                                    value={org.id}
+                                    onSelect={() =>
+                                      handleToggleOrganization(org.id)
+                                    }
+                                  >
+                                    <div className="flex flex-1 items-center gap-2">
+                                      <Building className="h-4 w-4" />
+                                      <span>{org.name}</span>
+                                      {org.description && (
+                                        <span className="text-xs text-muted-foreground">
+                                          - {org.description}
+                                        </span>
+                                      )}
+                                    </div>
+                                    {selectedOrgIds.includes(org.id) && (
+                                      <Check className="h-4 w-4" />
+                                    )}
+                                  </CommandItem>
+                                ))
+                              )}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </div>
+                    )}
+                  </div>
                 </CardContent>
               </Card>
             </div>
 
-            {/* Main Content */}
             <div className="space-y-6">
               <Card>
                 <CardHeader>
@@ -340,6 +496,22 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
                     />
                   </div>
 
+                  <div>
+                    <Label htmlFor="slug">Slug</Label>
+                    <Input
+                      id="slug"
+                      value={questionnaire.slug}
+                      onChange={(e) =>
+                        updateQuestionnaireField("slug", e.target.value)
+                      }
+                      placeholder="unique-identifier-for-questionnaire"
+                      className="font-mono"
+                    />
+                    <p className="text-sm text-muted-foreground mt-1">
+                      A unique URL-friendly identifier for this questionnaire
+                    </p>
+                  </div>
+
                   <div>
                     <Label htmlFor="desc">Description</Label>
                     <Textarea
@@ -368,7 +540,7 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
                     onClick={() => {
                       const newQuestion: Question = {
                         id: crypto.randomUUID(),
-                        link_id: `Q-${Date.now()}`,
+                        link_id: `${questionnaire.questions.length + 1}`,
                         text: "New Question",
                         type: "string",
                         questions: [],
@@ -619,7 +791,6 @@ function QuestionEditor({
               <Select
                 value={type}
                 onValueChange={(val: QuestionType) => {
-                  // Reset questions array when changing from group to another type
                   if (val !== "group") {
                     updateField("type", val, { questions: [] });
                   } else {
diff --git a/src/components/Questionnaire/show.tsx b/src/components/Questionnaire/show.tsx
index a10c24aa2d3..8df7b174cb5 100644
--- a/src/components/Questionnaire/show.tsx
+++ b/src/components/Questionnaire/show.tsx
@@ -293,7 +293,7 @@ export function QuestionnaireShow({ id }: QuestionnaireShowProps) {
           </div>
         </TabsContent>
 
-        <TabsContent value="preview" className="max-w-3xl mx-auto">
+        <TabsContent value="preview" className="mx-auto">
           <Card>
             <CardHeader>
               <CardTitle>{questionnaire.title}</CardTitle>
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index c77954fa11c..b794b6a99fb 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -14,7 +14,7 @@ const buttonVariants = cva(
         destructive:
           "bg-red-500 text-gray-50 shadow-sm hover:bg-red-500/90 dark:bg-red-900 dark:text-gray-50 dark:hover:bg-red-900/90",
         outline:
-          "border border-gray-400/75 bg-white shadow-sm hover:bg-gray-100 hover:text-gray-900 dark:border-gray-800 dark:bg-gray-950 dark:hover:bg-gray-800 dark:hover:text-gray-50",
+          "border border-gray-200 bg-white shadow-sm hover:bg-gray-100 hover:text-gray-900 dark:border-gray-800 dark:bg-gray-950 dark:hover:bg-gray-800 dark:hover:text-gray-50",
         primary:
           "bg-primary-700 text-white shadow hover:bg-primary-700/90 dark:bg-primary-100 dark:text-primary-900 dark:hover:bg-primary-100/90",
         secondary:
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 78d42f9b01b..b76d7c5b131 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -8,7 +8,7 @@ const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
       <input
         type={type}
         className={cn(
-          "flex w-full rounded-md border border-gray-400/75 bg-white px-3 py-2 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-gray-950 placeholder:text-gray-500 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-gray-950 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:border-gray-800 dark:file:text-gray-50 dark:placeholder:text-gray-400 dark:focus-visible:ring-gray-300",
+          "flex w-full rounded-md border border-gray-200 bg-white px-3 py-2 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-gray-950 placeholder:text-gray-500 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-gray-950 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:border-gray-800 dark:file:text-gray-50 dark:placeholder:text-gray-400 dark:focus-visible:ring-gray-300",
           className,
         )}
         ref={ref}
diff --git a/src/components/ui/phone-input.tsx b/src/components/ui/phone-input.tsx
index a0923c341b1..ba99fdcf042 100644
--- a/src/components/ui/phone-input.tsx
+++ b/src/components/ui/phone-input.tsx
@@ -74,7 +74,7 @@ const InputComponent = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <Input
     className={cn(
-      "rounded-e-md rounded-s-none focus-visible:ring-0 focus-visible:outline-none focus-visible:border-gray-400/75",
+      "rounded-e-md rounded-s-none focus-visible:ring-0 focus-visible:outline-none focus-visible:border-gray-200",
       className,
     )}
     {...props}
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 12fad2a26ee..0c49f26d525 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -21,7 +21,7 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-gray-400/75 bg-white px-3 py-2 text-sm shadow-sm transition-colors placeholder:text-gray-500 focus:border-primary-500 focus:outline-none focus:ring-1 focus:ring-primary-900 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-800 dark:bg-gray-950 dark:ring-offset-gray-950 dark:placeholder:text-gray-400 dark:focus-visible:ring-gray-300 [&>span]:line-clamp-1",
+      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-gray-200 bg-white px-3 py-2 text-sm shadow-sm transition-colors placeholder:text-gray-500 focus:border-primary-500 focus:outline-none focus:ring-1 focus:ring-primary-900 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-800 dark:bg-gray-950 dark:ring-offset-gray-950 dark:placeholder:text-gray-400 dark:focus-visible:ring-gray-300 [&>span]:line-clamp-1",
       className,
     )}
     {...props}
diff --git a/src/components/ui/textarea.tsx b/src/components/ui/textarea.tsx
index cb3d1045e6c..e464642a0b8 100644
--- a/src/components/ui/textarea.tsx
+++ b/src/components/ui/textarea.tsx
@@ -9,7 +9,7 @@ const Textarea = React.forwardRef<
   return (
     <textarea
       className={cn(
-        "flex min-h-[80px] w-full rounded-md border border-gray-400/75 bg-white px-3 py-1 text-base shadow-sm transition-colors placeholder:text-gray-500 focus-visible:ring-1 focus-visible:border-primary-500 focus-visible:outline-none focus-visible:ring-primary-500 md:text-sm disabled:opacity-50",
+        "flex min-h-[80px] w-full rounded-md border border-gray-200 bg-white px-3 py-1 text-base shadow-sm transition-colors placeholder:text-gray-500 focus-visible:ring-1 focus-visible:border-primary-500 focus-visible:outline-none focus-visible:ring-primary-500 md:text-sm disabled:opacity-50",
         className,
       )}
       ref={ref}

From 00fbb56eee221ab1cc33b7e4e21335b3a51824bc Mon Sep 17 00:00:00 2001
From: Aditya Jindal <adityajindal2305@gmail.com>
Date: Mon, 3 Feb 2025 16:22:03 +0530
Subject: [PATCH 02/19] Replace useTanStack with useQuery (#10345)

---
 src/components/Files/FileBlock.tsx            | 16 +--
 src/components/Files/FileUpload.tsx           | 98 ++++++++++++-------
 src/components/Patient/FileUploadPage.tsx     | 15 ++-
 .../Resource/ResourceDetailsUpdate.tsx        | 89 +++++++++--------
 4 files changed, 127 insertions(+), 91 deletions(-)

diff --git a/src/components/Files/FileBlock.tsx b/src/components/Files/FileBlock.tsx
index 46b6f680889..1b9cb9f8959 100644
--- a/src/components/Files/FileBlock.tsx
+++ b/src/components/Files/FileBlock.tsx
@@ -1,3 +1,4 @@
+import { useQuery } from "@tanstack/react-query";
 import dayjs from "dayjs";
 import { t } from "i18next";
 
@@ -12,7 +13,7 @@ import { FileManagerResult } from "@/hooks/useFileManager";
 import { FILE_EXTENSIONS } from "@/common/constants";
 
 import routes from "@/Utils/request/api";
-import useTanStackQueryInstead from "@/Utils/request/useQuery";
+import query from "@/Utils/request/query";
 
 export interface FileBlockProps {
   file: FileUploadModel;
@@ -33,10 +34,13 @@ export default function FileBlock(props: FileBlockProps) {
 
   const filetype = fileManager.getFileType(file);
 
-  const fileData = useTanStackQueryInstead(routes.retrieveUpload, {
-    query: { file_type: fileManager.type, associating_id },
-    pathParams: { id: file.id || "" },
-    prefetch: filetype === "AUDIO" && !file.is_archived,
+  const { data: fileData } = useQuery({
+    queryKey: ["file", { id: file.id, type: fileManager.type, associating_id }],
+    queryFn: query(routes.retrieveUpload, {
+      queryParams: { file_type: fileManager.type, associating_id },
+      pathParams: { id: file.id || "" },
+    }),
+    enabled: filetype === "AUDIO" && !file.is_archived,
   });
 
   const icons: Record<keyof typeof FILE_EXTENSIONS | "UNKNOWN", IconName> = {
@@ -82,7 +86,7 @@ export default function FileBlock(props: FileBlockProps) {
           <div className="w-full md:w-[300px]">
             <audio
               className="max-h-full w-full object-contain"
-              src={fileData.data?.read_signed_url}
+              src={fileData?.read_signed_url}
               controls
               preload="auto"
               controlsList="nodownload"
diff --git a/src/components/Files/FileUpload.tsx b/src/components/Files/FileUpload.tsx
index 3a63a601543..54881c80c0a 100644
--- a/src/components/Files/FileUpload.tsx
+++ b/src/components/Files/FileUpload.tsx
@@ -1,3 +1,4 @@
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { Loader2 } from "lucide-react";
 import { ReactNode, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -20,7 +21,7 @@ import useFileUpload from "@/hooks/useFileUpload";
 import { RESULTS_PER_PAGE_LIMIT } from "@/common/constants";
 
 import routes from "@/Utils/request/api";
-import useTanStackQueryInstead from "@/Utils/request/useQuery";
+import query from "@/Utils/request/query";
 
 export const LinearProgressWithLabel = (props: { value: number }) => {
   return (
@@ -90,6 +91,7 @@ export const FileUpload = (props: FileUploadProps) => {
   const [offset, setOffset] = useState(0);
   const [tab, setTab] = useState("UNARCHIVED");
   const authUser = useAuthUser();
+  const queryClient = useQueryClient();
 
   const handlePagination = (page: number, limit: number) => {
     const offset = (page - 1) * limit;
@@ -119,54 +121,78 @@ export const FileUpload = (props: FileUploadProps) => {
       CLAIM: claimId,
     }[type] || "";
 
-  const activeFilesQuery = useTanStackQueryInstead(routes.viewUpload, {
-    query: {
-      file_type: type,
-      associating_id: associatedId,
-      is_archived: false,
-      limit: RESULTS_PER_PAGE_LIMIT,
-      offset: offset,
-    },
-  });
+  const refetchAll = () => {
+    queryClient.invalidateQueries({
+      queryKey: ["viewUpload", "active", type, associatedId],
+    });
+    queryClient.invalidateQueries({
+      queryKey: ["viewUpload", "archived", type, associatedId],
+    });
+    if (type === "consultation") {
+      queryClient.invalidateQueries({
+        queryKey: ["viewUpload", "discharge_summary", associatedId],
+      });
+    }
+  };
 
-  const archivedFilesQuery = useTanStackQueryInstead(routes.viewUpload, {
-    query: {
-      file_type: type,
-      associating_id: associatedId,
-      is_archived: true,
-      limit: RESULTS_PER_PAGE_LIMIT,
-      offset: offset,
-    },
+  const { data: activeFiles, isLoading: activeFilesLoading } = useQuery({
+    queryKey: ["viewUpload", "active", type, associatedId, offset],
+    queryFn: query(routes.viewUpload, {
+      queryParams: {
+        file_type: type,
+        associating_id: associatedId,
+        is_archived: false,
+        limit: RESULTS_PER_PAGE_LIMIT,
+        offset: offset,
+      },
+    }),
   });
 
-  const dischargeSummaryQuery = useTanStackQueryInstead(routes.viewUpload, {
-    query: {
-      file_type: "discharge_summary",
-      associating_id: associatedId,
-      is_archived: false,
-      limit: RESULTS_PER_PAGE_LIMIT,
-      offset: offset,
-    },
-    prefetch: type === "consultation",
-    silent: true,
+  const { data: archivedFiles, isLoading: archivedFilesLoading } = useQuery({
+    queryKey: ["viewUpload", "archived", type, associatedId, offset],
+    queryFn: query(routes.viewUpload, {
+      queryParams: {
+        file_type: type,
+        associating_id: associatedId,
+        is_archived: true,
+        limit: RESULTS_PER_PAGE_LIMIT,
+        offset: offset,
+      },
+    }),
   });
 
+  const { data: dischargeSummary, isLoading: dischargeSummaryLoading } =
+    useQuery({
+      queryKey: ["viewUpload", "discharge_summary", associatedId, offset],
+      queryFn: query(routes.viewUpload, {
+        queryParams: {
+          file_type: "discharge_summary",
+          associating_id: associatedId,
+          is_archived: false,
+          limit: RESULTS_PER_PAGE_LIMIT,
+          offset: offset,
+          silent: true,
+        },
+      }),
+      enabled: type === "consultation",
+    });
+
   const queries = {
-    UNARCHIVED: activeFilesQuery,
-    ARCHIVED: archivedFilesQuery,
-    DISCHARGE_SUMMARY: dischargeSummaryQuery,
+    UNARCHIVED: { data: activeFiles, isLoading: activeFilesLoading },
+    ARCHIVED: { data: archivedFiles, isLoading: archivedFilesLoading },
+    DISCHARGE_SUMMARY: {
+      data: dischargeSummary,
+      isLoading: dischargeSummaryLoading,
+    },
   };
 
-  const refetchAll = async () =>
-    Promise.all(Object.values(queries).map((q) => q.refetch()));
-  const loading = Object.values(queries).some((q) => q.loading);
-
+  const loading = Object.values(queries).some((q) => q.isLoading);
   const fileQuery = queries[tab as keyof typeof queries];
 
   const tabs = [
     { text: "Active Files", value: "UNARCHIVED" },
     { text: "Archived Files", value: "ARCHIVED" },
-    ...(dischargeSummaryQuery.data?.results?.length
+    ...(dischargeSummary?.results?.length
       ? [
           {
             text: "Discharge Summary",
diff --git a/src/components/Patient/FileUploadPage.tsx b/src/components/Patient/FileUploadPage.tsx
index 06c5e2987e6..d964f7e65ca 100644
--- a/src/components/Patient/FileUploadPage.tsx
+++ b/src/components/Patient/FileUploadPage.tsx
@@ -1,8 +1,10 @@
+import { useQuery } from "@tanstack/react-query";
+
 import Page from "@/components/Common/Page";
 import { FileUpload } from "@/components/Files/FileUpload";
 
 import routes from "@/Utils/request/api";
-import useTanStackQueryInstead from "@/Utils/request/useQuery";
+import query from "@/Utils/request/query";
 
 export default function FileUploadPage(props: {
   facilityId: string;
@@ -11,10 +13,15 @@ export default function FileUploadPage(props: {
   type: "encounter" | "patient";
 }) {
   const { facilityId, patientId, encounterId, type } = props;
-  const { data: patient } = useTanStackQueryInstead(routes.getPatient, {
-    pathParams: { id: patientId },
-    prefetch: !!patientId,
+
+  const { data: patient } = useQuery({
+    queryKey: ["patient", patientId],
+    queryFn: query(routes.getPatient, {
+      pathParams: { id: patientId },
+    }),
+    enabled: !!patientId,
   });
+
   return (
     <Page
       hideBack={false}
diff --git a/src/components/Resource/ResourceDetailsUpdate.tsx b/src/components/Resource/ResourceDetailsUpdate.tsx
index d64bd2bc6f0..f3e48df7af8 100644
--- a/src/components/Resource/ResourceDetailsUpdate.tsx
+++ b/src/components/Resource/ResourceDetailsUpdate.tsx
@@ -1,6 +1,8 @@
+import { useQuery } from "@tanstack/react-query";
+import { useMutation } from "@tanstack/react-query";
 import { t } from "i18next";
 import { navigate, useQueryParams } from "raviger";
-import { useReducer, useState } from "react";
+import { useEffect, useReducer, useState } from "react";
 import { toast } from "sonner";
 
 import Card from "@/CAREUI/display/Card";
@@ -26,8 +28,8 @@ import useAppHistory from "@/hooks/useAppHistory";
 import { RESOURCE_STATUS_CHOICES } from "@/common/constants";
 
 import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
-import useTanStackQueryInstead from "@/Utils/request/useQuery";
+import mutate from "@/Utils/request/mutate";
+import query from "@/Utils/request/query";
 import { UpdateResourceRequest } from "@/types/resourceRequest/resourceRequest";
 
 interface resourceProps {
@@ -62,7 +64,6 @@ const initialState = {
 export const ResourceDetailsUpdate = (props: resourceProps) => {
   const { goBack } = useAppHistory();
   const [qParams, _] = useQueryParams();
-  const [isLoading, setIsLoading] = useState(true);
   const [assignedUser, SetAssignedUser] = useState<UserModel>();
   const resourceFormReducer = (state = initialState, action: any) => {
     switch (action.type) {
@@ -84,17 +85,16 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
   };
 
   const [state, dispatch] = useReducer(resourceFormReducer, initialState);
-
-  const { loading: assignedUserLoading } = useTanStackQueryInstead(
-    routes.userList,
-    {
-      onResponse: ({ res, data }) => {
-        if (res?.ok && data && data.count) {
-          SetAssignedUser(data.results[0]);
-        }
-      },
-    },
-  );
+  const { data, isLoading: assignedUserLoading } = useQuery({
+    queryKey: ["user", props.facilityId],
+    queryFn: query(routes.userList),
+  });
+
+  useEffect(() => {
+    if (data) {
+      SetAssignedUser(data.results[0]);
+    }
+  }, [data]);
 
   const validateForm = () => {
     const errors = { ...initError };
@@ -129,28 +129,40 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
     form[name] = selected;
     dispatch({ type: "set_form", form });
   };
-
-  const { data: resourceDetails } = useTanStackQueryInstead(
-    routes.getResourceDetails,
-    {
+  const { data: resourceDetails } = useQuery({
+    queryKey: ["resource", props.facilityId, props.id],
+    queryFn: query(routes.getResourceDetails, {
       pathParams: { id: props.id },
-      onResponse: ({ res, data }) => {
-        if (res && data) {
-          const d = data;
-          d["status"] = qParams.status || data.status.toLowerCase();
-          dispatch({ type: "set_form", form: d });
-        }
-        setIsLoading(false);
+    }),
+  });
+  useEffect(() => {
+    if (resourceDetails) {
+      dispatch({
+        type: "set_form",
+        form: {
+          ...resourceDetails,
+          status: qParams.status || resourceDetails.status.toLowerCase(),
+        },
+      });
+    }
+  }, [resourceDetails]);
+
+  const { mutate: updateResource, isPending: updateResourceLoading } =
+    useMutation({
+      mutationFn: mutate(routes.updateResource, {
+        pathParams: { id: props.id },
+      }),
+      onSuccess: (data) => {
+        dispatch({ type: "set_form", form: data });
+        toast.success(t("request_updated_successfully"));
+        navigate(`/facility/${props.facilityId}/resource/${props.id}`);
       },
-    },
-  );
+    });
 
   const handleSubmit = async () => {
     const validForm = validateForm();
 
     if (validForm) {
-      setIsLoading(true);
-
       const resourceData: UpdateResourceRequest = {
         id: props.id,
         status: state.form.status,
@@ -169,24 +181,11 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
         approving_facility: state.form.approving_facility?.id,
         related_patient: state.form.related_patient?.id,
       };
-
-      const { res, data } = await request(routes.updateResource, {
-        pathParams: { id: props.id },
-        body: resourceData,
-      });
-      setIsLoading(false);
-
-      if (res && res.status == 200 && data) {
-        dispatch({ type: "set_form", form: data });
-        toast.success(t("request_updated_successfully"));
-        navigate(`/facility/${props.facilityId}/resource/${props.id}`);
-      } else {
-        setIsLoading(false);
-      }
+      updateResource(resourceData);
     }
   };
 
-  if (isLoading) {
+  if (updateResourceLoading || !resourceDetails) {
     return <Loading />;
   }
 

From e52edd439f659afc23cdf30a53499c8d7f824547 Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Mon, 3 Feb 2025 11:50:07 +0000
Subject: [PATCH 03/19] Fix DateTimeQuestion response update logic from
 creating duplicates (#10369)

---
 .../Facility/ConsultationDetails/ObservationsList.tsx       | 6 ++++--
 .../ConsultationDetails/QuestionnaireResponsesList.tsx      | 5 ++++-
 .../Questionnaire/QuestionTypes/DateTimeQuestion.tsx        | 1 -
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components/Facility/ConsultationDetails/ObservationsList.tsx b/src/components/Facility/ConsultationDetails/ObservationsList.tsx
index e25002bf7cd..980a6a1c0d6 100644
--- a/src/components/Facility/ConsultationDetails/ObservationsList.tsx
+++ b/src/components/Facility/ConsultationDetails/ObservationsList.tsx
@@ -7,6 +7,8 @@ import CareIcon from "@/CAREUI/icons/CareIcon";
 
 import { Card } from "@/components/ui/card";
 
+import { formatValue } from "@/components/Facility/ConsultationDetails/QuestionnaireResponsesList";
+
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
 import { HTTPError } from "@/Utils/request/types";
@@ -96,7 +98,7 @@ export default function ObservationsList(props: Props) {
               )}
               {item.value.value && (
                 <div className="mt-1 font-medium whitespace-pre-wrap">
-                  {item.value.value}
+                  {formatValue(item.value.value, item.value_type)}
                 </div>
               )}
               {item.note && (
@@ -108,7 +110,7 @@ export default function ObservationsList(props: Props) {
         {hasNextPage && (
           <div ref={ref} className="flex justify-center p-4">
             <div className="text-sm text-gray-500">
-              {isFetchingNextPage ? t("loading_more") : t("load_more")}
+              {isFetchingNextPage ? t("loading") : t("load_more")}
             </div>
           </div>
         )}
diff --git a/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx b/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
index 73a909330c6..510fe1ea284 100644
--- a/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
+++ b/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
@@ -53,7 +53,10 @@ interface QuestionResponseProps {
   };
 }
 
-function formatValue(value: ResponseValueType["value"], type: string): string {
+export function formatValue(
+  value: ResponseValueType["value"],
+  type: string,
+): string {
   if (!value) return "";
 
   // Handle complex objects
diff --git a/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx b/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx
index b8aafb2e1df..7cc3e837c71 100644
--- a/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx
+++ b/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx
@@ -72,7 +72,6 @@ export function DateTimeQuestion({
 
     updateQuestionnaireResponseCB(
       [
-        ...questionnaireResponse.values,
         {
           type: "dateTime",
           value: date.toISOString(),

From 8ee64dad3c7b3e19db2674da9666095e89a1d12b Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Mon, 3 Feb 2025 12:07:44 +0000
Subject: [PATCH 04/19] Cleanup: Remove unused dependencies and components
 (#10348)

---
 .example.env                                  |   3 -
 .github/workflows/label-merge-conflict.yml    |   2 +-
 care.config.ts                                |   5 -
 package-lock.json                             | 231 +----------
 package.json                                  |  11 -
 public/asset-import-template.xlsx             | Bin 19402 -> 0 bytes
 src/common/schemaParser.ts                    | 197 ----------
 src/common/utils.tsx                          |  15 -
 src/components/Common/AvatarEditable.tsx      |  57 ---
 .../Common/ExcelFIleDragAndDrop.tsx           | 285 --------------
 src/components/Common/ExcelViewer.tsx         | 287 --------------
 src/components/Common/Export.tsx              |  71 ----
 .../Medicine/MedicationRequestTable/utils.ts  |   7 -
 .../Patient/allergy/AllergyTable.tsx          | 108 ------
 src/components/ui/chart.tsx                   | 363 ------------------
 src/components/ui/drawer.tsx                  | 116 ------
 src/hooks/useActiveLink.ts                    |  33 --
 src/hooks/useConfirmedAction.ts               |  17 -
 src/hooks/useExport.tsx                       |  90 -----
 src/hooks/useMergeState.js                    |  10 -
 src/hooks/useOrganization.ts                  |  45 ---
 src/pages/Facility/settings/notifications.tsx |  21 -
 src/pages/Facility/settings/users.tsx         |  17 -
 src/types/emr/medicationAdministration.ts     |  53 ---
 src/types/location/locationEncounter.ts       |   8 -
 src/vite-env.d.ts                             |   1 -
 26 files changed, 2 insertions(+), 2051 deletions(-)
 delete mode 100644 public/asset-import-template.xlsx
 delete mode 100644 src/common/schemaParser.ts
 delete mode 100644 src/common/utils.tsx
 delete mode 100644 src/components/Common/AvatarEditable.tsx
 delete mode 100644 src/components/Common/ExcelFIleDragAndDrop.tsx
 delete mode 100644 src/components/Common/ExcelViewer.tsx
 delete mode 100644 src/components/Common/Export.tsx
 delete mode 100644 src/components/Medicine/MedicationRequestTable/utils.ts
 delete mode 100644 src/components/Patient/allergy/AllergyTable.tsx
 delete mode 100644 src/components/ui/chart.tsx
 delete mode 100644 src/components/ui/drawer.tsx
 delete mode 100644 src/hooks/useActiveLink.ts
 delete mode 100644 src/hooks/useConfirmedAction.ts
 delete mode 100644 src/hooks/useExport.tsx
 delete mode 100644 src/hooks/useMergeState.js
 delete mode 100644 src/hooks/useOrganization.ts
 delete mode 100644 src/pages/Facility/settings/notifications.tsx
 delete mode 100644 src/pages/Facility/settings/users.tsx
 delete mode 100644 src/types/emr/medicationAdministration.ts
 delete mode 100644 src/types/location/locationEncounter.ts

diff --git a/.example.env b/.example.env
index 3e71d08fae3..04055c21c5e 100644
--- a/.example.env
+++ b/.example.env
@@ -47,9 +47,6 @@ REACT_SENTRY_DSN=
 # Sentry environment (default: staging)
 REACT_SENTRY_ENVIRONMENT=
 
-# Sample format file paths
-REACT_SAMPLE_FORMAT_ASSET_IMPORT=/asset-import-template.xlsx
-
 # Camera feed, still watching idle timeout (in seconds; default: 180)
 REACT_STILL_WATCHING_IDLE_TIMEOUT=
 
diff --git a/.github/workflows/label-merge-conflict.yml b/.github/workflows/label-merge-conflict.yml
index 5c3293e48ce..fd92df00d25 100644
--- a/.github/workflows/label-merge-conflict.yml
+++ b/.github/workflows/label-merge-conflict.yml
@@ -24,6 +24,6 @@ jobs:
           wait_ms: 15000
           detect_merge_changes: false
           conflict_comment: |
-            Conflicts have been detected against the base branch. Please rebase your branch against the base branch.
+            Conflicts have been detected against the base branch. Please merge the base branch into your branch.
             cc: @${author}
             > _See: https://docs.ohc.network/docs/contributing#how-to-resolve-merge-conflicts_
diff --git a/care.config.ts b/care.config.ts
index 0bd759fd246..6813a60b331 100644
--- a/care.config.ts
+++ b/care.config.ts
@@ -64,11 +64,6 @@ const careConfig = {
   reCaptchaSiteKey:
     env.REACT_RECAPTCHA_SITE_KEY || "6LdvxuQUAAAAADDWVflgBqyHGfq-xmvNJaToM0pN",
 
-  sampleFormats: {
-    assetImport:
-      env.REACT_SAMPLE_FORMAT_ASSET_IMPORT || "/asset-import-template.xlsx",
-  },
-
   wartimeShifting: boolean("REACT_WARTIME_SHIFTING"),
 
   stillWatching: {
diff --git a/package-lock.json b/package-lock.json
index 50f6ad0bb3b..e8c36ab78e0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,8 +11,6 @@
       "license": "MIT",
       "dependencies": {
         "@fontsource/figtree": "^5.1.1",
-        "@googlemaps/react-wrapper": "^1.1.42",
-        "@googlemaps/typescript-guards": "^2.0.3",
         "@headlessui/react": "^2.2.0",
         "@hello-pangea/dnd": "^17.0.0",
         "@hookform/resolvers": "^3.10.0",
@@ -42,7 +40,6 @@
         "@tanstack/react-query": "^5.64.1",
         "@tanstack/react-query-devtools": "^5.64.2",
         "@vitejs/plugin-react": "^4.3.4",
-        "@yudiel/react-qr-scanner": "^2.1.0",
         "bowser": "^2.11.0",
         "browser-image-compression": "^2.0.2",
         "browserslist": "^4.24.4",
@@ -54,10 +51,6 @@
         "cypress": "^14.0.0",
         "date-fns": "^3.6.0",
         "dayjs": "^1.11.13",
-        "echarts": "^5.5.1",
-        "echarts-for-react": "^3.0.2",
-        "events": "^3.3.0",
-        "hi-profiles": "^1.1.0",
         "html-to-image": "^1.11.11",
         "i18next": "^24.2.1",
         "i18next-browser-languagedetector": "^8.0.2",
@@ -65,7 +58,6 @@
         "i18next-resources-to-backend": "^1.2.1",
         "input-otp": "^1.4.2",
         "libphonenumber-js": "^1.11.18",
-        "lodash-es": "^4.17.21",
         "lucide-react": "^0.474.0",
         "markdown-it": "^14.1.0",
         "next-themes": "^0.4.3",
@@ -78,7 +70,6 @@
         "react-google-recaptcha": "^3.1.0",
         "react-hook-form": "^7.53.2",
         "react-i18next": "^15.2.0",
-        "react-infinite-scroll-component": "^6.1.0",
         "react-intersection-observer": "^9.15.1",
         "react-pdf": "^9.2.1",
         "react-phone-number-input": "^3.4.11",
@@ -88,8 +79,6 @@
         "tailwind-merge": "^3.0.0",
         "tailwindcss-animate": "^1.0.7",
         "use-keyboard-shortcut": "^1.1.6",
-        "vaul": "^1.1.1",
-        "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
         "zod": "^3.23.8"
       },
       "devDependencies": {
@@ -4032,30 +4021,6 @@
       "integrity": "sha512-WlauXrKAtHOadYti0l/dA2ez4lK7Yw2iQccv3ulmkMXgfKOdMjngob2AkIVxFyNLcvorVhh/Eq77DiWSGoR2bw==",
       "license": "OFL-1.1"
     },
-    "node_modules/@googlemaps/js-api-loader": {
-      "version": "1.16.8",
-      "resolved": "https://registry.npmjs.org/@googlemaps/js-api-loader/-/js-api-loader-1.16.8.tgz",
-      "integrity": "sha512-CROqqwfKotdO6EBjZO/gQGVTbeDps5V7Mt9+8+5Q+jTg5CRMi3Ii/L9PmV3USROrt2uWxtGzJHORmByxyo9pSQ==",
-      "license": "Apache-2.0"
-    },
-    "node_modules/@googlemaps/react-wrapper": {
-      "version": "1.1.42",
-      "resolved": "https://registry.npmjs.org/@googlemaps/react-wrapper/-/react-wrapper-1.1.42.tgz",
-      "integrity": "sha512-rZBqreFTpHmNgB4vYBFkWPjXrjg3HDRmCSQFugCJ7wT45B+Ueh3pzjSvvHHGGIqtSJ3nS5VXRqBhRgpanP0saw==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@googlemaps/js-api-loader": "^1.13.2"
-      },
-      "peerDependencies": {
-        "react": ">=16.8.0"
-      }
-    },
-    "node_modules/@googlemaps/typescript-guards": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/@googlemaps/typescript-guards/-/typescript-guards-2.0.3.tgz",
-      "integrity": "sha512-3iHuO8H0jPehftsMK0kgyJzPYU/g/oiTRw+wu/yltqSZ7wJPt3vfsJHkPiuRpQjbnnWygX+T3mkRGyK/eyZ/lw==",
-      "license": "Apache-2.0"
-    },
     "node_modules/@headlessui/react": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/@headlessui/react/-/react-2.2.0.tgz",
@@ -6522,12 +6487,6 @@
       "integrity": "sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==",
       "license": "MIT"
     },
-    "node_modules/@types/dom-webcodecs": {
-      "version": "0.1.11",
-      "resolved": "https://registry.npmjs.org/@types/dom-webcodecs/-/dom-webcodecs-0.1.11.tgz",
-      "integrity": "sha512-yPEZ3z7EohrmOxbk/QTAa0yonMFkNkjnVXqbGb7D4rMr+F1dGQ8ZUFxXkyLLJuiICPejZ0AZE9Rrk9wUCczx4A==",
-      "license": "MIT"
-    },
     "node_modules/@types/dompurify": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-3.2.0.tgz",
@@ -6539,12 +6498,6 @@
         "dompurify": "*"
       }
     },
-    "node_modules/@types/emscripten": {
-      "version": "1.39.13",
-      "resolved": "https://registry.npmjs.org/@types/emscripten/-/emscripten-1.39.13.tgz",
-      "integrity": "sha512-cFq+fO/isvhvmuP/+Sl4K4jtU6E23DoivtbO4r50e3odaxAiVdbfSYRDdJ4gCdxx+3aRjhphS5ZMwIH4hFy/Cw==",
-      "license": "MIT"
-    },
     "node_modules/@types/estree": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
@@ -7377,20 +7330,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/@yudiel/react-qr-scanner": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@yudiel/react-qr-scanner/-/react-qr-scanner-2.1.0.tgz",
-      "integrity": "sha512-O3832Qk8YU+vnLO+tsJalfQcXRZ1pOB9l6WrI3OdwpxkQEzukpT48M6Hc2vUUe1rFE6qapQnV3RGRFNM0S7CHw==",
-      "license": "MIT",
-      "dependencies": {
-        "barcode-detector": "^2.3.1",
-        "webrtc-adapter": "9.0.1"
-      },
-      "peerDependencies": {
-        "react": "^17 || ^18 || ^19",
-        "react-dom": "^17 || ^18 || ^19"
-      }
-    },
     "node_modules/acorn": {
       "version": "8.14.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.0.tgz",
@@ -7926,16 +7865,6 @@
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "license": "MIT"
     },
-    "node_modules/barcode-detector": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/barcode-detector/-/barcode-detector-2.3.1.tgz",
-      "integrity": "sha512-D9KEtrquS1tmBZduxBZl8qublIKnRrFqD8TAHDYcLCyrHQBo+vitIxmjMJ61LvXjXyAMalOlO7q0Oh/9Rl2PbQ==",
-      "license": "MIT",
-      "dependencies": {
-        "@types/dom-webcodecs": "0.1.11",
-        "zxing-wasm": "1.3.4"
-      }
-    },
     "node_modules/base64-js": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@@ -9555,36 +9484,6 @@
         "safer-buffer": "^2.1.0"
       }
     },
-    "node_modules/echarts": {
-      "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/echarts/-/echarts-5.6.0.tgz",
-      "integrity": "sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "tslib": "2.3.0",
-        "zrender": "5.6.1"
-      }
-    },
-    "node_modules/echarts-for-react": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/echarts-for-react/-/echarts-for-react-3.0.2.tgz",
-      "integrity": "sha512-DRwIiTzx8JfwPOVgGttDytBqdp5VzCSyMRIxubgU/g2n9y3VLUmF2FK7Icmg/sNVkv4+rktmrLN9w22U2yy3fA==",
-      "license": "MIT",
-      "dependencies": {
-        "fast-deep-equal": "^3.1.3",
-        "size-sensor": "^1.0.1"
-      },
-      "peerDependencies": {
-        "echarts": "^3.0.0 || ^4.0.0 || ^5.0.0",
-        "react": "^15.0.0 || >=16.0.0"
-      }
-    },
-    "node_modules/echarts/node_modules/tslib": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
-      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
-      "license": "0BSD"
-    },
     "node_modules/ejs": {
       "version": "3.1.10",
       "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
@@ -10399,15 +10298,6 @@
       "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
       "license": "MIT"
     },
-    "node_modules/events": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
-      "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.8.x"
-      }
-    },
     "node_modules/execa": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/execa/-/execa-4.1.0.tgz",
@@ -10492,6 +10382,7 @@
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
       "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-diff": {
@@ -11398,16 +11289,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/hi-profiles": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/hi-profiles/-/hi-profiles-1.1.0.tgz",
-      "integrity": "sha512-xlxkjsjT9dfsent7RnRbBgFpDx++jtErU7Iupnp/GgcDyEFlFbWNiEaxEGepKlZ91Y1XjbhtBzzKRg+7LGQEfg==",
-      "dependencies": {
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
-        "react-icons": "^4.11.0"
-      }
-    },
     "node_modules/hoist-non-react-statics": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
@@ -13241,12 +13122,6 @@
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
       "license": "MIT"
     },
-    "node_modules/lodash-es": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
-      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
-      "license": "MIT"
-    },
     "node_modules/lodash.castarray": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
@@ -15310,27 +15185,6 @@
         }
       }
     },
-    "node_modules/react-icons": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.12.0.tgz",
-      "integrity": "sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==",
-      "license": "MIT",
-      "peerDependencies": {
-        "react": "*"
-      }
-    },
-    "node_modules/react-infinite-scroll-component": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/react-infinite-scroll-component/-/react-infinite-scroll-component-6.1.0.tgz",
-      "integrity": "sha512-SQu5nCqy8DxQWpnUVLx7V7b7LcA37aM7tvoWjTLZp1dk6EJibM5/4EJKzOnl07/BsM1Y40sKLuqjCwwH/xV0TQ==",
-      "license": "MIT",
-      "dependencies": {
-        "throttle-debounce": "^2.1.0"
-      },
-      "peerDependencies": {
-        "react": ">=16.0.0"
-      }
-    },
     "node_modules/react-intersection-observer": {
       "version": "9.15.1",
       "resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-9.15.1.tgz",
@@ -16212,12 +16066,6 @@
         "loose-envify": "^1.1.0"
       }
     },
-    "node_modules/sdp": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/sdp/-/sdp-3.2.0.tgz",
-      "integrity": "sha512-d7wDPgDV3DDiqulJjKiV2865wKsJ34YI+NDREbm+FySq6WuKOikwyNQcm+doLAZ1O6ltdO0SeKle2xMpN3Brgw==",
-      "license": "MIT"
-    },
     "node_modules/semver": {
       "version": "7.6.3",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
@@ -16503,12 +16351,6 @@
         "simple-concat": "^1.0.0"
       }
     },
-    "node_modules/size-sensor": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/size-sensor/-/size-sensor-1.0.2.tgz",
-      "integrity": "sha512-2NCmWxY7A9pYKGXNBfteo4hy14gWu47rg5692peVMst6lQLPKrVjhY+UTEsPI5ceFRJSl3gVgMYaUi/hKuaiKw==",
-      "license": "ISC"
-    },
     "node_modules/slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -17390,15 +17232,6 @@
         "node": ">=0.8"
       }
     },
-    "node_modules/throttle-debounce": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-2.3.0.tgz",
-      "integrity": "sha512-H7oLPV0P7+jgvrk+6mwwwBDmxTaxnu9HMXmloNLXwnNO0ZxZ31Orah2n8lU1eMPvsaowP2CX+USCgyovXfdOFQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/throttleit": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.1.tgz",
@@ -18113,19 +17946,6 @@
         "node": ">= 0.10"
       }
     },
-    "node_modules/vaul": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/vaul/-/vaul-1.1.2.tgz",
-      "integrity": "sha512-ZFkClGpWyI2WUQjdLJ/BaGuV6AVQiJ3uELGk3OYtP+B6yCO7Cmn9vPFXVJkRaGkOJu3m8bQMgtyzNHixULceQA==",
-      "license": "MIT",
-      "dependencies": {
-        "@radix-ui/react-dialog": "^1.1.1"
-      },
-      "peerDependencies": {
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0.0 || ^19.0.0-rc",
-        "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0.0 || ^19.0.0-rc"
-      }
-    },
     "node_modules/verror": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
@@ -18971,19 +18791,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/webrtc-adapter": {
-      "version": "9.0.1",
-      "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-9.0.1.tgz",
-      "integrity": "sha512-1AQO+d4ElfVSXyzNVTOewgGT/tAomwwztX/6e3totvyyzXPvXIIuUUjAmyZGbKBKbZOXauuJooZm3g6IuFuiNQ==",
-      "license": "BSD-3-Clause",
-      "dependencies": {
-        "sdp": "^3.2.0"
-      },
-      "engines": {
-        "node": ">=6.0.0",
-        "npm": ">=3.10.0"
-      }
-    },
     "node_modules/whatwg-encoding": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
@@ -19728,18 +19535,6 @@
         }
       }
     },
-    "node_modules/xlsx": {
-      "version": "0.20.3",
-      "resolved": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
-      "integrity": "sha512-oLDq3jw7AcLqKWH2AhCpVTZl8mf6X2YReP+Neh0SJUzV/BdZYjth94tG5toiMB1PPrYtxOCfaoUCkvtuH+3AJA==",
-      "license": "Apache-2.0",
-      "bin": {
-        "xlsx": "bin/xlsx.njs"
-      },
-      "engines": {
-        "node": ">=0.8"
-      }
-    },
     "node_modules/xml-name-validator": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
@@ -19817,30 +19612,6 @@
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
-    },
-    "node_modules/zrender": {
-      "version": "5.6.1",
-      "resolved": "https://registry.npmjs.org/zrender/-/zrender-5.6.1.tgz",
-      "integrity": "sha512-OFXkDJKcrlx5su2XbzJvj/34Q3m6PvyCZkVPHGYpcCJ52ek4U/ymZyfuV1nKE23AyBJ51E/6Yr0mhZ7xGTO4ag==",
-      "license": "BSD-3-Clause",
-      "dependencies": {
-        "tslib": "2.3.0"
-      }
-    },
-    "node_modules/zrender/node_modules/tslib": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
-      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
-      "license": "0BSD"
-    },
-    "node_modules/zxing-wasm": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/zxing-wasm/-/zxing-wasm-1.3.4.tgz",
-      "integrity": "sha512-9l0QymyATF19FmI92QHe7Dayb+BUN7P7zFAt5iDgTnUf0dFWokz6GVA/W9EepjW5q8s3e89fIE/7uxpX27yqEQ==",
-      "license": "MIT",
-      "dependencies": {
-        "@types/emscripten": "^1.39.13"
-      }
     }
   }
 }
diff --git a/package.json b/package.json
index f99ce8c1621..df2e0678b34 100644
--- a/package.json
+++ b/package.json
@@ -49,8 +49,6 @@
   },
   "dependencies": {
     "@fontsource/figtree": "^5.1.1",
-    "@googlemaps/react-wrapper": "^1.1.42",
-    "@googlemaps/typescript-guards": "^2.0.3",
     "@headlessui/react": "^2.2.0",
     "@hello-pangea/dnd": "^17.0.0",
     "@hookform/resolvers": "^3.10.0",
@@ -80,7 +78,6 @@
     "@tanstack/react-query": "^5.64.1",
     "@tanstack/react-query-devtools": "^5.64.2",
     "@vitejs/plugin-react": "^4.3.4",
-    "@yudiel/react-qr-scanner": "^2.1.0",
     "bowser": "^2.11.0",
     "browser-image-compression": "^2.0.2",
     "browserslist": "^4.24.4",
@@ -92,10 +89,6 @@
     "cypress": "^14.0.0",
     "date-fns": "^3.6.0",
     "dayjs": "^1.11.13",
-    "echarts": "^5.5.1",
-    "echarts-for-react": "^3.0.2",
-    "events": "^3.3.0",
-    "hi-profiles": "^1.1.0",
     "html-to-image": "^1.11.11",
     "i18next": "^24.2.1",
     "i18next-browser-languagedetector": "^8.0.2",
@@ -103,7 +96,6 @@
     "i18next-resources-to-backend": "^1.2.1",
     "input-otp": "^1.4.2",
     "libphonenumber-js": "^1.11.18",
-    "lodash-es": "^4.17.21",
     "lucide-react": "^0.474.0",
     "markdown-it": "^14.1.0",
     "next-themes": "^0.4.3",
@@ -116,7 +108,6 @@
     "react-google-recaptcha": "^3.1.0",
     "react-hook-form": "^7.53.2",
     "react-i18next": "^15.2.0",
-    "react-infinite-scroll-component": "^6.1.0",
     "react-intersection-observer": "^9.15.1",
     "react-pdf": "^9.2.1",
     "react-phone-number-input": "^3.4.11",
@@ -126,8 +117,6 @@
     "tailwind-merge": "^3.0.0",
     "tailwindcss-animate": "^1.0.7",
     "use-keyboard-shortcut": "^1.1.6",
-    "vaul": "^1.1.1",
-    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
     "zod": "^3.23.8"
   },
   "devDependencies": {
diff --git a/public/asset-import-template.xlsx b/public/asset-import-template.xlsx
deleted file mode 100644
index 9d56afe3c3cddbd678b7fb3eafc5349e8db44d68..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 19402
zcmeI42UJs8)bCM56jX{*1Q7%jCDKGe6o`r-iV#sLQYBKQNs$17L_q{8qI5xnB1NS4
z5_%O-5D+ObfFPZO9%_;=$#rHjzL|Mz&025Pdf(!@goMjJzrFX}=YP&U;oNH)jNA4x
z?AWn`p<DEwJ_FssOL^^XCuQzz2D5Rna{29rjHJ80-K)>W4mHxdm}mD+@6qYEG2q>+
zvd`qRmh_&%!w&q<L!0-!{f212B4-2Na?rj7ygKvA!L@MZB6P2p$Yd@jlP6dHoUzEB
z8OOZHqo;kkZ~Hc?89l3aSkK>oDx<9|MHmM+Ny+8#4z4x0qN{Xf@Wih1&ivg!gp$L~
zr0#6J?55kAHmN#)ZbvM<t~mb4&}21ZEaUJ3NwfP=;VG8o^REu9oj&x48@k4{Y&n>o
z%ABdKbZuix1JXw}aI3#ulz8#fv0n8HM8%z_NqkG#57#T2yG%b|_cd-2fYcr@QStoX
zpL4{dBHTg^hJRRO%_#7&<wNo5m0@g-c#~YgQIK7ZNq@%2JmDhKYZ}Zun4vblOj{Tj
zm>C%uuKnLq33GI|b+NXvaCMQQeWRta0Baf@F?K(B4kA79u)g}hVV@KfneXx~w=!75
z6A?IEvDJyW;CR%-BcF4pR~I{l9xYYq*{`G0o1TOqGsWdbMhhR5a>o;E<4r2u7aKA1
zj`0KKYa33hKPHAR6=k8Y-o%Zr88C9A5;=veJP7uLBNry8;&@<L4wN5`VTwY@--F16
z-es60X_kP&VAe0ONzG2;#zHI0E0M&Ba52YtZ}|HBC{7HP<!Gw3AwTe~+{43#JS#Y`
zL2ANuJ32U4AjpZ)QYa&ovH--SUlF;q;;*-|7&6ZX8}M4#=*3ClQQph*gf1eR)ch!+
z{u8lw)v?l>w1x}KBFsbFOQPH2%S+(!<xfPhHoOVKJ;|RHrBp)f%)=}*XVjjTia*9v
zUgojjKVw2B)@oEBiiZZ`E8P*~v1ORI*9$O$w1Sq;QYOywA<1*Wu(s93@9X5nP$|=m
zl|gW1GB!ls1>EaDMZUR)#78!FiY2`?d5@hf|J+vUL70m)xhu6WhkVXvDs1XSARR^$
zM}yk%6=>w#Mi(w?K+$s@+u|=zZUa|(J1rB(LIo@CfvX%*WD;f_Hv1!}4dvz4zwWq!
zU&SpuBIj|JW-5ZoL_D5thEyAES_$vqi7&74xW7K$MxI)#C5H(j)V>XrlSXjz%VhWU
zq582<q?^aa_-HS20o+eo8^yK-AS=<8mGD)3C6X*VLV8%?;j)Z$FfCsv4fIzOdlT?M
z3$-^8?oZ;o{ryReaTrI$%IMU>l$YWL_7<2(2rXJ)m#Xq#9_)oV3ZfR<iohGsT81x~
z4j^0>utDp{GWeWhTV(~AP%RlByw;9%Std3zFGKn(RVk@2^Co8rnoKv2DIpf;SJMPZ
z#L@3!owc@J<W4=Wc|BC8vSNz2m(~<=N`YAGvPQ05mQ_}?+89w-4=*51x-^f}hWC39
zH(F&t)=ZJtiF2319{g)!BU$l!2rt2A)Bb=C(r6ySON{a|khB=SDlfS)SAKLjg@+U(
z_DL}QBv^Ukx^kH>1hG=%PF^Ae#jVFlDZ?o)zLlSeCw`wA`+mfWN!bfFb8s=w|5CX(
zxrf<%{WWr9Xu=9YTESa@6^F*WE-EMw39bgT%yCo>icHRNG+fFb7I_&u-gs$aub|A+
z&=o6X=t04`!-6@K*YRF;%F08gnPqoU<d>rL4mx}4k(ZiPv>d1OsBcV>_eTz;$P>D$
zZ>)x!RY>z+l|5E`)>m|3+7*)sga_F(df9Yort(qiZL3+?I>_L?^O2J8##m`@FKS9!
zcQE0+s`pRtLOix^Vlpm$9WQm-_f>TpyHd$*b)Mh_CaY}OmHkjro~si+9u<ST+_r;N
zKK}4IY@FT7^Rl{i&?+F(C_9Oju<9e*vwve(PB?4xjfqDvwzK^VG65<>Db8goYn8R}
z(LQHeq3r&3kP&x(xo1qQJ1Hj<%t5#EUmWkb9B}>s=V459LWo7R!G&Ez&yMy&x$RG|
z%I&3CTx@d7v#!0B{gU1HwCI&Wlxkd?5AhLi-68GV-4cBP-04T_g!ViMldx$|&cCg3
zXuFeogdIex4`q^_LbZ_WMVaI)mEVR?&lu$@l?RZknvg?3z|QmW3af0dem!js_pC-y
zeJD1Ed$to6eU$ttET<;IVghc03C==|DGWEEis@t}?4t&B7}FV4n8GuCjOvC4<&`}|
zs^<nZqG&rvT44$o%_hMTZcw0<0h~C6>3ol~si$GyO=Jz#n>H+T&u#cAA`iEjHe3DO
zZ}y^e?I9o<_2MT&{$0314lTsHg(*6i&On-@+IdPDeJEYPn^>GpCn4XA7J9xNB(5-J
zH{gr~yf0tL9&kni)0vF3siiq%Juwp!SgFuFATZ(>I=_5rl|Qi;C1(%e2cRv4d>eQl
zkXM7k6irO$V;ZzQSINE)B?myG{tQJIrU(E~D|lal5)ObWVLCH$HjOmscrVJ$9&#2y
zv=Q=c;e9|{o@-)SLxKu(Z7)~+wKi^uk#cSnrWj*7p90W4C0rlM4S=F>Hr<5$JG4j_
z?I85fGx<sa08|9i`35&pMT7G8qW0KBn1M_9f#7NlKLf<2R+yrK>3m2-$mA*s^r7|u
zi08NocCt`BGOP{UJQhE)z_yV0=d+&)u0WLq+d=#bQy6JcL(So53Y1;}4#;9UQ*je@
zGzVgOQCjv8F~EV31lPOpGeFdqg(){MolgJ<@|0fnp|k)8Uf?Fa5L}_O7(d!UQdZ`U
zB9sFKpACs6u5hGMeo&aQ7hqccnVE!}sG%|Sdr^}15FUWpOmMY<mjXfS7N%%mI{j$O
zoLnX2K9nTDjKocJ5L|%@O1FbV7pAZR2n%>=zLGHz76{XM7%?6Ze`cgnYqjJCV)i7a
zlb-2d50M9$tprzFcqtI4TVaYJrZWU!<|$$OP!0g|6>j1y!4<fc({_-e!W4dhX$3DW
zP{IPtvzX2d+(ZK{te#%fpAbQUBV$&pt7Zs9Y`oxD8@MeC@tWK$wwC3UNN%>Ge0v8b
z-X!0cyF-MmmLQ%zf4PtOjIju!n0yS3WjhfTK6Ea{wk~u9JYuzRUd{RXfpOQ6mGk73
zjYRMVb*(_gSDEdj1mbXO_w9R^X>U2ei{yy-HRk<Imz`dBo*KGDj-SsX3yCNk+v8fQ
zwu=Fk%fRsS9CZ6^ga8B3OzaV-psX)Cdh_o=-d&MZlUe(8??Ue<<&<*XGEPm;G}oQr
zPJ7c8*)e(L?){{KQclB>g2-4y<B5#SZF+ivX`m*Zexua(uE@#BD{l9b(50LvBO{Tq
zCdM{dnRR-4lWCw;oqp5QEng$IPF?Z2pHyASX*R+Y6>DZZk)8QSU++pf=$LLlG*#wn
zB;VAPr}vW@OF7L)RHI_ejcsx>FW%C7pANdE+h@Tg^HKbGo;oEF5&5m+P?S!O)$`yV
ziAQbT>eQ*HWp@ZuLeuWJo)(a*YnG-;Nnb)@xh{uqMh!H`TvSZ;a$1J4rJ)~|yNQy!
zutG!C;3AeOi7-mi4@(pW#@yqQGZLj_>Pnvzm&_0G<0SxSR2<r>)8hhwI(6#arDab7
zpxm?o8$B}&0P@!3V9cti0YIQEVM`OgS3Cg7L^Zga#a0RcRRqR(amkqiAa5?24e{fZ
z0Ei?GCF%4a0T82Z-H!C^ts=CDIMV};>6@{t(IQgP=kU$05e^0-$`-aX^E2iJKxV4J
zwJcN80H`i7CV)#03V@z)$?O9iuLnTfAgH8nPY?i-)vdEm&*lR_&glUY`etVV5K*6l
zF}KDC0D*FaEzSJ|_5&bu)!-%;+Y<n&IWQ)IOU?oSMRLg;2OVz#K$0M+iEd9c0J@`F
z_aQy|1OVzt4@kXbW($DIZ*lnM)eQZNC{NhZ$`AV!WThJ1#xf-ffIbJtyylX#20(AP
zWG;e^w*w$G5cH{T&szW#u3L9BBl`*fI*}1zV_+5sfV>Sj7z=7HgwRq4DiF53>-UNe
zi0H0ra2Jd1DFE~}FeaT#&K3Y=aLE{fj&}nf6A-jQw<ik#)#}y-WMo4DP*_I5F+;PK
zpV!Ec!?&;|0RW{H3R~Ly8S?`md(~hJ%aj}d`W6^d%q8bQ1yTFwH)s^?^%Vm&mkbOv
zjRl|{An2m5emMYL)va61$o2-Hq>O+qMrK<s(F%jhh(orxX3tYvbcV&k4fp&`9iTzE
zom8(5vBaIGL2*NYybWAYPPFI@8o6XbLDRzk=s5@~s;A!sfR5?a-OS961VAR40o6uk
zG61N{h$FA0#sL6fN`xC+{FZ)#Tve}*v+$n*K;wbD9b8ea0H~8oCIvJ-0f16L(3^Vt
zT>$8oUR{1>b_M{d$P9RBY-R?4B8@p@(KW3<BSH%|xcL<b01?4dui{za&H^C3BoqcS
zgHer!!rWjyIcRh?n%bVzWi&dd2W#AerJ{-xu~^k<yyP^V>V;7U9xqJ!Wj7erK}j1J
zj025kMbny$&PSsIuvkAVji%9uHLk<sYw%P@>JQ`ozrf8`vS|`o+cP&pto2A&@<B+k
zzR1db5@f^nFO}Rl6_6g%^V17TQci!K;9HWqgr1F+{W&lUaU-oq_H@6bCYmzBa1^bm
zfMCU=SAUK_#r1*)CAFulsL7^|P7<Wg%>tPU;XlVNhdF;;{Jr0sb_xRLJNw(VQZx5Z
zt2@AO<4xpQBbOtziZ4^6Tn$QV@g|JFx0d-0`r9z*;55SR`<shdX+M5{;}irc;{Clv
zqmugH2DooS%@W&x4@1vE=I1EMQB>?4^xFVhTpww;i^glTrCipIVmk8%I&*n?b0<3U
zke}w%;2r4Q9j5b;pU%T?e}x!6MJd_|dh;<l^Rx8k^Z~Zgc?hHT(1p&!S9BiY{|Yh3
zN9iNG=*->k(V6?wnIEJxpBtp}keSXyMfw1%={#inD};LprAr>6H>VG<iOw8CZ%%&&
z!|6Ok(R)Z=Bw~Mspw(Ouow*6U`4C-zJapz|^a0k>c_>BiA$^hjCBj6+4Ho^0&fJmS
zoc;>N(RtWU@8Kw&hw}6u(&zB65CWO0P?%mkH0birj$By3bgVGuXE(AoH2RNDJ?##_
z8cWcH<n)~`Bv!hRjOdeILzgukx~vt`7p@;&)+GN5L9P2Vdh-}S;$z)lI@5S@K>bhQ
z@b7!DI>5kiw-2jBu>r=6FZt*+N)mf%!^t}vm|i_TGnY2fXm{c>1F^;yv_U8#8Eedi
zMmN(23{_1uTHFm5xe3}#o!I}&VgN>C%gqY>SDp6>*7y#Px+JXeUNpJ^=)4+e^bt2$
z2+(<>++dp1cs@WSByjlH9_%SVB@Ftor*hD?fJ)@&qivzEZeY@BZ3FAB!)NBuRHD5D
zpScOzx0yQX&B<ml(C)SVvtppGtU1VRcHVy_N5<3mGeGK;aQM<5?0rD@Jo~WsbI?<O
z?k(n{rzpAy%#Ow>x<{EE<pH`!nH>dTjjaHIO~D%TpwX>>z(UYyNjKOlKwwdBuuV|n
zX6k6mE}O+bU9|eoih;Ti<P@~odH<Ch@k3$qz<iI_1}0yJcL3HOWjgQ<ly$`0G~I(z
zmLJ*C=xSgYQ5}sw<OcHvbnm$vOl2Cs9S~R%9R6_+b~hlfYJJ$<IcR=BV1x6~n;^0J
z&D2rXuQ!W<wjBST6$5Sc`r~Hj{a13d4~=dDQg;=NKIR4s2Xya+8|=n3{s^FZvN(Kl
z4^|V<J<C3<W)3<I(7liO=s1eN0%KDQMPTdk4#2XTOefwU5Q{Yj1U4Cq-2@%mOda)u
zK<H*MP(RoF&x!%~{CczV{wq0(>cL6?snhMlO5~so0o_Z_M;k(6MZm;T-v(AhnOFh~
zi8+*s<r6Fx3g})E7R!l7*8>831&u!J1`7fNHqs5IF^%U21QvwDZ-OpwrjEAkwpk3+
zHQ4{G7-)Zu#|^B8{b$hsH6Y4-?`P^L^SvM}7Wj}0nu5i0qtTxL-P1y&DH<9F=-w+g
z7)3+n0Np!_!x#2o?E!&x>%-dTpfP~JPUoXB6oCaMmOT`K-2?@0rjEMowpk3cHQ4{G
z7-)ZJ_VbT1{xj(R7SR07T{8&x!8sJjQtxAy{sEkS9IA{+AP`7A^2_p+ty)X9l_dOV
z{enLdiCCV*?LUYmuP#xxt(ht!;pCO}PeDAe0rE!ur!;UGdZishc6V9-RO=B9K^D&j
zwN;eB7v|AC@*_cHlHdRqOAa;lUP4O|XGp8j3#Q1WuINf)mm>)eBXl`dZj7`YtXQpO
zREE#b?T=SdKs1t{s7%kN8iRifAeQ2gtMh5dHFOqY33ExXf@tbg)g~2B+F09SidZsS
z|D*?AA3+k}#P4Z-12aVwpN2kRr%b<jlP5*IRwtKW%Vf`W0`Aj{BRHX)vej!eWo7LX
zwxyfR)T7dKX{ar9dTMMr6i?YMM`)LCb2RlLj;}jX_TiO!tW$E)?pt1pMlKSuabU`}
zyY*1;%}TGyF~Rr7%H;2j%jEC&Bq`FCfieVfXf-dcTgpLD$%ruC`>6#ZFAv@b0F&5<
z=WSjh1IR1GY;(lu!dYK<O}we2Lj}@ZOt5@)akV=hj93`y9w9<L!W?JU<D*PBXxkod
zk;D0NPBSpzWVimqwnq_Q2PxgQM^k4DJNnI!lGOJhZ5k{!((Ky@_qzK_!^6M&1)RjG
zJ#t7ocw0T0&F-M+TstN%Bw?^-<YSvxt?4N?**t!~(+Z$BKbWL*n<tv~aJFKd${D%$
z8ieHKiJHCHp;`W3>*Sqgd8e0N=KFKBYhuC%SUI}Xw~N3~c3Pf1yOI?jpLf5>b3olL
z5DKbE*|HSfWFT=UzjWJI2^1;EcmNW(N6UD3@8YoE=PffO`bT7TMTp)b^_AC#S#e)9
zev%cqw3oW|GvnQqW*#L%amx13zu)?~7s!FDwS~Qf6zwZ**XJiajKen}cA^i7aj3ky
zyZjhhJ2y^8&_HLha8fpBE~&a_tDFs~f){S@rIBDMVqv;<Sk_-ww(40+TIGHwwnsrH
zt!%AL_1W3Ef0#87o!VG(A$x3j_$<aRW;8hc`(BROy9*PXS>_i`Y>ha(7gYB6Nkl!%
zA&#T6+&muVW7fDw6l<?*dIVp1D#&H8_WaH**@*8E)qU}m4dBp(lR{|4)0U5#0w3)S
zObU|>%V%eoet9g!{}KDK!BNrqsIU%|h{q4+RbEH3Wq&U>CUGcMV6N{uC~d5wK^E#W
zO4xpGguSS{l24DZ20nIJIc11{$kU7Of$uq086%7fH>p1@XZt(8JtdA=O5ICm-F*iH
z?v|AF8W<yr>fwxKQ^rzWMZU`hWnj)JJF8xSvVkG1T6ZgXG%nq@`}L#bX~cs<`+)%m
zTUW*>&TAtU?m-tCT2nV(yzINQpA^1OzIA-)J+A42m$>>PMnClEvE;)_CLD?mY;`dL
zO96Qi<(=XZGA9_j%&f5QDyKwJ-#)#5g>C*xSk?s%P6f@{@)MI!-0p@MiQd(h>aMOo
zFeNisvhk|<$Fso;5_hJ!pxQSYx9%&s=D$<Rc`ETho}-7m_|(L=W6Z}5(IfJ1kr!^=
zvRWWKlUwxUX1(zs>$0g-jea_)Mu0;GW-3-w*qQ`YNPwDwQ?~Bc(Pm~E%(Y!HN!k&>
zaDy}I{`(C`ml8ZFC9HQhX8%sdiB}mN0vru)Q-RWjW<Dw%^6@2KTSnYdUuo}OsE2>y
z+dZ?rxm0%cUF*v!P%HzFEpO`7)!lg)=5}(cJg`YWDE2UYFA*%SQSJB5?D<V;Vrn2*
z<M8(f$uIh*EcYL^E$D6iwpKh8^|i6(z$DL$iyS+DJW6`?-jS<myj$L<<uc-C0^8-4
z9r*F*<SKD((l^PyyvY~jdUxG$u*1s*l~27_4iu46BtCef>NE8eYBI`Y6w0rlcEG>}
zEPgVo2JMb~nz^2PW2WP!wa`M7;WRO}>`k+P-biTw{T9C^uV{C;igcnxLsH3bN3v(*
ze!*=G&UsJD6vDf_?#PeN7?_uVmeQ9Yn5NuSW@<;Xc>B=oC}n?j#-4xbX#0SU=3;H;
zY+-)G)tS0yow`-s`+B=p%{lgstz<KonS0~Dd>v8Ge0FN@+}gb0S@bywXIzfqTwg{V
zy4#TudR8{>(?`1#tM9Iy4r6QRy=k=P($){+DIrRULmqJXVlH;xjE0U|S5!65U(F2?
z-S)Wnu8KIzsONEuYfL)4k28<(zbIeeay~#j|G01O<TZ9Do#wRmaRXiJbcPYWmbvMW
z2Mw{ykLLx2G<=#kTch-~g%vb@bbHkl+GA_yIaS7eWLcWyV&9fX7PyckVjt}mkuR@L
zy0fC2zEcHBw%J|Mxh?2cw8urvw6@c56Rd<Mx6k9W)!oi71q&Ne@}W7A$meOoa@$&x
zJ#horH_PTFekEPfDtKe}D*f@t8|_EWfC8RelS=;9Tdq*WzzvGIi%T`FzI@`bV&D9Z
z8%YT}@To+u=9R0xV$`HN9C{@tOHsDKt^btt-9MA=>S1R=%XYy{%}@+Q*O-WG0qc)N
zL*C<?33sJ3J#E<Hu9QQA@8nnMpDQGg*7h{C`sZSkb*6lGJ6iU`s|Kel<YN^z#<+T3
zW^!v>N#wc)Lbps5*?TNJ=M*f?DA^8jIin7l34*;~^NkA4h<GUEyQE;RGLGk6NQivA
z&g9wwP26JTUX_ZG8Bl1l6$}ctoEn*Dlr_2)%Zp#@dK|=h@a-c;HckB<(z{~Sc6v0q
zwm9tPkqs|N^r(OO9d9#$6|!&ieIKD~#%tUzY+JP*vTfS_!-VD5z>k&BtTLVAql&fD
zKWwwUSBHE5GHS%xOW3aD`LVg`W0@i+*J94SJzl&cw=TB7>!DQL&3&s(UAMZB@7-JQ
zD|6~8`O4Gnu}5BixF_rDT3EO9MFZxIibT-v2<wKj0dv~|+gh<k|M0Lm-)632K0~*!
zChhwJQ*W^Ih!-G&?bpf`G;sW3&dS{i^@z~K1$I5T-MIb;OVn&;XDy>auG*2<ZIRC`
zwU=*7K8YW9AZZmjW}due?zJb({nYFlBINp=9LHC=5W}N7ykqWIU(Pve(2gy;4ucQO
z6y^%nI!SoDL}I%tvoSt5qyjF1w{Dpr)zz$NvWktlFm<onmh`xmiYd8$HDg{>=a|vg
zs;nCbO-}3s2}Ee-<c*$hEd>)a0}mn#>mk&N$$JoFvrMU&9HxJ&7&f3{sB;3SqoXbD
zVG`lmj&aiL50KR)#`&p;(>I&GCOo@h-<2_$uW7)O3U~RqMK?Qi_3DMSDcG}Z8J{%1
z@YuPmEWjE)5ZFHPz6WByl3a7{!ov6XWQPN9ZXikpjROOGoL{{Ed|uq`+>qy-S%qq)
z$)QY<{+Xj(7CY_>AD-Y$PmuXKcslHDk@#!}PuN{H@wc2pJy%Sw9*IxXX?UV^Xl_he
zx-I1K*)JhXJOp;ONESOtQtE_y9&TqVAMUv{+no@?IVhvVo378S#uc2oYX?NqHcC@3
z1*i8yEyVY_m3KerO-z`RRFGElRVxzvz7QUg@l>#AZc%Y29BR^(rbn<>gbN-+eK?Kq
zjeXx~@G>iD@m%hh*<-M?_4E4A4&ZX5k8ovyhRm~!@}mvUZs`aKryQ3;-p`4F7x4?8
zaIoiCt(&a_o8PG3=TT?=jGws|)_-ZkB<;#_<2n8c?eWHUb4R#L*@IX-PhjQteeO?v
z9kt%#QXR!~WbugShq9_eF4#tPg?q;@wEM2JY*;A_E67Q*_J0wWEZkO}{Mh#0#_;^e
zt<0#AWbZ@XmG*C55Le-EElAd|yex2`JOtgAPdq(*2Ypk)kC+EhKbTgsLKEsrf0<kL
zlnNmK<HIocfC>Png7kGjn+#@zX=>F<v-?4+1dh+}i;Y~`(KWIC(0$esh6dDWZ79SX
z^6=Y171h{;qtN!qCDf@I?|Jt;qN@PhpPhd(jOSMCe)o{%Io<hgV&^0(PraGH>kV@g
zbAXqji9PDgjR;F9cJX-<yWruhCu_`y5;Ch(W6ao;u{U{NCW!iSm3L(13VroJh}E3*
zjkbDWXC=yZ_Qt(JLC+P4oUYE>?;K0j4^v*SoVVe={+fkbeO}PxWYBRxCz-bF3Q?8B
zHyVzoFC199PFzx*vgN8OyQa>Hx_%XRI3`Y`#_P8Ao!#fep0%&3X*Lc)9mrMVDx$8H
z>fG&a&um;}3mgM77_X~6KT{B@CBDzfv}|K5wM&sNmKX1&Bvkw#6Us_SD3Hyc)9Lej
ze5Bc#K2xUCmW1o~%!1!!%N()WeeiXm%As>9Hfc3D-1QLF=<wAAL~?qx2b68mObGP)
zgY#``u8C^CE!~7NB?eY)0|~L*qqplB?iU=BI^7iGZ~<Ig#R>I&psWV_q4@5g)&3LC
z)}6^B;FcIQ$Kvq25!+WK+m^po@?Z0gNpIik^_KNEZgN&IuGHb0yYT(^_69*N(<h=D
zj?ygpM@XXJ{(y$#Z>rM5kc#@{l-V=$jzq^dLX?fX3`Z&9{{3v48Y<<PH1-y*X69zD
zX2VdqFS5@#ze7*%8#-}PMn<OKr0l6v+V0hvhejgX>SJSh1o@7OPRGO<M7((UZYJFH
zz)VauDmL6;T4?Aw=Z}{9nrflyqjf`LGh^cQqdx>Whi201z6*}>{TLk<%&ec(k9ZMt
zr^=#wuxhZHy^6j1SzUFtP}TA3*Htg;TdPH9$z&u!oLk7(Y`X{}Eea3WV_hK>AA>3X
z|2_)pJ%OQ$ql2r3gRALHk9!s_##9|FxY<N`s1Eg>K;?(6>Mo_5I;w-8M|yO{i4P8;
z*jXLtcWIC+v>sehO=U<mDpP7RJdPQj_!?^$@;o2r$2+3({0*qQ!$CVBt9NSfym{T=
zKHiyZ_T6DIS`H0)M}#a=d$bST9i2UTIP#Ri>u=1iJ5#;#t8DmqPMj-w#MF%bK5G)y
zFLUPLy_Q2qhON?XTbzdXWfXn!d%zwn`7m7S#fOW8T+P8&%d^o|Uou{uIU(D_-y{<2
zz}9u<GcM=cg;X7Ph}hnOnjldxoe9oJDLuK!ANz!T68N5HG|4MVqUW?07=<ezY9>0{
z{$Nwjol;v>p0E*g!3oJVKH}cLPufU~wToTb+xcp=-`e~}-#tWBr}E85nnTl_-&9<A
zjqW|>85?W3jhx-H3bD|Fu&yVbx!r9ddlxgtoxeWS-&$^ZaM5D<?A3}b)MDy5u%}Ut
zQb@+zsFz{O)_n|rJmQG{i9OUu9R2zDy9XZq+6w&*@Sj`Jpl~Uz(B1U@@vNU;TcN*&
zq~0w5aa=g_Yb$?w>-=kj^iySOmHlz3ouxJS>wW024bV^fs59z6jx1$b1OLbT`qvid
zrvcRI;U9<SIiQ8#CyT$D(vKh1dBPuu?uFme@!PE7S7Umuqz*BE9Qqe&#(y*5{Mrt^
z5K-mkk0Vv}PdfXnA${Nfvtfi9&4J%k>sLeiYW?#?Gr07ZLUB!lX*<;|R?5Fl%KZGh
II`!TE0I^9m;{X5v

diff --git a/src/common/schemaParser.ts b/src/common/schemaParser.ts
deleted file mode 100644
index d4c2d89e1ee..00000000000
--- a/src/common/schemaParser.ts
+++ /dev/null
@@ -1,197 +0,0 @@
-export interface SingleKeySchema {
-  parent?: string;
-  prop: string;
-  type: string;
-  oneOf?: string[];
-  required?: boolean;
-  parse?: (value: any) => any;
-}
-
-export interface SchemaType {
-  [key: string]: SingleKeySchema;
-}
-
-export interface DataWithError {
-  [key: string]: {
-    value: any;
-    error?: string;
-  };
-}
-
-export interface ParsedData {
-  [key: string]: any;
-}
-
-export interface ErrorData {
-  index: number;
-  key: string;
-  error: string;
-}
-
-interface parseDataProps {
-  dataWithErrors: DataWithError[];
-  parsedData: ParsedData[];
-  errors: ErrorData[];
-}
-
-const validateAndParse = (
-  key: string,
-  value: any,
-  schema: SingleKeySchema,
-): { [key: string]: { value: any; error?: string } } => {
-  try {
-    const parsedValue = schema?.parse?.(value) ?? value;
-    const expectedType = schema?.type;
-
-    if (
-      (parsedValue === undefined || parsedValue === null) &&
-      !schema?.required
-    ) {
-      return { [key]: { value: parsedValue } };
-    }
-
-    if (typeof parsedValue !== expectedType && expectedType !== "any") {
-      return {
-        [key]: {
-          value: parsedValue,
-          error: `${key} should be of type ${expectedType}`,
-        },
-      };
-    }
-
-    if (schema?.oneOf && !schema?.oneOf.includes(parsedValue)) {
-      return {
-        [key]: {
-          value: parsedValue,
-          error: `${key} should be one of the ${schema?.oneOf}`,
-        },
-      };
-    }
-
-    if (
-      schema?.required &&
-      (parsedValue === undefined || parsedValue === null)
-    ) {
-      return {
-        [key]: { value: parsedValue, error: `${key} is required` },
-      };
-    }
-
-    return { [key]: { value: parsedValue } };
-  } catch (error: any) {
-    return { [key]: { value, error: error.message } };
-  }
-};
-
-const parseDataWithSchema = (
-  data: any[],
-  schema: SchemaType,
-): parseDataProps => {
-  const errors: ErrorData[] = [];
-  const parsedData: ParsedData[] = [];
-  const dataWithErrors: DataWithError[] = data.map((item, index) => {
-    return Object.keys(schema).reduce((acc, key) => {
-      const {
-        [key]: { value, error },
-      } = validateAndParse(key, item[key], schema[key]);
-      const parsedRow = { [schema[key].prop]: value };
-      if (error) {
-        errors.push({ index, key, error });
-      }
-      const prop = schema[key].prop || key;
-
-      if (schema[key].parent) {
-        const indexKey = schema[key].parent || key;
-        acc[indexKey] = acc[indexKey] || {};
-        acc[indexKey][prop] = { value, error };
-
-        if (!parsedData[index]) {
-          parsedData[index] = {};
-        }
-
-        parsedData[index][indexKey] = {
-          ...(parsedData[index][indexKey] || {}),
-          [prop]: value,
-        };
-      } else {
-        acc[prop] = { value, error };
-
-        if (!parsedData[index]) {
-          parsedData[index] = {};
-        }
-
-        parsedData[index] = { ...parsedData[index], ...parsedRow };
-      }
-
-      return acc;
-    }, {} as ParsedData);
-  });
-
-  return { dataWithErrors, parsedData, errors };
-};
-/**
- * This function takes in an array of JSON data and a schema and returns the parsed data and the data with errors
- * @param dataArray The array of JSON data to be parsed
- * @param schema The schema to validate and parse the data against
- * @returns An object containing the parsed data, data with errors, and data without errors
- * @example
- * const data = [
- *  { name: "Ram", age: 25 },
- *  { name: "Raj", age: "30" },
- *  { name: "Sam", age: 35 },
- * ];
- *
- * const schema = {
- *  name: { prop: "name", type: "string", required: true },
- *  age: { prop: "age", type: "number", required: true , parse: (value) => {
- *    if(value < 0 || value > 100) throw new Error("age should be between 0 and 100");
- *    return value;
- * },
- * };
- *
- * const { dataWithErrors, parsedData, ParsedDataWithOutErrors, errors } = schemaParser(data, schema);
- *
- * dataWithErrors => [
- * { name: { value: "Ram" }, age: { value: 25 } },
- * { name: { value: "Raj" }, age: { value: "30", error: "age should be of type number" } },
- * { name: { value: "Sam" }, age: { value: 35 } },
- * ]
- *
- * parsedData => [
- * { name: "Ram", age: 25 },
- * { name: "Raj", age: "30" },
- * { name: "Sam", age: 35 },
- * ]
- *
- * ParsedDataWithOutErrors => [
- * { name: "Ram", age: 25 },
- * { name: "Sam", age: 35 },
- * ]
- *
- * errors => [
- * { index: 1, key: "age", error: "age should be of type number" }
- * ]
- *
- */
-const schemaParser = (
-  dataArray: any[],
-  schema: SchemaType,
-): parseDataProps & { ParsedDataWithOutErrors: ParsedData[] } => {
-  const { dataWithErrors, parsedData, errors } = parseDataWithSchema(
-    dataArray,
-    schema,
-  );
-
-  const ParsedDataWithOutErrors = parsedData.filter((item, index) => {
-    return !Object.values(dataWithErrors[index]).some((item) => item.error);
-  });
-
-  return {
-    dataWithErrors,
-    parsedData,
-    ParsedDataWithOutErrors,
-    errors,
-  };
-};
-
-export default schemaParser;
diff --git a/src/common/utils.tsx b/src/common/utils.tsx
deleted file mode 100644
index a2f4a681037..00000000000
--- a/src/common/utils.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-export const deepEqual = (x: any, y: any): boolean => {
-  if (x === y) return true;
-
-  if (typeof x == "object" && x != null && typeof y == "object" && y != null) {
-    if (Object.keys(x).length != Object.keys(y).length) return false;
-
-    Object.keys(x).forEach((key) => {
-      if (!deepEqual(x[key], y[key])) return false;
-    });
-
-    return true;
-  }
-
-  return false;
-};
diff --git a/src/components/Common/AvatarEditable.tsx b/src/components/Common/AvatarEditable.tsx
deleted file mode 100644
index bbf3ab6c35f..00000000000
--- a/src/components/Common/AvatarEditable.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import { useTranslation } from "react-i18next";
-
-import { cn } from "@/lib/utils";
-
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-import { Avatar, AvatarProps } from "@/components/Common/Avatar";
-
-interface AvatarEditableProps extends AvatarProps {
-  id?: string;
-  editable?: boolean;
-  onClick?: () => void;
-}
-
-const AvatarEditable: React.FC<AvatarEditableProps> = ({
-  id,
-  colors: propColors,
-  name,
-  imageUrl,
-  className,
-  editable = true,
-  onClick,
-}) => {
-  const { t } = useTranslation();
-  return (
-    <div
-      id={id}
-      className={cn(
-        `group grid aspect-square h-full w-full place-items-center text-clip transition-all duration-200 ease-in-out [grid-template-areas:'stack']`,
-        editable && "cursor-pointer",
-        className,
-      )}
-    >
-      <Avatar
-        imageUrl={imageUrl}
-        name={name}
-        colors={propColors}
-        className="flex h-full w-full [grid-area:stack]"
-      />
-
-      {editable && (
-        <div
-          className={
-            "flex h-full w-full cursor-pointer flex-col items-center justify-center bg-black text-sm text-secondary-300 opacity-0 transition-opacity [grid-area:stack] hover:opacity-60"
-          }
-          style={{ borderRadius: "calc(100% / 15)" }}
-          onClick={onClick}
-        >
-          <CareIcon icon="l-pen" className="text-lg" />
-          <span className="mt-2">{t(imageUrl ? "edit" : "upload")}</span>
-        </div>
-      )}
-    </div>
-  );
-};
-
-export default AvatarEditable;
diff --git a/src/components/Common/ExcelFIleDragAndDrop.tsx b/src/components/Common/ExcelFIleDragAndDrop.tsx
deleted file mode 100644
index 1689d5b3d21..00000000000
--- a/src/components/Common/ExcelFIleDragAndDrop.tsx
+++ /dev/null
@@ -1,285 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { toast } from "sonner";
-import * as XLSX from "xlsx";
-
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-import { Button } from "@/components/ui/button";
-
-import ExcelViewer from "@/components/Common/ExcelViewer";
-
-import useDragAndDrop from "@/hooks/useDragAndDrop";
-
-import schemaParser, {
-  ErrorData,
-  ParsedData,
-  SchemaType,
-} from "@/common/schemaParser";
-
-interface Props {
-  handleSubmit: (data: any) => void;
-  loading: boolean;
-  sampleLink?: string;
-  schema: SchemaType;
-  onClose?: () => void;
-  setIsValid?: (value: boolean) => void;
-}
-
-export default function ExcelFileDragAndDrop({
-  handleSubmit,
-  loading = false,
-  sampleLink,
-  schema,
-  onClose,
-  setIsValid,
-}: Props) {
-  const [fileData, setFileData] = useState<any>([]);
-  const [errors, setErrors] = useState<ErrorData[]>([]);
-  const [preview, setPreview] = useState(false);
-  const [selectedFile, setSelectedFile] = useState<any>();
-  const [validData, setValidData] = useState<ParsedData[]>([]);
-  const [parsedData, setParsedData] = useState<ParsedData[]>([]);
-
-  const { t } = useTranslation();
-  const fileInputRef = useRef<HTMLInputElement>(null);
-
-  const closeModal = () => {
-    setSelectedFile(undefined);
-    setFileData([]);
-    onClose?.();
-  };
-
-  const onSelectFile = (file: Blob) => {
-    setSelectedFile(file);
-    dragProps.setFileDropError("");
-    try {
-      const reader = new FileReader();
-
-      reader.onload = (e) => {
-        const result = (e.target as FileReader).result;
-        const workbook = XLSX.read(result, {
-          type: "binary",
-          cellDates: true,
-        });
-        const worksheetName = workbook.SheetNames[0];
-        const worksheet = workbook.Sheets[worksheetName];
-        const data = XLSX.utils.sheet_to_json(worksheet, { defval: "" });
-        //converts the date to string
-        data.forEach((row: any) => {
-          Object.keys(row).forEach((key) => {
-            if (row[key] instanceof Date) {
-              row[key] = row[key].toISOString().split("T")[0];
-            }
-          });
-        });
-
-        setFileData(data);
-      };
-      reader.onerror = () => {
-        throw new Error("Error in reading file");
-      };
-
-      reader.readAsBinaryString(file);
-    } catch (e: any) {
-      toast.error(e.message);
-    }
-  };
-
-  useEffect(() => {
-    if (fileData.length !== 0) {
-      const { errors, parsedData, ParsedDataWithOutErrors } = schemaParser(
-        fileData,
-        schema,
-      );
-      setErrors(errors);
-      setParsedData(parsedData);
-      setValidData(ParsedDataWithOutErrors);
-      if (ParsedDataWithOutErrors.length !== 0) {
-        setIsValid?.(true);
-      }
-    }
-  }, [fileData]);
-
-  const dragProps = useDragAndDrop();
-  const onDrop = (e: React.DragEvent<HTMLDivElement>) => {
-    e.preventDefault();
-    dragProps.setDragOver(false);
-
-    const droppedFiles = e?.dataTransfer?.files;
-
-    if (!droppedFiles || droppedFiles.length === 0) {
-      return dragProps.setFileDropError("Please drop a file to upload!");
-    }
-
-    const droppedFile = droppedFiles[0];
-    const fileTypes = [
-      "vnd.ms-excel",
-      "text/csv",
-      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-    ];
-
-    if (!fileTypes.includes(droppedFile?.type)) {
-      dragProps.setFileDropError("Please drop a Excel / CSV file to upload!");
-      setSelectedFile(null);
-      return;
-    }
-    onSelectFile(droppedFile);
-  };
-
-  return (
-    <div>
-      {preview && (
-        <ExcelViewer
-          show={preview}
-          onClose={() => setPreview(false)}
-          selectedFile={selectedFile}
-          fileData={fileData}
-          errors={errors}
-          handleSubmit={handleSubmit}
-          parsedData={parsedData}
-        />
-      )}
-      <div
-        onDragOver={dragProps.onDragOver}
-        onDragLeave={dragProps.onDragLeave}
-        onDrop={onDrop}
-        onClick={() => !selectedFile && fileInputRef.current?.click()}
-        className={`mb-8 mt-5 flex flex-1 flex-col items-center justify-center rounded-lg border-[3px] border-dashed px-3 py-6 ${
-          dragProps.dragOver ? "border-primary-500" : "border-secondary-500"
-        } ${dragProps.fileDropError !== "" ? "border-red-500" : ""}`}
-      >
-        <svg
-          stroke="currentColor"
-          fill="none"
-          viewBox="0 0 24 24"
-          aria-hidden="true"
-          className={`h-12 w-12 ${dragProps.dragOver && "text-primary-500"} ${
-            dragProps.fileDropError !== ""
-              ? "text-red-500"
-              : "text-secondary-600"
-          }`}
-        >
-          <path d="M12.71,11.29a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-2,2a1,1,0,0,0,1.42,1.42l.29-.3V17a1,1,0,0,0,2,0V14.41l.29.3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42ZM20,8.94a1.31,1.31,0,0,0-.06-.27l0-.09a1.07,1.07,0,0,0-.19-.28h0l-6-6h0a1.07,1.07,0,0,0-.28-.19l-.1,0A1.1,1.1,0,0,0,13.06,2H7A3,3,0,0,0,4,5V19a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V9S20,9,20,8.94ZM14,5.41,16.59,8H15a1,1,0,0,1-1-1ZM18,19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V5A1,1,0,0,1,7,4h5V7a3,3,0,0,0,3,3h3Z" />
-        </svg>
-        <p
-          className={`text-sm ${dragProps.dragOver && "text-primary-500"} ${
-            dragProps.fileDropError !== ""
-              ? "text-red-500"
-              : "text-secondary-700"
-          } text-center`}
-        >
-          {dragProps.fileDropError !== "" && dragProps.fileDropError}
-          {!selectedFile && "Drag & drop xlsx/csv file to upload"}
-        </p>
-        <input
-          data-testid="import-file"
-          type="file"
-          accept=".csv, .xlsx"
-          onChange={(e) => {
-            const files = e.target.files;
-            if (files && files.length > 0) {
-              onSelectFile(files[0]);
-            }
-          }}
-          className="hidden"
-          ref={fileInputRef}
-        />
-        {selectedFile && (
-          <div className="flex pt-2">
-            <p className="text-sm text-secondary-700">
-              {selectedFile.name} - {(selectedFile.size / 1024).toFixed(2)} KB
-            </p>
-            <span
-              className="cursor-pointer px-5 text-sm text-primary-500"
-              onClick={() => {
-                setSelectedFile(undefined);
-                setFileData([]);
-                setErrors([]);
-                setValidData([]);
-                if (setIsValid) setIsValid(false);
-                dragProps.setDragOver(false);
-                dragProps.setFileDropError("");
-              }}
-            >
-              cancel
-            </span>
-          </div>
-        )}
-        {selectedFile ? (
-          <>
-            <span
-              className="focus:ring-blue mx-auto mt-4 max-w-xs cursor-pointer items-center rounded-md border border-primary-500 bg-white px-3 py-2 text-sm font-medium leading-4 text-primary-700 transition duration-150 ease-in-out hover:text-primary-500 hover:shadow focus:border-primary-300 focus:outline-none active:bg-secondary-50 active:text-primary-800"
-              onClick={() => setPreview(true)}
-            >
-              <CareIcon
-                icon="l-arrow-up-right"
-                className="mr-1 text-lg"
-                aria-hidden="true"
-              />{" "}
-              preview
-            </span>
-          </>
-        ) : (
-          <a
-            className="focus:ring-blue mx-auto mt-4 max-w-xs items-center rounded-md border border-primary-500 bg-white px-3 py-2 text-sm font-medium leading-4 text-primary-700 transition duration-150 ease-in-out hover:text-primary-500 hover:shadow focus:border-primary-300 focus:outline-none active:bg-secondary-50 active:text-primary-800"
-            href={sampleLink}
-            rel="noreferrer"
-            target="_blank"
-            download
-            onClick={(e) => e.stopPropagation()}
-          >
-            <CareIcon
-              icon="l-download-alt"
-              className="mr-1 text-lg"
-              aria-hidden="true"
-            />{" "}
-            <span>{t("sample_format")}</span>
-          </a>
-        )}
-      </div>
-      <div className="flex flex-col gap-2 sm:flex-row">
-        <label
-          className="flex cursor-pointer items-center justify-center gap-1 rounded-lg border border-primary-500 bg-white px-4 py-2 text-sm font-medium text-primary-500 transition-all hover:border-primary-400 hover:text-primary-400"
-          onClick={() => fileInputRef.current?.click()}
-        >
-          <CareIcon icon="l-cloud-upload" className="mr-2 text-lg" />
-          Upload a file
-        </label>
-        <div className="sm:flex-1" />
-        <Button
-          type="button"
-          variant="outline"
-          onClick={() => {
-            closeModal();
-            setErrors([]);
-            setValidData([]);
-            dragProps.setDragOver(false);
-            dragProps.setFileDropError("");
-          }}
-          disabled={loading}
-        >
-          {t("close")}
-        </Button>
-        <Button
-          type="submit"
-          variant="primary"
-          data-testid="import-btn"
-          onClick={() => handleSubmit(validData)}
-          disabled={loading || !selectedFile || validData.length === 0}
-        >
-          {loading ? (
-            <CareIcon icon="l-spinner" className="animate-spin text-lg" />
-          ) : (
-            <CareIcon icon="l-file-import" className="text-lg" />
-          )}
-          <span>
-            {loading
-              ? "Importing..."
-              : `Import ${validData.length} valid fields`}
-          </span>
-        </Button>
-      </div>
-    </div>
-  );
-}
diff --git a/src/components/Common/ExcelViewer.tsx b/src/components/Common/ExcelViewer.tsx
deleted file mode 100644
index e77dc0132da..00000000000
--- a/src/components/Common/ExcelViewer.tsx
+++ /dev/null
@@ -1,287 +0,0 @@
-import { t } from "i18next";
-import { ReactNode, useEffect, useState } from "react";
-
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-import { Button } from "@/components/ui/button";
-
-import DialogModal from "@/components/Common/Dialog";
-import Pagination from "@/components/Common/Pagination";
-
-import { ParsedData } from "@/common/schemaParser";
-
-type FilePreviewProps = {
-  title?: ReactNode;
-  description?: ReactNode;
-  show: boolean;
-  onClose: () => void;
-  selectedFile: { name: string };
-  fileData?: any[];
-  downloadURL?: string;
-  className?: string;
-  errors?: { index: number; key: string; error: string }[];
-  handleSubmit: (data: ParsedData[]) => void;
-  showCheckbox?: boolean;
-  parsedData: ParsedData[];
-};
-
-const ExcelViewer = ({
-  title = "File Preview",
-  description,
-  show,
-  onClose,
-  className,
-  selectedFile,
-  fileData,
-  downloadURL,
-  showCheckbox = true,
-  handleSubmit,
-  parsedData,
-  errors = [],
-}: FilePreviewProps) => {
-  const [currentPage, setCurrentPage] = useState(1);
-  const [rowsPerPage, setRowsPerPage] = useState(10);
-  const [selectedRowsData, setSelectedRowsData] = useState<any[]>([]);
-
-  const initialSelectedRows = fileData
-    ? (fileData
-        .map((_, i) => i)
-        .filter((i) => !errors.some((err) => err.index === i)) ?? [])
-    : [];
-
-  const [selectedRows, setSelectedRows] =
-    useState<number[]>(initialSelectedRows);
-
-  const handleClose = () => {
-    onClose?.();
-  };
-
-  useEffect(() => {
-    setSelectedRowsData(selectedRows.map((rowIndex) => parsedData[rowIndex]));
-  }, [selectedRows]);
-
-  return (
-    <DialogModal
-      fixedWidth={false}
-      className={`z-10 h-full w-full max-w-5xl flex-col gap-4 rounded-lg bg-white p-4 shadow-xl md:p-6 ${className}`}
-      onClose={() => {
-        handleClose();
-      }}
-      title={title}
-      description={description}
-      show={show}
-    >
-      <>
-        <div className="mb-2 flex flex-col items-center justify-between md:flex-row">
-          <p className="text-md font-semibold text-secondary-700">
-            {selectedFile.name}
-          </p>
-          <div className="flex gap-4">
-            {downloadURL && downloadURL.length > 0 && (
-              <Button>
-                <a
-                  href={downloadURL}
-                  className="text-white"
-                  download={selectedFile.name}
-                >
-                  <CareIcon icon="l-file-download" className="h-4 w-4" />
-                  <span>{t("download")}</span>
-                </a>
-              </Button>
-            )}
-          </div>
-        </div>
-        <div className="flex flex-1 flex-col justify-center">
-          <div className="flex w-full justify-center overflow-scroll rounded-lg border border-secondary-200">
-            {fileData && fileData[0] ? (
-              <div className="overflow-x-auto">
-                <table className="w-full table-auto border-collapse rounded-lg border border-secondary-300 bg-white shadow-md">
-                  <thead className="sticky top-0 bg-secondary-100">
-                    <tr>
-                      {showCheckbox && (
-                        <th className="w-5 px-4 py-2">
-                          <input
-                            type="checkbox"
-                            checked={selectedRows.length === fileData.length}
-                            disabled={errors.length > 0}
-                            onChange={(e) => {
-                              if (e.target.checked) {
-                                setSelectedRows(fileData.map((_, i) => i));
-                              } else {
-                                setSelectedRows([]);
-                              }
-                            }}
-                          />
-                        </th>
-                      )}
-                      {Object.keys(fileData[0]).map((key) => (
-                        <th
-                          key={key}
-                          className="max-w-[150px] overflow-hidden text-ellipsis whitespace-nowrap border-b px-4 py-2"
-                          title={key}
-                        >
-                          {key}
-                        </th>
-                      ))}
-                    </tr>
-                  </thead>
-                  <tbody>
-                    {fileData
-                      .slice(
-                        (currentPage - 1) * rowsPerPage,
-                        (currentPage - 1) * rowsPerPage + rowsPerPage,
-                      )
-                      .map((row, rowIndex) => {
-                        const currentRowIndex =
-                          rowIndex + (currentPage - 1) * rowsPerPage;
-                        return (
-                          <tr
-                            key={currentRowIndex}
-                            className={` ${rowIndex % 2 === 0 ? "bg-secondary-50" : "bg-white"} `}
-                          >
-                            {showCheckbox && (
-                              <td className="w-5 px-4">
-                                {errors.some(
-                                  (err) => err.index === currentRowIndex,
-                                ) ? (
-                                  <span
-                                    title={`Error in column(s) ${errors
-                                      .filter(
-                                        (err) => err.index === currentRowIndex,
-                                      )
-                                      .map((err) => err.key)
-                                      .join(", ")}
-                                      `}
-                                  >
-                                    <CareIcon
-                                      icon="l-exclamation-triangle"
-                                      className="text-lg text-danger-500"
-                                    />
-                                  </span>
-                                ) : (
-                                  <input
-                                    type="checkbox"
-                                    checked={selectedRows.includes(
-                                      currentRowIndex,
-                                    )}
-                                    disabled={errors.some(
-                                      (err) => err.index === currentRowIndex,
-                                    )}
-                                    onChange={() => {
-                                      if (
-                                        selectedRows.includes(currentRowIndex)
-                                      ) {
-                                        setSelectedRows(
-                                          selectedRows.filter(
-                                            (i) => i !== currentRowIndex,
-                                          ),
-                                        );
-                                      } else {
-                                        setSelectedRows([
-                                          ...selectedRows,
-                                          currentRowIndex,
-                                        ]);
-                                      }
-                                    }}
-                                    className="disabled:bg-danger-500"
-                                  />
-                                )}
-                              </td>
-                            )}
-                            {Object.entries(row).map(
-                              ([key, value]: [string, any], colIndex) => {
-                                const error = errors.find(
-                                  (err) =>
-                                    err.index === currentRowIndex &&
-                                    err.key == key,
-                                );
-
-                                return (
-                                  <>
-                                    <td
-                                      key={colIndex}
-                                      className={`max-w-[150px] overflow-hidden text-ellipsis whitespace-nowrap border px-4 py-2 ${!!error && "text-red-500"} `}
-                                      title={
-                                        error ? error.error : String(value)
-                                      }
-                                    >
-                                      {String(value)}
-                                    </td>
-                                  </>
-                                );
-                              },
-                            )}
-                          </tr>
-                        );
-                      })}
-                  </tbody>
-                </table>
-              </div>
-            ) : (
-              <div className="text-secondary-500">No data found</div>
-            )}
-          </div>
-          {fileData && fileData.length > 5 && (
-            <div className="flex w-full flex-wrap items-center justify-between">
-              <p className="my-6 text-secondary-600 md:w-auto">
-                Showing {currentPage * rowsPerPage - rowsPerPage + 1} to{" "}
-                {currentPage * rowsPerPage > fileData.length
-                  ? fileData.length
-                  : currentPage * rowsPerPage}{" "}
-                of {fileData.length} entries
-              </p>
-              {rowsPerPage < fileData.length && (
-                <Pagination
-                  cPage={currentPage}
-                  defaultPerPage={rowsPerPage}
-                  data={{ totalCount: fileData.length }}
-                  onChange={(page, rowsPerPage) => {
-                    setCurrentPage(page);
-                    setRowsPerPage(rowsPerPage);
-                  }}
-                />
-              )}
-              <select
-                className="my-4 ml-2 h-9 w-[4.5rem] rounded-md border border-primary-400 py-0 pl-2 pr-4 text-secondary-600"
-                value={rowsPerPage}
-                onChange={(e) => {
-                  setRowsPerPage(+e.target.value);
-                }}
-              >
-                {fileData && fileData.length > 0 && (
-                  <>
-                    <option value="5">5</option>
-                    <option value="10">10</option>
-                    <option value="20">20</option>
-                    {fileData.length > 50 && <option value="50">50</option>}
-                    {fileData.length > 100 && <option value="100">100</option>}
-                  </>
-                )}
-              </select>
-            </div>
-          )}
-        </div>
-      </>
-      <div className="flex flex-wrap-reverse justify-end gap-5">
-        <Button variant="outline" type="button" onClick={onClose}>
-          {t("close")}
-        </Button>
-        <Button
-          variant="primary"
-          type="submit"
-          onClick={() => {
-            handleSubmit(selectedRowsData);
-            handleClose();
-          }}
-          disabled={selectedRows.length === 0}
-          data-testid="import-btn"
-        >
-          <CareIcon icon="l-file-import" className="text-lg" />
-          <span>Import {selectedRows.length} selected fields</span>
-        </Button>
-      </div>
-    </DialogModal>
-  );
-};
-
-export default ExcelViewer;
diff --git a/src/components/Common/Export.tsx b/src/components/Common/Export.tsx
deleted file mode 100644
index 6f9c6bdbb7d..00000000000
--- a/src/components/Common/Export.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import { useTranslation } from "react-i18next";
-
-import { cn } from "@/lib/utils";
-
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-import { Button } from "@/components/ui/button";
-
-import useExport from "@/hooks/useExport";
-
-import request from "@/Utils/request/request";
-import { ApiRoute } from "@/Utils/request/types";
-
-interface ExportButtonProps {
-  disabled?: boolean | undefined;
-  tooltip?: string | undefined;
-  tooltipClassName?: string;
-  type?: "csv" | "json";
-  action?: Parameters<ReturnType<typeof useExport>["exportFile"]>[0];
-  route?: ApiRoute<string | { results: object[] }, unknown>;
-  parse?: (data: string) => string;
-  filenamePrefix: string;
-  className?: string;
-  variant?: "primary_gradient" | "secondary";
-}
-
-export const ExportButton = ({
-  tooltipClassName = "tooltip-bottom -translate-x-7",
-  variant,
-  type = "csv",
-  className,
-  parse,
-  ...props
-}: ExportButtonProps) => {
-  const { isExporting, exportFile } = useExport();
-  const { t } = useTranslation();
-
-  return (
-    <>
-      <Button
-        variant={variant || "primary_gradient"}
-        disabled={isExporting || props.disabled}
-        onClick={() => {
-          let action = props.action;
-          if (props.route) {
-            action = async () => {
-              const { data } = await request(props.route!);
-              return data ?? null;
-            };
-          }
-          if (action) {
-            exportFile(action, props.filenamePrefix, type, parse);
-          }
-        }}
-        className={cn(
-          "tooltip gap-2 text-lg text-white disabled:bg-transparent disabled:text-secondary-500",
-          className,
-        )}
-      >
-        {isExporting ? (
-          <CareIcon icon="l-spinner-alt" className="animate-spin" />
-        ) : (
-          <CareIcon icon="l-export" />
-        )}
-        <span className={`tooltip-text ${tooltipClassName}`}>
-          {props.tooltip || t("export")}
-        </span>
-      </Button>
-    </>
-  );
-};
diff --git a/src/components/Medicine/MedicationRequestTable/utils.ts b/src/components/Medicine/MedicationRequestTable/utils.ts
deleted file mode 100644
index b32427c3a80..00000000000
--- a/src/components/Medicine/MedicationRequestTable/utils.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { MedicationRequest } from "@/types/emr/medicationRequest";
-
-export function isMedicationDiscontinued(medicationRequest: MedicationRequest) {
-  return ["completed", "ended", "stopped", "cancelled"].includes(
-    medicationRequest.status!,
-  );
-}
diff --git a/src/components/Patient/allergy/AllergyTable.tsx b/src/components/Patient/allergy/AllergyTable.tsx
deleted file mode 100644
index 8aaf982a91c..00000000000
--- a/src/components/Patient/allergy/AllergyTable.tsx
+++ /dev/null
@@ -1,108 +0,0 @@
-import {
-  BeakerIcon,
-  CookingPotIcon,
-  HeartPulseIcon,
-  LeafIcon,
-} from "lucide-react";
-
-import { Badge } from "@/components/ui/badge";
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from "@/components/ui/table";
-
-import { Avatar } from "@/components/Common/Avatar";
-
-import { AllergyIntolerance } from "@/types/emr/allergyIntolerance/allergyIntolerance";
-
-type AllergyCategory = "food" | "medication" | "environment" | "biologic";
-
-const CATEGORY_ICONS: Record<AllergyCategory, React.ReactNode> = {
-  food: <CookingPotIcon className="h-4 w-4" />,
-  medication: <BeakerIcon className="h-4 w-4" />,
-  environment: <LeafIcon className="h-4 w-4" />,
-  biologic: <HeartPulseIcon className="h-4 w-4" />,
-};
-
-interface AllergyTableProps {
-  allergies: AllergyIntolerance[];
-  showHeader?: boolean;
-}
-
-export function AllergyTable({
-  allergies,
-  showHeader = true,
-}: AllergyTableProps) {
-  return (
-    <Table>
-      {showHeader && (
-        <TableHeader>
-          <TableRow>
-            <TableHead className="w-[40px]"></TableHead>
-            <TableHead>Substance</TableHead>
-            <TableHead>Status</TableHead>
-            <TableHead>Critical</TableHead>
-            <TableHead>Verification</TableHead>
-            <TableHead>Last Occurrence</TableHead>
-            <TableHead>By</TableHead>
-          </TableRow>
-        </TableHeader>
-      )}
-      <TableBody>
-        {allergies.map((allergy, index) => (
-          <TableRow key={index}>
-            <TableCell className="w-[40px]">
-              {allergy.category &&
-                CATEGORY_ICONS[allergy.category as AllergyCategory]}
-            </TableCell>
-            <TableCell className="font-medium">
-              {allergy.code.display}
-            </TableCell>
-            <TableCell>
-              <Badge variant="outline" className="capitalize">
-                {allergy.clinical_status}
-              </Badge>
-            </TableCell>
-            <TableCell>
-              <Badge variant="secondary" className="capitalize">
-                {allergy.criticality}
-              </Badge>
-            </TableCell>
-            <TableCell>
-              <Badge variant="outline" className="capitalize">
-                {allergy.verification_status}
-              </Badge>
-            </TableCell>
-            <TableCell className="whitespace-nowrap">
-              {allergy.last_occurrence
-                ? new Date(allergy.last_occurrence).toLocaleDateString()
-                : "-"}
-            </TableCell>
-            <TableCell className="whitespace-nowrap flex items-center gap-2">
-              <Avatar
-                name={`${allergy.created_by?.first_name} ${allergy.created_by?.last_name}`}
-                className="w-4 h-4"
-                imageUrl={allergy.created_by?.profile_picture_url}
-              />
-              <span className="text-sm">
-                {allergy.created_by?.first_name} {allergy.created_by?.last_name}
-              </span>
-            </TableCell>
-            {allergy.note && (
-              <TableRow>
-                <TableCell colSpan={7} className="px-4 py-2 bg-muted/50">
-                  <div className="text-xs text-gray-500 mb-1">Notes</div>
-                  <div className="text-sm">{allergy.note}</div>
-                </TableCell>
-              </TableRow>
-            )}
-          </TableRow>
-        ))}
-      </TableBody>
-    </Table>
-  );
-}
diff --git a/src/components/ui/chart.tsx b/src/components/ui/chart.tsx
deleted file mode 100644
index 6ff21377000..00000000000
--- a/src/components/ui/chart.tsx
+++ /dev/null
@@ -1,363 +0,0 @@
-import * as React from "react";
-import * as RechartsPrimitive from "recharts";
-
-import { cn } from "@/lib/utils";
-
-// Format: { THEME_NAME: CSS_SELECTOR }
-const THEMES = { light: "", dark: ".dark" } as const;
-
-export type ChartConfig = {
-  [_ in string]: {
-    label?: React.ReactNode;
-    icon?: React.ComponentType;
-  } & (
-    | { color?: string; theme?: never }
-    | { color?: never; theme: Record<keyof typeof THEMES, string> }
-  );
-};
-
-type ChartContextProps = {
-  config: ChartConfig;
-};
-
-const ChartContext = React.createContext<ChartContextProps | null>(null);
-
-function useChart() {
-  const context = React.useContext(ChartContext);
-
-  if (!context) {
-    throw new Error("useChart must be used within a <ChartContainer />");
-  }
-
-  return context;
-}
-
-const ChartContainer = React.forwardRef<
-  HTMLDivElement,
-  React.ComponentProps<"div"> & {
-    config: ChartConfig;
-    children: React.ComponentProps<
-      typeof RechartsPrimitive.ResponsiveContainer
-    >["children"];
-  }
->(({ id, className, children, config, ...props }, ref) => {
-  const uniqueId = React.useId();
-  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
-
-  return (
-    <ChartContext.Provider value={{ config }}>
-      <div
-        data-chart={chartId}
-        ref={ref}
-        className={cn(
-          "flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-gray-500 [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none",
-          className,
-        )}
-        {...props}
-      >
-        <ChartStyle id={chartId} config={config} />
-        <RechartsPrimitive.ResponsiveContainer>
-          {children}
-        </RechartsPrimitive.ResponsiveContainer>
-      </div>
-    </ChartContext.Provider>
-  );
-});
-ChartContainer.displayName = "Chart";
-
-const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
-  const colorConfig = Object.entries(config).filter(
-    ([, config]) => config.theme || config.color,
-  );
-
-  if (!colorConfig.length) {
-    return null;
-  }
-
-  return (
-    <style
-      dangerouslySetInnerHTML={{
-        __html: Object.entries(THEMES)
-          .map(
-            ([theme, prefix]) => `
-${prefix} [data-chart=${id}] {
-${colorConfig
-  .map(([key, itemConfig]) => {
-    const color =
-      itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||
-      itemConfig.color;
-    return color ? `  --color-${key}: ${color};` : null;
-  })
-  .join("\n")}
-}
-`,
-          )
-          .join("\n"),
-      }}
-    />
-  );
-};
-
-const ChartTooltip = RechartsPrimitive.Tooltip;
-
-const ChartTooltipContent = React.forwardRef<
-  HTMLDivElement,
-  React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
-    React.ComponentProps<"div"> & {
-      hideLabel?: boolean;
-      hideIndicator?: boolean;
-      indicator?: "line" | "dot" | "dashed";
-      nameKey?: string;
-      labelKey?: string;
-    }
->(
-  (
-    {
-      active,
-      payload,
-      className,
-      indicator = "dot",
-      hideLabel = false,
-      hideIndicator = false,
-      label,
-      labelFormatter,
-      labelClassName,
-      formatter,
-      color,
-      nameKey,
-      labelKey,
-    },
-    ref,
-  ) => {
-    const { config } = useChart();
-
-    const tooltipLabel = React.useMemo(() => {
-      if (hideLabel || !payload?.length) {
-        return null;
-      }
-
-      const [item] = payload;
-      const key = `${labelKey || item.dataKey || item.name || "value"}`;
-      const itemConfig = getPayloadConfigFromPayload(config, item, key);
-      const value =
-        !labelKey && typeof label === "string"
-          ? config[label as keyof typeof config]?.label || label
-          : itemConfig?.label;
-
-      if (labelFormatter) {
-        return (
-          <div className={cn("font-medium", labelClassName)}>
-            {labelFormatter(value, payload)}
-          </div>
-        );
-      }
-
-      if (!value) {
-        return null;
-      }
-
-      return <div className={cn("font-medium", labelClassName)}>{value}</div>;
-    }, [
-      label,
-      labelFormatter,
-      payload,
-      hideLabel,
-      labelClassName,
-      config,
-      labelKey,
-    ]);
-
-    if (!active || !payload?.length) {
-      return null;
-    }
-
-    const nestLabel = payload.length === 1 && indicator !== "dot";
-
-    return (
-      <div
-        ref={ref}
-        className={cn(
-          "grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-gray-200 border-gray-200/50 bg-white px-2.5 py-1.5 text-xs shadow-xl dark:border-gray-800 dark:border-gray-800/50 dark:bg-gray-950",
-          className,
-        )}
-      >
-        {!nestLabel ? tooltipLabel : null}
-        <div className="grid gap-1.5">
-          {payload.map((item, index) => {
-            const key = `${nameKey || item.name || item.dataKey || "value"}`;
-            const itemConfig = getPayloadConfigFromPayload(config, item, key);
-            const indicatorColor = color || item.payload.fill || item.color;
-
-            return (
-              <div
-                key={item.dataKey}
-                className={cn(
-                  "flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-gray-500 dark:[&>svg]:text-gray-400",
-                  indicator === "dot" && "items-center",
-                )}
-              >
-                {formatter && item?.value !== undefined && item.name ? (
-                  formatter(item.value, item.name, item, index, item.payload)
-                ) : (
-                  <>
-                    {itemConfig?.icon ? (
-                      <itemConfig.icon />
-                    ) : (
-                      !hideIndicator && (
-                        <div
-                          className={cn(
-                            "shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]",
-                            {
-                              "h-2.5 w-2.5": indicator === "dot",
-                              "w-1": indicator === "line",
-                              "w-0 border-[1.5px] border-dashed bg-transparent":
-                                indicator === "dashed",
-                              "my-0.5": nestLabel && indicator === "dashed",
-                            },
-                          )}
-                          style={
-                            {
-                              "--color-bg": indicatorColor,
-                              "--color-border": indicatorColor,
-                            } as React.CSSProperties
-                          }
-                        />
-                      )
-                    )}
-                    <div
-                      className={cn(
-                        "flex flex-1 justify-between leading-none",
-                        nestLabel ? "items-end" : "items-center",
-                      )}
-                    >
-                      <div className="grid gap-1.5">
-                        {nestLabel ? tooltipLabel : null}
-                        <span className="text-gray-500 dark:text-gray-400">
-                          {itemConfig?.label || item.name}
-                        </span>
-                      </div>
-                      {item.value && (
-                        <span className="font-mono font-medium tabular-nums text-gray-950 dark:text-gray-50">
-                          {item.value.toLocaleString()}
-                        </span>
-                      )}
-                    </div>
-                  </>
-                )}
-              </div>
-            );
-          })}
-        </div>
-      </div>
-    );
-  },
-);
-ChartTooltipContent.displayName = "ChartTooltip";
-
-const ChartLegend = RechartsPrimitive.Legend;
-
-const ChartLegendContent = React.forwardRef<
-  HTMLDivElement,
-  React.ComponentProps<"div"> &
-    Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
-      hideIcon?: boolean;
-      nameKey?: string;
-    }
->(
-  (
-    { className, hideIcon = false, payload, verticalAlign = "bottom", nameKey },
-    ref,
-  ) => {
-    const { config } = useChart();
-
-    if (!payload?.length) {
-      return null;
-    }
-
-    return (
-      <div
-        ref={ref}
-        className={cn(
-          "flex items-center justify-center gap-4",
-          verticalAlign === "top" ? "pb-3" : "pt-3",
-          className,
-        )}
-      >
-        {payload.map((item) => {
-          const key = `${nameKey || item.dataKey || "value"}`;
-          const itemConfig = getPayloadConfigFromPayload(config, item, key);
-
-          return (
-            <div
-              key={item.value}
-              className={cn(
-                "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-gray-500 dark:[&>svg]:text-gray-400",
-              )}
-            >
-              {itemConfig?.icon && !hideIcon ? (
-                <itemConfig.icon />
-              ) : (
-                <div
-                  className="h-2 w-2 shrink-0 rounded-[2px]"
-                  style={{
-                    backgroundColor: item.color,
-                  }}
-                />
-              )}
-              {itemConfig?.label}
-            </div>
-          );
-        })}
-      </div>
-    );
-  },
-);
-ChartLegendContent.displayName = "ChartLegend";
-
-// Helper to extract item config from a payload.
-function getPayloadConfigFromPayload(
-  config: ChartConfig,
-  payload: unknown,
-  key: string,
-) {
-  if (typeof payload !== "object" || payload === null) {
-    return undefined;
-  }
-
-  const payloadPayload =
-    "payload" in payload &&
-    typeof payload.payload === "object" &&
-    payload.payload !== null
-      ? payload.payload
-      : undefined;
-
-  let configLabelKey: string = key;
-
-  if (
-    key in payload &&
-    typeof payload[key as keyof typeof payload] === "string"
-  ) {
-    configLabelKey = payload[key as keyof typeof payload] as string;
-  } else if (
-    payloadPayload &&
-    key in payloadPayload &&
-    typeof payloadPayload[key as keyof typeof payloadPayload] === "string"
-  ) {
-    configLabelKey = payloadPayload[
-      key as keyof typeof payloadPayload
-    ] as string;
-  }
-
-  return configLabelKey in config
-    ? config[configLabelKey]
-    : config[key as keyof typeof config];
-}
-
-export {
-  ChartContainer,
-  ChartTooltip,
-  ChartTooltipContent,
-  ChartLegend,
-  ChartLegendContent,
-  ChartStyle,
-};
diff --git a/src/components/ui/drawer.tsx b/src/components/ui/drawer.tsx
deleted file mode 100644
index fed2b82d662..00000000000
--- a/src/components/ui/drawer.tsx
+++ /dev/null
@@ -1,116 +0,0 @@
-import * as React from "react";
-import { Drawer as DrawerPrimitive } from "vaul";
-
-import { cn } from "@/lib/utils";
-
-const Drawer = ({
-  shouldScaleBackground = true,
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Root>) => (
-  <DrawerPrimitive.Root
-    shouldScaleBackground={shouldScaleBackground}
-    {...props}
-  />
-);
-Drawer.displayName = "Drawer";
-
-const DrawerTrigger = DrawerPrimitive.Trigger;
-
-const DrawerPortal = DrawerPrimitive.Portal;
-
-const DrawerClose = DrawerPrimitive.Close;
-
-const DrawerOverlay = React.forwardRef<
-  React.ElementRef<typeof DrawerPrimitive.Overlay>,
-  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>
->(({ className, ...props }, ref) => (
-  <DrawerPrimitive.Overlay
-    ref={ref}
-    className={cn("fixed inset-0 z-50 bg-black/80", className)}
-    {...props}
-  />
-));
-DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
-
-const DrawerContent = React.forwardRef<
-  React.ElementRef<typeof DrawerPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>
->(({ className, children, ...props }, ref) => (
-  <DrawerPortal>
-    <DrawerOverlay />
-    <DrawerPrimitive.Content
-      ref={ref}
-      className={cn(
-        "fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border border-gray-200 bg-white dark:border-gray-800 dark:bg-gray-950",
-        className,
-      )}
-      {...props}
-    >
-      <div className="mx-auto mt-4 h-2 w-[100px] rounded-full bg-gray-100 dark:bg-gray-800" />
-      {children}
-    </DrawerPrimitive.Content>
-  </DrawerPortal>
-));
-DrawerContent.displayName = "DrawerContent";
-
-const DrawerHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn("grid gap-1.5 p-4 text-center sm:text-left", className)}
-    {...props}
-  />
-);
-DrawerHeader.displayName = "DrawerHeader";
-
-const DrawerFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn("mt-auto flex flex-col gap-2 p-4", className)}
-    {...props}
-  />
-);
-DrawerFooter.displayName = "DrawerFooter";
-
-const DrawerTitle = React.forwardRef<
-  React.ElementRef<typeof DrawerPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <DrawerPrimitive.Title
-    ref={ref}
-    className={cn(
-      "text-lg font-semibold leading-none tracking-tight",
-      className,
-    )}
-    {...props}
-  />
-));
-DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
-
-const DrawerDescription = React.forwardRef<
-  React.ElementRef<typeof DrawerPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <DrawerPrimitive.Description
-    ref={ref}
-    className={cn("text-sm text-gray-500 dark:text-gray-400", className)}
-    {...props}
-  />
-));
-DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
-
-export {
-  Drawer,
-  DrawerPortal,
-  DrawerOverlay,
-  DrawerTrigger,
-  DrawerClose,
-  DrawerContent,
-  DrawerHeader,
-  DrawerFooter,
-  DrawerTitle,
-  DrawerDescription,
-};
diff --git a/src/hooks/useActiveLink.ts b/src/hooks/useActiveLink.ts
deleted file mode 100644
index 63265ea8b72..00000000000
--- a/src/hooks/useActiveLink.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import { usePath } from "raviger";
-
-import { keysOf } from "@/Utils/utils";
-
-/**
- * Keys can be any value that is present in the url.
- * Value must be equivalent to the link of the sidebar item.
- * Entries must be sorted based on priority.
- * Whichever key is present in the url first, becomes the active link returned
- * by `useActiveLink` hook.
- */
-const activeLinkPriority = {
-  "/patient/home": "/patient/home",
-  "/patients": "/patients",
-  "/patient/": "/patients",
-  "/death_report": "/patients",
-  "/assets": "/assets",
-  "/shifting": "/shifting",
-  "/resource": "/resource",
-  "/users": "/users",
-  "/notice_board": "/notice_board",
-  "/appointments": "/appointments",
-  "/facility": "/facility",
-};
-
-/**
- * @returns The active link of the current path.
- */
-export default function useActiveLink() {
-  const path = usePath() || "";
-  const key = keysOf(activeLinkPriority).find((key) => path.includes(key));
-  return key && activeLinkPriority[key];
-}
diff --git a/src/hooks/useConfirmedAction.ts b/src/hooks/useConfirmedAction.ts
deleted file mode 100644
index ca88a5014ed..00000000000
--- a/src/hooks/useConfirmedAction.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { useState } from "react";
-
-export default function useConfirmedAction(action: () => Promise<void>) {
-  const [showConfirmation, setShowConfirmation] = useState(false);
-
-  return {
-    requestConfirmation: () => setShowConfirmation(true),
-    submit: action,
-
-    confirmationProps: {
-      onClose: () => setShowConfirmation(false),
-      show: showConfirmation,
-      onConfirm: action,
-      action: "Submit",
-    },
-  };
-}
diff --git a/src/hooks/useExport.tsx b/src/hooks/useExport.tsx
deleted file mode 100644
index 729b4d907c8..00000000000
--- a/src/hooks/useExport.tsx
+++ /dev/null
@@ -1,90 +0,0 @@
-import { useState } from "react";
-
-import dayjs from "@/Utils/dayjs";
-
-export default function useExport() {
-  const [isExporting, setIsExporting] = useState(false);
-
-  const getTimestamp = () => {
-    const now = dayjs();
-    const date = now.format("YYYY-MM-DD");
-    const time = now.format("HH:mm:ss");
-
-    return date + "_" + time;
-  };
-
-  const exportCSV = async (
-    filenamePrefix: string,
-    getData: () => Promise<string | null>,
-    parse = (data: string) => data,
-  ) => {
-    setIsExporting(true);
-
-    const filename = `${filenamePrefix}_${getTimestamp()}.csv`;
-
-    const data = await getData();
-    if (data) {
-      const a = document.createElement("a");
-      const blob = new Blob([parse(data)], {
-        type: "text/csv",
-      });
-      a.href = URL.createObjectURL(blob);
-      a.download = filename;
-      a.click();
-    }
-
-    setIsExporting(false);
-  };
-
-  const exportJSON = async (
-    filenamePrefix: string,
-    getData: () => Promise<{ results: object[] } | null>,
-    parse = (data: string) => data,
-  ) => {
-    setIsExporting(true);
-
-    const data = await getData();
-    if (data?.results.length) {
-      const a = document.createElement("a");
-      const blob = new Blob([parse(JSON.stringify(data.results))], {
-        type: "application/json",
-      });
-      a.href = URL.createObjectURL(blob);
-      a.download = `${filenamePrefix}-${getTimestamp()}.json`;
-      a.click();
-    }
-
-    setIsExporting(false);
-  };
-
-  const exportFile = (
-    action: () => Promise<{ results: object[] } | string | null>,
-    filePrefix = "export",
-    type = "csv",
-    parse = (data: string) => data,
-  ) => {
-    if (!action) return;
-
-    switch (type) {
-      case "csv":
-        exportCSV(filePrefix, action as Parameters<typeof exportCSV>[1], parse);
-        break;
-      case "json":
-        exportJSON(
-          filePrefix,
-          action as Parameters<typeof exportJSON>[1],
-          parse,
-        );
-        break;
-      default:
-        exportCSV(filePrefix, action as Parameters<typeof exportCSV>[1], parse);
-    }
-  };
-
-  return {
-    isExporting,
-    exportCSV,
-    exportJSON,
-    exportFile,
-  };
-}
diff --git a/src/hooks/useMergeState.js b/src/hooks/useMergeState.js
deleted file mode 100644
index 39dbcff993d..00000000000
--- a/src/hooks/useMergeState.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { useState } from "react";
-
-export default function useMergeState(initialState) {
-  const [state, setState] = useState(initialState);
-
-  const setMergedState = (newState) =>
-    setState((prevState) => Object.assign({}, prevState, newState));
-
-  return [state, setMergedState];
-}
diff --git a/src/hooks/useOrganization.ts b/src/hooks/useOrganization.ts
deleted file mode 100644
index d33678f356b..00000000000
--- a/src/hooks/useOrganization.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-import { t } from "i18next";
-import { useEffect } from "react";
-import { toast } from "sonner";
-
-import query from "@/Utils/request/query";
-import organizationApi from "@/types/organization/organizationApi";
-
-interface UseOrganizationParams {
-  orgType?: string;
-  parentId?: string;
-  name?: string;
-  enabled?: boolean;
-}
-
-export function useOrganization({
-  orgType = "",
-  parentId = "",
-  name = "",
-  enabled = true,
-}: UseOrganizationParams) {
-  const { data, isLoading, isError } = useQuery({
-    queryKey: ["organization", orgType, name, parentId],
-    queryFn: query(organizationApi.list, {
-      queryParams: {
-        org_type: orgType,
-        parent: parentId,
-        name,
-      },
-    }),
-    enabled: enabled && !!name,
-  });
-
-  useEffect(() => {
-    if (isError) {
-      toast.error(t("organizations_fetch_error"));
-    }
-  }, [isError]);
-
-  return {
-    organizations: data?.results || [],
-    isLoading,
-    isError,
-  };
-}
diff --git a/src/pages/Facility/settings/notifications.tsx b/src/pages/Facility/settings/notifications.tsx
deleted file mode 100644
index cf1c0f7c8f6..00000000000
--- a/src/pages/Facility/settings/notifications.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import { useTranslation } from "react-i18next";
-
-interface NotificationsSettingsProps {
-  facilityId: string;
-}
-
-export function NotificationsSettings({
-  facilityId,
-}: NotificationsSettingsProps) {
-  const { t } = useTranslation();
-
-  return (
-    <div>
-      <h2 className="text-2xl font-bold">
-        {t("facility.settings.notifications")}
-        <div className="mt-4">{facilityId}</div>
-      </h2>
-      {/* Add notifications settings form here */}
-    </div>
-  );
-}
diff --git a/src/pages/Facility/settings/users.tsx b/src/pages/Facility/settings/users.tsx
deleted file mode 100644
index 01218321ee3..00000000000
--- a/src/pages/Facility/settings/users.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { useTranslation } from "react-i18next";
-
-interface UsersSettingsProps {
-  facilityId: string;
-}
-
-export function UsersSettings({ facilityId }: UsersSettingsProps) {
-  const { t } = useTranslation();
-
-  return (
-    <div>
-      <h2 className="text-2xl font-bold">{t("facility.settings.users")}</h2>
-      <div className="mt-4">{facilityId}</div>
-      {/* Add users settings form here */}
-    </div>
-  );
-}
diff --git a/src/types/emr/medicationAdministration.ts b/src/types/emr/medicationAdministration.ts
deleted file mode 100644
index 6bcbb67831f..00000000000
--- a/src/types/emr/medicationAdministration.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import { UserBareMinimum } from "@/components/Users/models";
-
-import { Code } from "@/types/questionnaire/code";
-import { Quantity } from "@/types/questionnaire/quantity";
-
-export const MEDICATION_ADMINISTRATION_STATUS = [
-  "completed",
-  "not_done",
-  "entered_in_error",
-  "stopped",
-  "in_progress",
-  "on_hold",
-  "unknown",
-  "cancelled",
-] as const;
-
-export type MedicationAdministrationStatus =
-  (typeof MEDICATION_ADMINISTRATION_STATUS)[number];
-
-export interface MedicationAdministration {
-  readonly id?: string;
-  status: MedicationAdministrationStatus;
-  status_reason?: Code;
-  category?: "inpatient" | "outpatient" | "community";
-
-  medication: Code;
-
-  authored_on?: string; // datetime
-  occurrence_period_start: string; // datetime
-  occurrence_period_end?: string; // datetime
-  recorded?: string; // datetime
-
-  encounter: string; // uuid
-  request: string; // uuid
-
-  performer?: {
-    actor: string; // uuid
-    function: "performer" | "verifier" | "witness";
-  }[];
-  dosage?: {
-    text?: string;
-    site?: Code;
-    route?: Code;
-    method?: Code;
-    dose?: Quantity;
-    rate?: Quantity;
-  };
-
-  note?: string;
-
-  created_by?: UserBareMinimum;
-  updated_by?: UserBareMinimum;
-}
diff --git a/src/types/location/locationEncounter.ts b/src/types/location/locationEncounter.ts
deleted file mode 100644
index 1ff4e498dd9..00000000000
--- a/src/types/location/locationEncounter.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export type Status = "planned" | "active" | "reserved" | "completed";
-
-export interface LocationEncounterCreate {
-  status: Status;
-  encounter: string;
-  start_datetime: string;
-  end_datetime?: string;
-}
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index abdd4971512..defba258b80 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -21,7 +21,6 @@ interface ImportMetaEnv {
   readonly REACT_GMAPS_API_KEY?: string;
   readonly REACT_GOV_DATA_API_KEY?: string;
   readonly REACT_RECAPTCHA_SITE_KEY?: string;
-  readonly REACT_SAMPLE_FORMAT_ASSET_IMPORT?: string;
   readonly REACT_WARTIME_SHIFTING?: string;
   readonly REACT_STILL_WATCHING_IDLE_TIMEOUT?: string;
   readonly REACT_STILL_WATCHING_PROMPT_DURATION?: string;

From f5be899a9af1f603546f61e291c0323c7bc8e123 Mon Sep 17 00:00:00 2001
From: Niaal-B <122875113+Niaal-B@users.noreply.github.com>
Date: Tue, 4 Feb 2025 10:35:43 +0530
Subject: [PATCH 05/19]  Fix iPad View UI responsiveness issue on the overview
 page (#10378)

Co-authored-by: rithviknishad <mail@rithviknishad.dev>
---
 src/pages/Facility/overview.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/pages/Facility/overview.tsx b/src/pages/Facility/overview.tsx
index 4794ec6d6ca..346a34c6c48 100644
--- a/src/pages/Facility/overview.tsx
+++ b/src/pages/Facility/overview.tsx
@@ -56,15 +56,15 @@ export function FacilityOverview({ facilityId }: FacilityOverviewProps) {
           <h2 className="text-xl font-semibold mb-6 text-gray-900">
             {t("quick_actions")}
           </h2>
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+          <div className="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-4">
             {shortcuts.map((shortcut) => (
               <Link
                 key={shortcut.href}
                 href={shortcut.href}
-                className="block transition-all duration-200 hover:scale-102 hover:shadow-md"
+                className="block h-full transition-all duration-200 hover:scale-102 hover:shadow-md"
               >
-                <Card className="border-0 shadow-sm hover:bg-gray-50">
-                  <CardHeader className="flex flex-row items-center gap-4">
+                <Card className="border-0 shadow-sm hover:bg-gray-50 h-full">
+                  <CardHeader className="h-full flex flex-row items-center gap-4">
                     <div className="p-2 bg-primary/10 rounded-lg">
                       <shortcut.icon className="h-6 w-6 text-primary" />
                     </div>

From f2db2ba9c98b20cc8b58a5b75061ef1ebc28de53 Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Tue, 4 Feb 2025 07:39:21 +0000
Subject: [PATCH 06/19] Remove hardcoded date placeholder in ThreadItem
 component (#10383)

---
 .../Encounters/tabs/EncounterNotesTab.tsx     | 30 +++++++++++--------
 src/types/notes/messages.ts                   |  4 ++-
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/src/pages/Encounters/tabs/EncounterNotesTab.tsx b/src/pages/Encounters/tabs/EncounterNotesTab.tsx
index 9a898de5ba6..89b535134df 100644
--- a/src/pages/Encounters/tabs/EncounterNotesTab.tsx
+++ b/src/pages/Encounters/tabs/EncounterNotesTab.tsx
@@ -4,6 +4,7 @@ import {
   useQuery,
   useQueryClient,
 } from "@tanstack/react-query";
+import { formatRelative } from "date-fns";
 import {
   Info,
   Loader2,
@@ -52,6 +53,7 @@ import routes from "@/Utils/request/api";
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import { PaginatedResponse } from "@/Utils/request/types";
+import { formatDateTime } from "@/Utils/utils";
 import { EncounterTabProps } from "@/pages/Encounters/EncounterShow";
 import { Message } from "@/types/notes/messages";
 import { Thread } from "@/types/notes/threads";
@@ -105,8 +107,6 @@ const ThreadItem = ({
     <div className="flex items-start justify-between gap-3">
       <div className="flex-1 min-w-0">
         <h4 className="font-medium text-sm truncate">{thread.title}</h4>
-        {/* Todo: Replace with thread.created */}
-        <p className="text-xs text-gray-500 mt-1">12/12/2024</p>
       </div>
       {isSelected && (
         <div className="w-1.5 h-1.5 rounded-full bg-primary animate-pulse mt-1.5" />
@@ -156,21 +156,28 @@ const MessageItem = ({ message }: { message: Message }) => {
             isCurrentUser ? "items-end" : "items-start",
           )}
         >
-          <span className="text-xs text-gray-500 mb-1">
-            {message.created_by.username}
-          </span>
+          <p className="text-xs space-x-2 mb-1">
+            <span className="text-gray-700 font-medium">
+              {message.created_by.username}
+            </span>
+            <time
+              className="text-gray-500"
+              dateTime={message.created_date}
+              title={formatDateTime(message.created_date)}
+            >
+              {formatRelative(message.created_date, new Date())}
+            </time>
+          </p>
           <div
             className={cn(
               "p-3 rounded-lg break-words",
               isCurrentUser
-                ? "bg-primary-100 text-white rounded-br-none"
-                : "bg-gray-100 rounded-bl-none",
+                ? "bg-white text-black rounded-tr-none border border-gray-200"
+                : "bg-gray-100 rounded-tl-none border border-gray-200",
             )}
           >
             {message.message && (
-              <div className="mt-4">
-                <Markdown content={message.message} className="text-sm" />
-              </div>
+              <Markdown content={message.message} className="text-sm" />
             )}
           </div>
         </div>
@@ -379,9 +386,6 @@ export const EncounterNotesTab = ({ encounter }: EncounterTabProps) => {
         messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
       }, 100);
     },
-    onError: () => {
-      toast.error(t("Failed to send message"));
-    },
   });
 
   // Handle infinite scroll
diff --git a/src/types/notes/messages.ts b/src/types/notes/messages.ts
index bca88676392..1178a6c0c4f 100644
--- a/src/types/notes/messages.ts
+++ b/src/types/notes/messages.ts
@@ -2,8 +2,10 @@ import { UserBase } from "@/types/user/user";
 
 export interface Message {
   id: string;
-  message: string;
+  message: string; // Markdown
   message_history: Record<string, unknown>;
   created_by: UserBase;
   updated_by: UserBase;
+  created_date: string;
+  modified_date: string;
 }

From 894171507b35136fe60b949f4dc3aa63f5698d7c Mon Sep 17 00:00:00 2001
From: Raj kumar <150310085+rajku-dev@users.noreply.github.com>
Date: Tue, 4 Feb 2025 17:16:41 +0530
Subject: [PATCH 07/19] Migration to useQuery: Removed `PaginatedList.tsx` and
 Update Dependent Components (#10350)

---
 src/CAREUI/misc/PaginatedList.tsx             | 211 ------------------
 .../QuestionnaireResponsesList.tsx            |  91 +++++---
 src/components/Facility/models.tsx            |   3 +-
 .../PatientDetailsTab/EncounterHistory.tsx    | 117 ++++++----
 .../PatientDetailsTab/patientUpdates.tsx      | 161 +++++++------
 .../Resource/ResourceCommentSection.tsx       | 143 +++++++-----
 6 files changed, 326 insertions(+), 400 deletions(-)
 delete mode 100644 src/CAREUI/misc/PaginatedList.tsx

diff --git a/src/CAREUI/misc/PaginatedList.tsx b/src/CAREUI/misc/PaginatedList.tsx
deleted file mode 100644
index 01b9b0538b5..00000000000
--- a/src/CAREUI/misc/PaginatedList.tsx
+++ /dev/null
@@ -1,211 +0,0 @@
-import { createContext, useContext, useEffect, useState } from "react";
-
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-import { Button, ButtonProps } from "@/components/ui/button";
-
-import Pagination from "@/components/Common/Pagination";
-
-import { ApiRoute, PaginatedResponse } from "@/Utils/request/types";
-import useTanStackQueryInstead, {
-  QueryOptions,
-} from "@/Utils/request/useQuery";
-import { classNames } from "@/Utils/utils";
-
-const DEFAULT_PER_PAGE_LIMIT = 14;
-
-interface PaginatedListContext<TItem>
-  extends ReturnType<typeof useTanStackQueryInstead<PaginatedResponse<TItem>>> {
-  items: TItem[];
-  perPage: number;
-  currentPage: number;
-  setPage: (page: number) => void;
-}
-
-const context = createContext<PaginatedListContext<object> | null>(null);
-
-function useContextualized<TItem>() {
-  const ctx = useContext(context);
-
-  if (ctx === null) {
-    throw new Error("Component must be used within a PaginatedList");
-  }
-
-  return ctx as PaginatedListContext<TItem>;
-}
-
-interface Props<TItem> extends QueryOptions<PaginatedResponse<TItem>> {
-  route: ApiRoute<PaginatedResponse<TItem>>;
-  perPage?: number;
-  initialPage?: number;
-  onPageChange?: (page: number) => void;
-  queryCB?: (
-    query: ReturnType<typeof useTanStackQueryInstead<PaginatedResponse<TItem>>>,
-  ) => void;
-  children: (
-    ctx: PaginatedListContext<TItem>,
-    query: ReturnType<typeof useTanStackQueryInstead<PaginatedResponse<TItem>>>,
-  ) => JSX.Element | JSX.Element[];
-}
-
-export default function PaginatedList<TItem extends object>({
-  children,
-  route,
-  perPage = DEFAULT_PER_PAGE_LIMIT,
-  queryCB,
-  ...queryOptions
-}: Props<TItem>) {
-  const [currentPage, _setPage] = useState(queryOptions.initialPage ?? 1);
-
-  const setPage = (page: number) => {
-    _setPage(page);
-    queryOptions.onPageChange?.(page);
-  };
-
-  const query = useTanStackQueryInstead(route, {
-    ...queryOptions,
-    query: {
-      ...queryOptions.query,
-      limit: perPage,
-      offset: (currentPage - 1) * perPage,
-    },
-  });
-
-  const items = query.data?.results ?? [];
-
-  useEffect(() => {
-    if (queryCB) {
-      queryCB(query);
-    }
-  }, [query]);
-
-  return (
-    <context.Provider
-      value={{ ...query, items, perPage, currentPage, setPage }}
-    >
-      <context.Consumer>
-        {(ctx) => children(ctx as PaginatedListContext<TItem>, query)}
-      </context.Consumer>
-    </context.Provider>
-  );
-}
-
-interface WhenEmptyProps {
-  className?: string;
-  children: JSX.Element | JSX.Element[];
-}
-
-const WhenEmpty = <TItem extends object>(props: WhenEmptyProps) => {
-  const { items, loading } = useContextualized<TItem>();
-
-  if (loading || items.length > 0) {
-    return null;
-  }
-
-  return <div className={props.className}>{props.children}</div>;
-};
-
-PaginatedList.WhenEmpty = WhenEmpty;
-
-const WhenLoading = <TItem extends object>(props: WhenEmptyProps) => {
-  const { loading } = useContextualized<TItem>();
-
-  if (!loading) {
-    return null;
-  }
-
-  return <div className={props.className}>{props.children}</div>;
-};
-
-PaginatedList.WhenLoading = WhenLoading;
-
-interface CommonButtonProps extends ButtonProps {
-  label?: string;
-}
-
-const Refresh = ({ label = "Refresh", ...props }: CommonButtonProps) => {
-  const { loading, refetch } = useContextualized<object>();
-
-  return (
-    <Button
-      variant="secondary"
-      {...props}
-      onClick={() => refetch()}
-      disabled={loading}
-    >
-      <CareIcon
-        icon="l-sync"
-        className={classNames("text-lg", loading && "animate-spin")}
-      />
-      <span>{label}</span>
-    </Button>
-  );
-};
-
-PaginatedList.Refresh = Refresh;
-
-interface ItemsProps<TItem> {
-  className?: string;
-  children: (item: TItem, items: TItem[]) => JSX.Element | JSX.Element[];
-  shimmer?: JSX.Element;
-  shimmerCount?: number;
-}
-
-const Items = <TItem extends object>(props: ItemsProps<TItem>) => {
-  const { loading, items } = useContextualized<TItem>();
-
-  if (loading || items.length === 0) {
-    return null;
-  }
-
-  return (
-    <ul className={props.className}>
-      {loading && props.shimmer
-        ? Array.from({ length: props.shimmerCount ?? 8 }).map((_, i) => (
-            <li key={i} className="w-full">
-              {props.shimmer}
-            </li>
-          ))
-        : items.map((item, index, items) => (
-            <li key={index} className="w-full">
-              {props.children(item, items)}
-            </li>
-          ))}
-    </ul>
-  );
-};
-
-PaginatedList.Items = Items;
-
-interface PaginatorProps {
-  className?: string;
-  hideIfSinglePage?: boolean;
-}
-
-const Paginator = <TItem extends object>({
-  className,
-  hideIfSinglePage,
-}: PaginatorProps) => {
-  const { data, perPage, currentPage, setPage } = useContextualized<object>();
-  const { loading } = useContextualized<TItem>();
-
-  if (loading) {
-    return null;
-  }
-
-  if (hideIfSinglePage && (data?.count ?? 0) <= perPage) {
-    return null;
-  }
-
-  return (
-    <Pagination
-      className={className}
-      cPage={currentPage}
-      data={{ totalCount: data?.count ?? 0 }}
-      defaultPerPage={perPage}
-      onChange={setPage}
-    />
-  );
-};
-
-PaginatedList.Paginator = Paginator;
diff --git a/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx b/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
index 510fe1ea284..a9cb31b9307 100644
--- a/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
+++ b/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
@@ -1,15 +1,21 @@
+import { useQuery } from "@tanstack/react-query";
 import { t } from "i18next";
+import { useQueryParams } from "raviger";
 import { useTranslation } from "react-i18next";
 
-import PaginatedList from "@/CAREUI/misc/PaginatedList";
+import { cn } from "@/lib/utils";
 
 import { Badge } from "@/components/ui/badge";
 import { Card } from "@/components/ui/card";
 import { Separator } from "@/components/ui/separator";
 
+import PaginationComponent from "@/components/Common/Pagination";
 import { CardListSkeleton } from "@/components/Common/SkeletonLoading";
 
+import { RESULTS_PER_PAGE_LIMIT } from "@/common/constants";
+
 import routes from "@/Utils/request/api";
+import query from "@/Utils/request/query";
 import { formatDateTime, properCase } from "@/Utils/utils";
 import { AllergyIntoleranceRequest } from "@/types/emr/allergyIntolerance/allergyIntolerance";
 import { DiagnosisRequest } from "@/types/emr/diagnosis/diagnosis";
@@ -278,44 +284,67 @@ export default function QuestionnaireResponsesList({
   patientId,
 }: Props) {
   const { t } = useTranslation();
+  const [qParams, setQueryParams] = useQueryParams<{ page?: number }>();
+
+  const { data: questionnarieResponses, isLoading } = useQuery({
+    queryKey: ["questionnaireResponses", patientId, qParams],
+    queryFn: query(routes.getQuestionnaireResponses, {
+      pathParams: { patientId },
+      queryParams: {
+        encounter: encounter?.id,
+        limit: RESULTS_PER_PAGE_LIMIT,
+        offset: ((qParams.page ?? 1) - 1) * RESULTS_PER_PAGE_LIMIT,
+      },
+    }),
+  });
 
   return (
-    <PaginatedList
-      route={routes.getQuestionnaireResponses}
-      pathParams={{
-        patientId: patientId,
-      }}
-      query={{
-        ...(encounter && { encounter: encounter.id }),
-      }}
-    >
-      {() => (
-        <div className="mt-4 flex w-full flex-col gap-4">
+    <div className="mt-4 gap-4">
+      <div className="max-w-full">
+        {isLoading ? (
+          <div className="grid gap-5">
+            <CardListSkeleton count={RESULTS_PER_PAGE_LIMIT} />
+          </div>
+        ) : (
           <div>
-            <PaginatedList.WhenEmpty>
+            {questionnarieResponses?.results?.length === 0 ? (
               <Card className="p-6">
                 <div className="text-lg font-medium text-gray-500">
                   {t("no_questionnaire_responses")}
                 </div>
               </Card>
-            </PaginatedList.WhenEmpty>
-
-            <PaginatedList.WhenLoading>
-              <div className="grid gap-5">
-                <CardListSkeleton count={3} />
-              </div>
-            </PaginatedList.WhenLoading>
-
-            <PaginatedList.Items<QuestionnaireResponse> className="grid gap-4">
-              {(item) => <ResponseCard key={item.id} item={item} />}
-            </PaginatedList.Items>
-
-            <div className="flex w-full items-center justify-center mt-4">
-              <PaginatedList.Paginator hideIfSinglePage />
-            </div>
+            ) : (
+              <ul className="grid gap-4">
+                {questionnarieResponses?.results?.map(
+                  (item: QuestionnaireResponse) => (
+                    <li key={item.id} className="w-full">
+                      <ResponseCard key={item.id} item={item} />
+                    </li>
+                  ),
+                )}
+                <div className="flex w-full items-center justify-center mt-4">
+                  <div
+                    className={cn(
+                      "flex w-full justify-center",
+                      (questionnarieResponses?.count ?? 0) >
+                        RESULTS_PER_PAGE_LIMIT
+                        ? "visible"
+                        : "invisible",
+                    )}
+                  >
+                    <PaginationComponent
+                      cPage={qParams.page ?? 1}
+                      defaultPerPage={RESULTS_PER_PAGE_LIMIT}
+                      data={{ totalCount: questionnarieResponses?.count ?? 0 }}
+                      onChange={(page) => setQueryParams({ page })}
+                    />
+                  </div>
+                </div>
+              </ul>
+            )}
           </div>
-        </div>
-      )}
-    </PaginatedList>
+        )}
+      </div>
+    </div>
   );
 }
diff --git a/src/components/Facility/models.tsx b/src/components/Facility/models.tsx
index 478f7b170b7..b1d9f6dfdda 100644
--- a/src/components/Facility/models.tsx
+++ b/src/components/Facility/models.tsx
@@ -38,9 +38,8 @@ export type FacilityRequest = Omit<FacilityModel, "location" | "id">;
 
 export interface CommentModel {
   id: string;
-  created_by_object: UserBareMinimum;
   created_date: string;
   modified_date: string;
   comment: string;
-  created_by: number;
+  created_by: UserBareMinimum;
 }
diff --git a/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx b/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
index 218fceccb62..fc5bc9c94fe 100644
--- a/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
+++ b/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
@@ -1,62 +1,101 @@
-import { Link } from "raviger";
+import { useQuery } from "@tanstack/react-query";
+import { Link, useQueryParams } from "raviger";
 import { useTranslation } from "react-i18next";
 
+import { cn } from "@/lib/utils";
+
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import PaginatedList from "@/CAREUI/misc/PaginatedList";
 
 import { Button } from "@/components/ui/button";
 
-import CircularProgress from "@/components/Common/CircularProgress";
+import PaginationComponent from "@/components/Common/Pagination";
+import { CardListSkeleton } from "@/components/Common/SkeletonLoading";
 import { EncounterCard } from "@/components/Facility/EncounterCard";
 import { PatientProps } from "@/components/Patient/PatientDetailsTab";
 
 import routes from "@/Utils/request/api";
-import { Encounter } from "@/types/emr/encounter";
+import query from "@/Utils/request/query";
 
 const EncounterHistory = (props: PatientProps) => {
   const { patientId, facilityId } = props;
 
   const { t } = useTranslation();
 
+  const [qParams, setQueryParams] = useQueryParams<{ page?: number }>();
+
+  const { data: encounterData, isLoading } = useQuery({
+    queryKey: ["encounterHistory", patientId, qParams],
+    queryFn: query(routes.encounter.list, {
+      queryParams: {
+        patient: patientId,
+        limit: 5,
+        offset: ((qParams.page ?? 1) - 1) * 5,
+      },
+    }),
+  });
+
   return (
-    <PaginatedList
-      route={routes.encounter.list}
-      query={{ patient: patientId }}
-      perPage={5}
-    >
-      {() => (
-        <div className="mt-8">
-          <PaginatedList.WhenLoading>
-            <CircularProgress />
-          </PaginatedList.WhenLoading>
-          <PaginatedList.WhenEmpty className="py-2">
-            <div className="h-full space-y-2 rounded-lg bg-white px-7 py-12 border border-secondary-300">
-              <div className="flex w-full items-center justify-center text-lg text-secondary-600">
-                {t("no_consultation_history")}
+    <div className="mt-8">
+      <div>
+        {isLoading ? (
+          <div>
+            <div className="grid gap-5">
+              <CardListSkeleton count={5} />
+            </div>
+          </div>
+        ) : (
+          <div>
+            {encounterData?.results?.length === 0 ? (
+              <div className="p-2">
+                <div className="h-full space-y-2 rounded-lg bg-white px-7 py-12 border border-secondary-300">
+                  <div className="flex w-full items-center justify-center text-lg text-secondary-600">
+                    {t("no_consultation_history")}
+                  </div>
+                  <div className="flex w-full items-center justify-center pt-4">
+                    <Button variant="outline_primary" asChild>
+                      <Link
+                        href={`/facility/${facilityId}/patient/${patientId}/consultation`}
+                      >
+                        <span className="flex w-full items-center justify-start gap-2">
+                          <CareIcon
+                            icon="l-chat-bubble-user"
+                            className="text-xl"
+                          />
+                          {t("add_consultation")}
+                        </span>
+                      </Link>
+                    </Button>
+                  </div>
+                </div>
               </div>
-              <div className="flex w-full items-center justify-center pt-4">
-                <Button variant="outline_primary" asChild>
-                  <Link
-                    href={`/facility/${facilityId}/patient/${patientId}/consultation`}
+            ) : (
+              <ul className="grid gap-4">
+                {encounterData?.results?.map((encounter) => (
+                  <li key={encounter.id} className="w-full">
+                    <EncounterCard key={encounter.id} encounter={encounter} />
+                  </li>
+                ))}
+                <div className="flex w-full items-center justify-center">
+                  <div
+                    className={cn(
+                      "flex w-full justify-center",
+                      (encounterData?.count ?? 0) > 5 ? "visible" : "invisible",
+                    )}
                   >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-chat-bubble-user" className="text-xl" />
-                      {t("add_consultation")}
-                    </span>
-                  </Link>
-                </Button>
-              </div>
-            </div>
-          </PaginatedList.WhenEmpty>
-          <PaginatedList.Items<Encounter>>
-            {(encounter) => <EncounterCard encounter={encounter} />}
-          </PaginatedList.Items>
-          <div className="flex w-full items-center justify-center">
-            <PaginatedList.Paginator hideIfSinglePage />
+                    <PaginationComponent
+                      cPage={qParams.page ?? 1}
+                      defaultPerPage={5}
+                      data={{ totalCount: encounterData?.count ?? 0 }}
+                      onChange={(page) => setQueryParams({ page })}
+                    />
+                  </div>
+                </div>
+              </ul>
+            )}
           </div>
-        </div>
-      )}
-    </PaginatedList>
+        )}
+      </div>
+    </div>
   );
 };
 
diff --git a/src/components/Patient/PatientDetailsTab/patientUpdates.tsx b/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
index f82f1489fb5..0bb71b54776 100644
--- a/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
+++ b/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
@@ -1,15 +1,21 @@
-import { Link, navigate } from "raviger";
+import { useQuery } from "@tanstack/react-query";
+import { Link, navigate, useQueryParams } from "raviger";
 import { useTranslation } from "react-i18next";
 
+import { cn } from "@/lib/utils";
+
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import PaginatedList from "@/CAREUI/misc/PaginatedList";
 
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
 
+import PaginationComponent from "@/components/Common/Pagination";
 import { CardListSkeleton } from "@/components/Common/SkeletonLoading";
 
+import { RESULTS_PER_PAGE_LIMIT } from "@/common/constants";
+
 import routes from "@/Utils/request/api";
+import query from "@/Utils/request/query";
 import { formatDateTime, properCase } from "@/Utils/utils";
 import { QuestionnaireResponse } from "@/types/questionnaire/questionnaireResponse";
 
@@ -19,6 +25,19 @@ export const Updates = (props: PatientProps) => {
   const { facilityId, patientId } = props;
   const { t } = useTranslation();
 
+  const [qParams, setQueryParams] = useQueryParams<{ page?: number }>();
+
+  const { data: patientUpdatesData, isLoading } = useQuery({
+    queryKey: ["patientUpdates", patientId, qParams],
+    queryFn: query(routes.getQuestionnaireResponses, {
+      queryParams: {
+        limit: RESULTS_PER_PAGE_LIMIT,
+        offset: ((qParams.page ?? 1) - 1) * RESULTS_PER_PAGE_LIMIT,
+      },
+      pathParams: { patientId },
+    }),
+  });
+
   return (
     <div className="mt-4 px-3 md:px-0">
       <div className="flex justify-between items-center mb-4">
@@ -32,78 +51,88 @@ export const Updates = (props: PatientProps) => {
           </Link>
         </Button>
       </div>
-
-      <PaginatedList
-        route={routes.getQuestionnaireResponses}
-        pathParams={{ patientId }}
-      >
-        {() => (
-          <div className="flex w-full flex-col gap-4">
-            <div className="flex max-h-[85vh] flex-col gap-4 overflow-y-auto overflow-x-hidden">
-              <PaginatedList.WhenEmpty>
+      <div className="flex w-full flex-col gap-4">
+        <div className="flex flex-col gap-4">
+          {isLoading ? (
+            <div className="grid gap-4">
+              <CardListSkeleton count={RESULTS_PER_PAGE_LIMIT} />
+            </div>
+          ) : (
+            <div>
+              {patientUpdatesData?.results?.length === 0 ? (
                 <Card className="p-6">
                   <div className="text-lg font-medium text-gray-500">
                     {t("no_update_available")}
                   </div>
                 </Card>
-              </PaginatedList.WhenEmpty>
-
-              <PaginatedList.WhenLoading>
-                <div className="grid gap-4">
-                  <CardListSkeleton count={4} />
-                </div>
-              </PaginatedList.WhenLoading>
-
-              <PaginatedList.Items<QuestionnaireResponse> className="grid gap-4">
-                {(item) => (
-                  <Card
-                    key={item.id}
-                    className="flex items-center justify-between p-4 transition-colors hover:bg-muted/50"
-                  >
-                    <div className="flex items-start gap-4">
-                      <CareIcon
-                        icon="l-file-alt"
-                        className="mt-1 h-5 w-5 text-gray-500"
-                      />
-                      <div>
-                        <h3 className="text-lg font-medium">
-                          {item.questionnaire?.title ||
-                            structuredResponsesPreview(
-                              item.structured_responses,
-                            )}
-                        </h3>
-                        <div className="mt-1 flex items-center gap-2 text-sm text-gray-500">
-                          <CareIcon icon="l-calender" className="h-4 w-4" />
-                          <span>{formatDateTime(item.created_date)}</span>
-                        </div>
-                        <div className="mt-1 text-sm text-gray-500">
-                          by {item.created_by?.first_name || ""}{" "}
-                          {item.created_by?.last_name || ""}
-                          {` (${item.created_by?.user_type})`}
+              ) : (
+                <ul className="grid gap-4">
+                  {patientUpdatesData?.results?.map((update) => (
+                    <li key={update.id} className="w-full">
+                      <Card
+                        key={update.id}
+                        className="flex items-center justify-between p-4 transition-colors hover:bg-muted/50"
+                      >
+                        <div className="flex items-start gap-4">
+                          <CareIcon
+                            icon="l-file-alt"
+                            className="mt-1 h-5 w-5 text-gray-500"
+                          />
+                          <div>
+                            <h3 className="text-lg font-medium">
+                              {update.questionnaire?.title ||
+                                structuredResponsesPreview(
+                                  update.structured_responses,
+                                )}
+                            </h3>
+                            <div className="mt-1 flex items-center gap-2 text-sm text-gray-500">
+                              <CareIcon icon="l-calender" className="h-4 w-4" />
+                              <span>{formatDateTime(update.created_date)}</span>
+                            </div>
+                            <div className="mt-1 text-sm text-gray-500">
+                              by {update.created_by?.first_name || ""}{" "}
+                              {update.created_by?.last_name || ""}
+                              {` (${update.created_by?.user_type})`}
+                            </div>
+                          </div>
                         </div>
-                      </div>
-                    </div>
-                    <Button
-                      variant="outline"
-                      onClick={() => {
-                        navigate(
-                          `/facility/${facilityId}/patient/${patientId}/encounter/${item.encounter}/questionnaire_response/${item.id}`,
-                        );
-                      }}
+                        <Button
+                          variant="outline"
+                          onClick={() => {
+                            navigate(
+                              `/facility/${facilityId}/patient/${patientId}/encounter/${update.encounter}/questionnaire_response/${update.id}`,
+                            );
+                          }}
+                        >
+                          {t("view")}
+                        </Button>
+                      </Card>
+                    </li>
+                  ))}
+                  <div className="flex w-full items-center justify-center">
+                    <div
+                      className={cn(
+                        "flex w-full justify-center",
+                        (patientUpdatesData?.count ?? 0) >
+                          RESULTS_PER_PAGE_LIMIT
+                          ? "visible"
+                          : "invisible",
+                      )}
                     >
-                      {t("view")}
-                    </Button>
-                  </Card>
-                )}
-              </PaginatedList.Items>
-
-              <div className="flex w-full items-center justify-center">
-                <PaginatedList.Paginator hideIfSinglePage />
-              </div>
+                      <PaginationComponent
+                        cPage={qParams.page ?? 1}
+                        defaultPerPage={RESULTS_PER_PAGE_LIMIT}
+                        data={{ totalCount: patientUpdatesData?.count ?? 0 }}
+                        onChange={(page) => setQueryParams({ page })}
+                      />
+                    </div>
+                  </div>
+                </ul>
+              )}
             </div>
-          </div>
-        )}
-      </PaginatedList>
+          )}
+        </div>
+      </div>
     </div>
   );
 };
diff --git a/src/components/Resource/ResourceCommentSection.tsx b/src/components/Resource/ResourceCommentSection.tsx
index 24adeba890b..62f94d5d6fa 100644
--- a/src/components/Resource/ResourceCommentSection.tsx
+++ b/src/components/Resource/ResourceCommentSection.tsx
@@ -1,84 +1,125 @@
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { t } from "i18next";
+import { useQueryParams } from "raviger";
 import { useState } from "react";
 import { toast } from "sonner";
 
-import PaginatedList from "@/CAREUI/misc/PaginatedList";
+import { cn } from "@/lib/utils";
 
 import { Button } from "@/components/ui/button";
 import { Textarea } from "@/components/ui/textarea";
 
 import { Avatar } from "@/components/Common/Avatar";
-import CircularProgress from "@/components/Common/CircularProgress";
+import PaginationComponent from "@/components/Common/Pagination";
+import { CardListSkeleton } from "@/components/Common/SkeletonLoading";
+
+import { RESULTS_PER_PAGE_LIMIT } from "@/common/constants";
 
 import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
+import mutate from "@/Utils/request/mutate";
+import query from "@/Utils/request/query";
 import { formatName, relativeTime } from "@/Utils/utils";
 import { CommentModel } from "@/types/resourceRequest/resourceRequest";
 
 const CommentSection = (props: { id: string }) => {
+  const { id } = props;
   const [commentBox, setCommentBox] = useState("");
+  const queryClient = useQueryClient();
 
-  const onSubmitComment = async () => {
-    const payload = {
-      comment: commentBox,
-    };
+  const [qParams, setQueryParams] = useQueryParams<{ page?: number }>();
+
+  const { data: resourceComments, isLoading } = useQuery({
+    queryKey: ["resourceComments", id, qParams],
+    queryFn: query(routes.getResourceComments, {
+      queryParams: {
+        limit: RESULTS_PER_PAGE_LIMIT,
+        offset: ((qParams.page ?? 1) - 1) * RESULTS_PER_PAGE_LIMIT,
+      },
+      pathParams: { id },
+    }),
+  });
+
+  const { mutate: addComment } = useMutation({
+    mutationFn: mutate(routes.addResourceComments, {
+      pathParams: { id },
+    }),
+    onSuccess: () => {
+      toast.success(t("comment_added_successfully"));
+      queryClient.invalidateQueries({ queryKey: ["resourceComments", id] });
+    },
+  });
+
+  const submitComment = () => {
     if (!/\S+/.test(commentBox)) {
       toast.error(t("comment_min_length"));
       return;
     }
-    const { res } = await request(routes.addResourceComments, {
-      pathParams: { id: props.id },
-      body: payload,
+    addComment({
+      comment: commentBox,
     });
-    if (res?.ok) {
-      toast.success(t("comment_added_successfully"));
-    }
     setCommentBox("");
   };
+
   return (
-    <PaginatedList
-      route={routes.getResourceComments}
-      pathParams={{ id: props.id }}
-    >
-      {(_, query) => (
-        <div className="flex w-full flex-col">
-          <Textarea
-            name="comment"
-            placeholder={t("type_your_comment")}
-            value={commentBox}
-            onChange={(e) => setCommentBox(e.target.value)}
-          />
+    <div className="flex w-full flex-col">
+      <div>
+        <Textarea
+          name="comment"
+          placeholder={t("type_your_comment")}
+          value={commentBox}
+          onChange={(e) => setCommentBox(e.target.value)}
+        />
+
+        <div className="flex w-full justify-end mt-2">
+          <Button variant="primary" onClick={submitComment}>
+            {t("post_your_comment")}
+          </Button>
+        </div>
 
-          <div className="flex w-full justify-end mt-2">
-            <Button
-              variant="primary"
-              onClick={async () => {
-                await onSubmitComment();
-                query.refetch();
-              }}
-            >
-              {t("post_your_comment")}
-            </Button>
-          </div>
-          <div className="w-full">
+        <div className="w-full">
+          {isLoading ? (
             <div>
-              <PaginatedList.WhenEmpty className="flex w-full justify-center border-b border-secondary-200 bg-white p-5 text-center text-2xl font-bold text-secondary-500">
-                <span>{t("no_comments_available")}</span>
-              </PaginatedList.WhenEmpty>
-              <PaginatedList.WhenLoading>
-                <CircularProgress className="h-12 w-12" />
-              </PaginatedList.WhenLoading>
-              <PaginatedList.Items<CommentModel>>
-                {(item) => <Comment {...item} />}
-              </PaginatedList.Items>
-              <div className="flex w-full items-center justify-center">
-                <PaginatedList.Paginator hideIfSinglePage />
+              <div className="grid gap-5">
+                <CardListSkeleton count={RESULTS_PER_PAGE_LIMIT} />
               </div>
             </div>
-          </div>
+          ) : (
+            <div>
+              {resourceComments?.results?.length === 0 ? (
+                <div className="p-flex w-full justify-center border-b border-secondary-200 bg-white p-5 text-center text-2xl font-bold text-secondary-500">
+                  <span>{t("no_comments_available")}</span>
+                </div>
+              ) : (
+                <ul>
+                  {resourceComments?.results?.map((comment) => (
+                    <li key={comment.id} className="w-full">
+                      <Comment {...comment} />
+                    </li>
+                  ))}
+                  <div className="flex w-full items-center justify-center">
+                    <div
+                      className={cn(
+                        "flex w-full justify-center",
+                        (resourceComments?.count ?? 0) > RESULTS_PER_PAGE_LIMIT
+                          ? "visible"
+                          : "invisible",
+                      )}
+                    >
+                      <PaginationComponent
+                        cPage={qParams.page ?? 1}
+                        defaultPerPage={RESULTS_PER_PAGE_LIMIT}
+                        data={{ totalCount: resourceComments?.count ?? 0 }}
+                        onChange={(page) => setQueryParams({ page })}
+                      />
+                    </div>
+                  </div>
+                </ul>
+              )}
+            </div>
+          )}
         </div>
-      )}
-    </PaginatedList>
+      </div>
+    </div>
   );
 };
 

From 73853b5447f223bc719c6b3a352d21ea9747164e Mon Sep 17 00:00:00 2001
From: Don Xavier <98073418+DonXavierdev@users.noreply.github.com>
Date: Tue, 4 Feb 2025 17:18:44 +0530
Subject: [PATCH 08/19] Fix : User Detail Responsiveness  (#10366)

---
 .../settings/organizations/FacilityOrganizationUsers.tsx      | 4 ++--
 src/pages/Organization/components/AddUserSheet.tsx            | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/Facility/settings/organizations/FacilityOrganizationUsers.tsx b/src/pages/Facility/settings/organizations/FacilityOrganizationUsers.tsx
index ba50a278d52..509f451a592 100644
--- a/src/pages/Facility/settings/organizations/FacilityOrganizationUsers.tsx
+++ b/src/pages/Facility/settings/organizations/FacilityOrganizationUsers.tsx
@@ -90,7 +90,7 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
           </div>
         </div>
 
-        <div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
+        <div className="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-4">
           {users?.results?.length === 0 ? (
             <Card className="col-span-full">
               <CardContent className="p-6 text-center text-gray-500">
@@ -115,7 +115,7 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
                             {userRole.user.first_name} {userRole.user.last_name}
                           </h1>
                           <span className="text-sm text-gray-500">
-                            <span className="mr-2">
+                            <span className="mr-2 break-words">
                               {userRole.user.username}
                             </span>
                             <UserStatusIndicator user={userRole.user} />
diff --git a/src/pages/Organization/components/AddUserSheet.tsx b/src/pages/Organization/components/AddUserSheet.tsx
index b6054eb4a56..1efba82ca81 100644
--- a/src/pages/Organization/components/AddUserSheet.tsx
+++ b/src/pages/Organization/components/AddUserSheet.tsx
@@ -33,7 +33,7 @@ export default function AddUserSheet({
   return (
     <Sheet open={open} onOpenChange={setOpen}>
       <SheetTrigger asChild>
-        <Button variant="outline" data-cy="add-user-button">
+        <Button variant="outline" data-cy="add-user-button" className="ml-3">
           <CareIcon icon="l-plus" className="mr-2 h-4 w-4" />
           {t("add_user")}
         </Button>

From fe44c96f084e36e58e1d0b327e901a6f06a011c6 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <125687187+Tanuj1718@users.noreply.github.com>
Date: Tue, 4 Feb 2025 17:22:32 +0530
Subject: [PATCH 09/19] fix: improved tablet view responsiveness (#10379)

---
 src/pages/Encounters/EncounterList.tsx | 280 +++++++++++++------------
 1 file changed, 142 insertions(+), 138 deletions(-)

diff --git a/src/pages/Encounters/EncounterList.tsx b/src/pages/Encounters/EncounterList.tsx
index effc46721a5..f6eaf605c80 100644
--- a/src/pages/Encounters/EncounterList.tsx
+++ b/src/pages/Encounters/EncounterList.tsx
@@ -214,8 +214,8 @@ export function EncounterList({
 
   return (
     <Page title={t("encounters")} hideBack={true}>
-      <div className="space-y-4 mt-2">
-        <div className="rounded-lg border bg-card shadow-sm">
+      <div className="space-y-4 mt-2 flex flex-col">
+        <div className="rounded-lg border bg-card shadow-sm flex flex-col">
           <div className="flex flex-col">
             <div className="flex flex-wrap items-center justify-between gap-2 p-4">
               <div className="flex flex-wrap items-center gap-2">
@@ -467,191 +467,195 @@ export function EncounterList({
               <div className="hidden md:flex items-center">
                 <Tabs value={status || "all"} className="w-full">
                   <TabsList className="bg-transparent p-0 h-8">
+                    <div className="flex flex-wrap">
+                      <TabsTrigger
+                        value="all"
+                        className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                        onClick={() =>
+                          updateQuery({
+                            ...{ encounter_class: encounterClass, priority },
+                            status: undefined,
+                          })
+                        }
+                      >
+                        {t("all")}
+                      </TabsTrigger>
+                      <TabsTrigger
+                        value="planned"
+                        className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                        onClick={() =>
+                          updateQuery({
+                            ...{ encounter_class: encounterClass, priority },
+                            status: "planned",
+                          })
+                        }
+                      >
+                        <CareIcon icon="l-calender" className="mr-2 h-4 w-4" />
+                        {t("encounter_status__planned")}
+                      </TabsTrigger>
+                      <TabsTrigger
+                        value="in_progress"
+                        className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                        onClick={() =>
+                          updateQuery({
+                            ...{ encounter_class: encounterClass, priority },
+                            status: "in_progress",
+                          })
+                        }
+                      >
+                        <CareIcon icon="l-spinner" className="mr-2 h-4 w-4" />
+                        {t("encounter_class__in_progress")}
+                      </TabsTrigger>
+                      <TabsTrigger
+                        value="discharged"
+                        className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                        onClick={() =>
+                          updateQuery({
+                            ...{ encounter_class: encounterClass, priority },
+                            status: "discharged",
+                          })
+                        }
+                      >
+                        <CareIcon icon="l-home" className="mr-2 h-4 w-4" />
+                        {t("discharge")}
+                      </TabsTrigger>
+                      <TabsTrigger
+                        value="completed"
+                        className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                        onClick={() =>
+                          updateQuery({
+                            ...{ encounter_class: encounterClass, priority },
+                            status: "completed",
+                          })
+                        }
+                      >
+                        <CareIcon icon="l-check" className="mr-2 h-4 w-4" />
+                        {t("completed")}
+                      </TabsTrigger>
+                      <TabsTrigger
+                        value="cancelled"
+                        className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                        onClick={() =>
+                          updateQuery({
+                            ...{ encounter_class: encounterClass, priority },
+                            status: "cancelled",
+                          })
+                        }
+                      >
+                        <CareIcon icon="l-x" className="mr-2 h-4 w-4" />
+                        {t("cancelled")}
+                      </TabsTrigger>
+                    </div>
+                  </TabsList>
+                </Tabs>
+              </div>
+            </div>
+
+            <Separator className="hidden md:block" />
+
+            {/* Class Filter - Desktop */}
+            <div className="hidden md:block p-4">
+              <Tabs value={encounterClass || "all"} className="w-full">
+                <TabsList className="bg-transparent p-0 h-8">
+                  <div className="flex flex-wrap">
                     <TabsTrigger
                       value="all"
                       className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
                       onClick={() =>
                         updateQuery({
-                          ...{ encounter_class: encounterClass, priority },
-                          status: undefined,
+                          status,
+                          priority,
+                          encounter_class: undefined,
                         })
                       }
                     >
-                      All
+                      {t("all")}
                     </TabsTrigger>
                     <TabsTrigger
-                      value="planned"
+                      value="imp"
                       className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
                       onClick={() =>
                         updateQuery({
-                          ...{ encounter_class: encounterClass, priority },
-                          status: "planned",
+                          status,
+                          priority,
+                          encounter_class: "imp",
                         })
                       }
                     >
-                      <CareIcon icon="l-calender" className="mr-2 h-4 w-4" />
-                      Planned
+                      <CareIcon icon="l-hospital" className="mr-2 h-4 w-4" />
+                      {t("encounter_class__imp")}
                     </TabsTrigger>
                     <TabsTrigger
-                      value="in_progress"
+                      value="amb"
                       className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
                       onClick={() =>
                         updateQuery({
-                          ...{ encounter_class: encounterClass, priority },
-                          status: "in_progress",
+                          status,
+                          priority,
+                          encounter_class: "amb",
                         })
                       }
                     >
-                      <CareIcon icon="l-spinner" className="mr-2 h-4 w-4" />
-                      In Progress
+                      <CareIcon icon="l-user" className="mr-2 h-4 w-4" />
+                      {t("encounter_class__amb")}
                     </TabsTrigger>
                     <TabsTrigger
-                      value="discharged"
+                      value="obsenc"
                       className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
                       onClick={() =>
                         updateQuery({
-                          ...{ encounter_class: encounterClass, priority },
-                          status: "discharged",
+                          status,
+                          priority,
+                          encounter_class: "obsenc",
                         })
                       }
                     >
-                      <CareIcon icon="l-home" className="mr-2 h-4 w-4" />
-                      Discharged
+                      <CareIcon icon="l-eye" className="mr-2 h-4 w-4" />
+                      {t("encounter_class__obsenc")}
                     </TabsTrigger>
                     <TabsTrigger
-                      value="completed"
+                      value="emer"
                       className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
                       onClick={() =>
                         updateQuery({
-                          ...{ encounter_class: encounterClass, priority },
-                          status: "completed",
+                          status,
+                          priority,
+                          encounter_class: "emer",
                         })
                       }
                     >
-                      <CareIcon icon="l-check" className="mr-2 h-4 w-4" />
-                      Completed
+                      <CareIcon icon="l-ambulance" className="mr-2 h-4 w-4" />
+                      {t("emergency")}
                     </TabsTrigger>
                     <TabsTrigger
-                      value="cancelled"
+                      value="vr"
                       className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
                       onClick={() =>
                         updateQuery({
-                          ...{ encounter_class: encounterClass, priority },
-                          status: "cancelled",
+                          status,
+                          priority,
+                          encounter_class: "vr",
                         })
                       }
                     >
-                      <CareIcon icon="l-x" className="mr-2 h-4 w-4" />
-                      Cancelled
+                      <CareIcon icon="l-video" className="mr-2 h-4 w-4" />
+                      {t("encounter_class__vr")}
                     </TabsTrigger>
-                  </TabsList>
-                </Tabs>
-              </div>
-            </div>
-
-            <Separator className="hidden md:block" />
-
-            {/* Class Filter - Desktop */}
-            <div className="hidden md:block p-4">
-              <Tabs value={encounterClass || "all"} className="w-full">
-                <TabsList className="bg-transparent p-0 h-8">
-                  <TabsTrigger
-                    value="all"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: undefined,
-                      })
-                    }
-                  >
-                    All Types
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="imp"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: "imp",
-                      })
-                    }
-                  >
-                    <CareIcon icon="l-hospital" className="mr-2 h-4 w-4" />
-                    Inpatient
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="amb"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: "amb",
-                      })
-                    }
-                  >
-                    <CareIcon icon="l-user" className="mr-2 h-4 w-4" />
-                    Ambulatory
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="obsenc"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: "obsenc",
-                      })
-                    }
-                  >
-                    <CareIcon icon="l-eye" className="mr-2 h-4 w-4" />
-                    Observation
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="emer"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: "emer",
-                      })
-                    }
-                  >
-                    <CareIcon icon="l-ambulance" className="mr-2 h-4 w-4" />
-                    Emergency
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="vr"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: "vr",
-                      })
-                    }
-                  >
-                    <CareIcon icon="l-video" className="mr-2 h-4 w-4" />
-                    Virtual
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="hh"
-                    className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
-                    onClick={() =>
-                      updateQuery({
-                        status,
-                        priority,
-                        encounter_class: "hh",
-                      })
-                    }
-                  >
-                    <CareIcon icon="l-home" className="mr-2 h-4 w-4" />
-                    Home Health
-                  </TabsTrigger>
+                    <TabsTrigger
+                      value="hh"
+                      className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
+                      onClick={() =>
+                        updateQuery({
+                          status,
+                          priority,
+                          encounter_class: "hh",
+                        })
+                      }
+                    >
+                      <CareIcon icon="l-home" className="mr-2 h-4 w-4" />
+                      {t("encounter_class__hh")}
+                    </TabsTrigger>
+                  </div>
                 </TabsList>
               </Tabs>
             </div>

From fdf44a415b4a17462ffc6ceaf556f45567c43be2 Mon Sep 17 00:00:00 2001
From: Mohamed amaan <121436543+modamaan@users.noreply.github.com>
Date: Tue, 4 Feb 2025 17:24:51 +0530
Subject: [PATCH 10/19] Fix: Improve Mobile Responsiveness and Layout for Edit
 User Form (#10359)

---
 src/components/Users/UserForm.tsx             |  6 +++---
 src/components/ui/date-picker.tsx             | 21 ++++++++++++++++---
 .../CreateScheduleTemplateSheet.tsx           | 14 +++++++++----
 3 files changed, 31 insertions(+), 10 deletions(-)

diff --git a/src/components/Users/UserForm.tsx b/src/components/Users/UserForm.tsx
index 91222bea76d..ce92df7533b 100644
--- a/src/components/Users/UserForm.tsx
+++ b/src/components/Users/UserForm.tsx
@@ -307,7 +307,7 @@ export default function UserForm({
           />
         )}
 
-        <div className="grid grid-cols-2 gap-4">
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
           <FormField
             control={form.control}
             name="first_name"
@@ -414,7 +414,7 @@ export default function UserForm({
               )}
             />
 
-            <div className="grid grid-cols-2 gap-4">
+            <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
               <FormField
                 control={form.control}
                 name="password"
@@ -507,7 +507,7 @@ export default function UserForm({
           />
         )}
 
-        <div className="grid grid-cols-2 gap-4">
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
           <FormField
             control={form.control}
             name="phone_number"
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index e8c5587fe2e..9e95c5473c6 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -30,13 +30,28 @@ export function DatePicker({ date, onChange, disabled }: DatePickerProps) {
           className={cn(
             "w-full justify-start text-left font-normal",
             !date && "text-gray-500",
+            "sm:w-auto",
           )}
         >
-          <CareIcon icon="l-calender" className="mr-2 h-4 w-4" />
-          {date ? format(date, "PPP") : <span>Pick a date</span>}
+          <CareIcon
+            icon="l-calender"
+            className="mr-0 sm:mr-2 h-4 w-4 flex-shrink-0"
+          />
+          <span className="truncate">
+            {date ? (
+              <>
+                <span className="block sm:hidden">
+                  {format(date, "MMM d, yyyy")}
+                </span>
+                <span className="hidden sm:block">{format(date, "PPP")}</span>
+              </>
+            ) : (
+              <span>Pick a date</span>
+            )}
+          </span>
         </Button>
       </PopoverTrigger>
-      <PopoverContent className="w-auto p-0" align="start">
+      <PopoverContent className="w-auto p-0 sm:w-64" align="start">
         <Calendar
           mode="single"
           selected={date}
diff --git a/src/pages/Scheduling/components/CreateScheduleTemplateSheet.tsx b/src/pages/Scheduling/components/CreateScheduleTemplateSheet.tsx
index a32f3d193bf..d4081a965fe 100644
--- a/src/pages/Scheduling/components/CreateScheduleTemplateSheet.tsx
+++ b/src/pages/Scheduling/components/CreateScheduleTemplateSheet.tsx
@@ -431,7 +431,7 @@ export default function CreateScheduleTemplateSheet({
                         )}
                       /> */}
 
-                      <div className="flex items-center gap-4 col-span-2 md:col-span-1">
+                      <div className="flex items-center gap-0 sm:gap-4 col-span-2 md:col-span-1">
                         <FormField
                           control={form.control}
                           name={`availabilities.${index}.start_time`}
@@ -466,13 +466,16 @@ export default function CreateScheduleTemplateSheet({
                       {form.watch(`availabilities.${index}.slot_type`) ===
                         "appointment" && (
                         <>
-                          <div className="flex items-center gap-4 col-span-2 md:col-span-1">
+                          <div className="flex items-center gap-2 sm:gap-4 col-span-2 md:col-span-1">
                             <FormField
                               control={form.control}
                               name={`availabilities.${index}.slot_size_in_minutes`}
                               render={({ field }) => (
                                 <FormItem className="flex-1">
-                                  <FormLabel required>
+                                  <FormLabel
+                                    required
+                                    className="whitespace-nowrap"
+                                  >
                                     {t("schedule_slot_size_label")}
                                   </FormLabel>
                                   <FormControl>
@@ -497,7 +500,10 @@ export default function CreateScheduleTemplateSheet({
                               name={`availabilities.${index}.tokens_per_slot`}
                               render={({ field }) => (
                                 <FormItem className="flex-1">
-                                  <FormLabel required>
+                                  <FormLabel
+                                    required
+                                    className="whitespace-nowrap"
+                                  >
                                     {t("patients_per_slot")}
                                   </FormLabel>
                                   <FormControl>

From 879c5838318ae97e2251f216b892e21971f14acf Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Tue, 4 Feb 2025 13:55:28 +0000
Subject: [PATCH 11/19] Add lint checks to scan for un-imported files and
 unused packages (#10390)

---
 .github/workflows/linter.yml |    3 +
 .unimportedrc.json           |   54 ++
 package-lock.json            | 1280 ++++++++++++++++++++++++++++++++--
 package.json                 |    5 +-
 4 files changed, 1285 insertions(+), 57 deletions(-)
 create mode 100644 .unimportedrc.json

diff --git a/.github/workflows/linter.yml b/.github/workflows/linter.yml
index 7b2ff575aa8..698aec731e1 100644
--- a/.github/workflows/linter.yml
+++ b/.github/workflows/linter.yml
@@ -28,3 +28,6 @@ jobs:
 
       - name: Run lint
         run: npm run lint -- --quiet
+
+      - name: Run unimported
+        run: npm run unimported
diff --git a/.unimportedrc.json b/.unimportedrc.json
new file mode 100644
index 00000000000..fcea15622f2
--- /dev/null
+++ b/.unimportedrc.json
@@ -0,0 +1,54 @@
+{
+  "ignorePatterns": [
+    "node_modules/**",
+    "**/*.d.ts"
+  ],
+  "ignoreUnimported": [
+    "src/Locale/update_locale.js",
+    "src/PluginRegistry.ts",
+    "src/pluginTypes.ts",
+    "src/service-worker.ts"
+  ],
+  "ignoreUnused": [
+    "@fontsource/figtree",
+    "@originjs/vite-plugin-federation",
+    "@vitejs/plugin-react",
+    "browserslist-useragent-regexp",
+    "cross-env",
+    "postcss-loader"
+  ],
+  "ignoreUnresolved": [
+    [
+      "./pluginMap",
+      [
+        "src/pluginTypes.ts"
+      ]
+    ],
+    [
+      "@/supportedBrowsers",
+      [
+        "src/components/ErrorPages/BrowserWarning.tsx"
+      ]
+    ],
+    [
+      "tsx/cjs",
+      [
+        "node_modules/find-cypress-specs/src/index.js"
+      ]
+    ],
+    [
+      "virtual:pwa-register",
+      [
+        "src/index.tsx"
+      ]
+    ]
+  ],
+  "respectGitignore": true,
+  "entry": [
+    "src/index.tsx",
+    "vite.config.mts",
+    "tailwind.config.js",
+    "cypress.config.ts",
+    "scripts/**"
+  ]
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index e8c36ab78e0..c131f3c2898 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -130,6 +130,7 @@
         "ts-node": "^10.9.2",
         "tsx": "^4.19.2",
         "typescript": "^5.6.3",
+        "unimported": "^1.31.0",
         "uuid": "^11.0.2",
         "vite": "^5.4.10",
         "vite-plugin-checker": "^0.8.0",
@@ -4105,6 +4106,49 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
+    "node_modules/@humanwhocodes/config-array": {
+      "version": "0.13.0",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz",
+      "integrity": "sha512-DZLEEqFWQFiyK6h5YIeynKx7JlvCYWL0cImfSRXZ9l4Sg2efkFGTuFf6vzXjK1cq6IYkU+Eg/JizXw+TD2vRNw==",
+      "deprecated": "Use @eslint/config-array instead",
+      "dev": true,
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@humanwhocodes/object-schema": "^2.0.3",
+        "debug": "^4.3.1",
+        "minimatch": "^3.0.5"
+      },
+      "engines": {
+        "node": ">=10.10.0"
+      }
+    },
+    "node_modules/@humanwhocodes/config-array/node_modules/brace-expansion": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/@humanwhocodes/config-array/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "peer": true,
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/@humanwhocodes/module-importer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
@@ -4119,6 +4163,15 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
+    "node_modules/@humanwhocodes/object-schema": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.3.tgz",
+      "integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==",
+      "deprecated": "Use @eslint/object-schema instead",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "peer": true
+    },
     "node_modules/@humanwhocodes/retry": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.1.tgz",
@@ -4286,6 +4339,23 @@
         }
       }
     },
+    "node_modules/@kwsites/file-exists": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@kwsites/file-exists/-/file-exists-1.1.1.tgz",
+      "integrity": "sha512-m9/5YGR18lIwxSFDwfE3oA7bWuq9kdau6ugN4H2rJeyhFQZcG9AgSHkQtSD15a8WvTgfz9aikZMrKPHvbpqFiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.1.1"
+      }
+    },
+    "node_modules/@kwsites/promise-deferred": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@kwsites/promise-deferred/-/promise-deferred-1.1.1.tgz",
+      "integrity": "sha512-GaHYm+c0O9MjZRu0ongGBRbinu8gVAMd2UZjji6jVmqKtZluZnptXGWhz1E8j8D2HJ3f/yMxKAUC0b+57wncIw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -6572,6 +6642,13 @@
         "undici-types": "~6.20.0"
       }
     },
+    "node_modules/@types/normalize-package-data": {
+      "version": "2.4.4",
+      "resolved": "https://registry.npmjs.org/@types/normalize-package-data/-/normalize-package-data-2.4.4.tgz",
+      "integrity": "sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/prop-types": {
       "version": "15.7.14",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz",
@@ -7226,6 +7303,14 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
+    "node_modules/@ungap/structured-clone": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.0.tgz",
+      "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==",
+      "dev": true,
+      "license": "ISC",
+      "peer": true
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.4.tgz",
@@ -7910,8 +7995,8 @@
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
       "integrity": "sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "buffer": "^5.5.0",
         "inherits": "^2.0.4",
@@ -8330,6 +8415,19 @@
         "node": ">=8"
       }
     },
+    "node_modules/cli-spinners": {
+      "version": "2.9.2",
+      "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-2.9.2.tgz",
+      "integrity": "sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/cli-table3": {
       "version": "0.6.5",
       "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.6.5.tgz",
@@ -8391,12 +8489,74 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/cliui": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
+      "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^7.0.0"
+      }
+    },
+    "node_modules/cliui/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cliui/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/clone": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz",
       "integrity": "sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
       "engines": {
         "node": ">=0.8"
       }
@@ -9098,8 +9258,8 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz",
       "integrity": "sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "clone": "^1.0.2"
       },
@@ -10716,6 +10876,48 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/flow-parser": {
+      "version": "0.156.0",
+      "resolved": "https://registry.npmjs.org/flow-parser/-/flow-parser-0.156.0.tgz",
+      "integrity": "sha512-OCE3oIixhOttaV4ahIGtxf9XfaDdxujiTnXuHu+0dvDVVDiSDJlQpgCWdDKqP0OHfFnxQKrjMamArDAXtrBtZw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/flow-remove-types": {
+      "version": "2.156.0",
+      "resolved": "https://registry.npmjs.org/flow-remove-types/-/flow-remove-types-2.156.0.tgz",
+      "integrity": "sha512-ivU28S1ycaVo5anxlXdIVlrmqLD81JWFADa6oUjyoQg0va4zSyZCp5OYco74VZi7nm42O/yTNv1Y5Byc7bJF1Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flow-parser": "^0.156.0",
+        "pirates": "^3.0.2",
+        "vlq": "^0.2.1"
+      },
+      "bin": {
+        "flow-node": "flow-node",
+        "flow-remove-types": "flow-remove-types"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/flow-remove-types/node_modules/pirates": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/pirates/-/pirates-3.0.2.tgz",
+      "integrity": "sha512-c5CgUJq6H2k6MJz72Ak1F5sN9n9wlSlJyEnwvpm9/y3WB4E3pHBDT2c6PEiS1vyJvq2bUxUAIu0EGf8Cx4Ic7Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "node-modules-regexp": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 4"
+      }
+    },
     "node_modules/for-each": {
       "version": "0.3.3",
       "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
@@ -10897,6 +11099,16 @@
         "node": ">=18"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
     "node_modules/get-east-asian-width": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.3.0.tgz",
@@ -11298,6 +11510,13 @@
         "react-is": "^16.7.0"
       }
     },
+    "node_modules/hosted-git-info": {
+      "version": "2.8.9",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
+      "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/html-encoding-sniffer": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
@@ -11918,6 +12137,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-interactive": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-1.0.0.tgz",
+      "integrity": "sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-map": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
@@ -13856,6 +14085,16 @@
         "webidl-conversions": "^3.0.0"
       }
     },
+    "node_modules/node-modules-regexp": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/node-modules-regexp/-/node-modules-regexp-1.0.0.tgz",
+      "integrity": "sha512-JMaRS9L4wSRIR+6PTVEikTrq/lMGEZR43a48ETeilY0Q0iMwVnccMFrUM1k+tNzmYuIU0Vh710bCUqHX+/+ctQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/node-releases": {
       "version": "2.0.19",
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz",
@@ -13875,6 +14114,50 @@
         "node": ">=18"
       }
     },
+    "node_modules/normalize-package-data": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
+      "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "hosted-git-info": "^2.1.4",
+        "resolve": "^1.10.0",
+        "semver": "2 || 3 || 4 || 5",
+        "validate-npm-package-license": "^3.0.1"
+      }
+    },
+    "node_modules/normalize-package-data/node_modules/resolve": {
+      "version": "1.22.10",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",
+      "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-core-module": "^2.16.0",
+        "path-parse": "^1.0.7",
+        "supports-preserve-symlinks-flag": "^1.0.0"
+      },
+      "bin": {
+        "resolve": "bin/resolve"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/normalize-package-data/node_modules/semver": {
+      "version": "5.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver"
+      }
+    },
     "node_modules/normalize-path": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
@@ -14086,6 +14369,30 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/ora": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz",
+      "integrity": "sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "bl": "^4.1.0",
+        "chalk": "^4.1.0",
+        "cli-cursor": "^3.1.0",
+        "cli-spinners": "^2.5.0",
+        "is-interactive": "^1.0.0",
+        "is-unicode-supported": "^0.1.0",
+        "log-symbols": "^4.1.0",
+        "strip-ansi": "^6.0.0",
+        "wcwidth": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/ospath": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/ospath/-/ospath-1.2.2.tgz",
@@ -14157,6 +14464,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/p-try": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/package-json-from-dist": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
@@ -15403,45 +15720,155 @@
         "pify": "^2.3.0"
       }
     },
-    "node_modules/readable-stream": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
-      "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
+    "node_modules/read-pkg": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
+      "integrity": "sha512-Ug69mNOpfvKDAc2Q8DRpMjjzdtrnv9HcSMX+4VsZxD1aZ6ZzrIE7rlzXBtWTyhULSMKg076AW6WR5iZpD0JiOg==",
+      "dev": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
-        "inherits": "^2.0.3",
-        "string_decoder": "^1.1.1",
-        "util-deprecate": "^1.0.1"
+        "@types/normalize-package-data": "^2.4.0",
+        "normalize-package-data": "^2.5.0",
+        "parse-json": "^5.0.0",
+        "type-fest": "^0.6.0"
       },
       "engines": {
-        "node": ">= 6"
+        "node": ">=8"
       }
     },
-    "node_modules/readdirp": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
-      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+    "node_modules/read-pkg-up": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-7.0.1.tgz",
+      "integrity": "sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "picomatch": "^2.2.1"
+        "find-up": "^4.1.0",
+        "read-pkg": "^5.2.0",
+        "type-fest": "^0.8.1"
       },
       "engines": {
-        "node": ">=8.10.0"
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/recharts": {
-      "version": "2.15.1",
-      "resolved": "https://registry.npmjs.org/recharts/-/recharts-2.15.1.tgz",
-      "integrity": "sha512-v8PUTUlyiDe56qUj82w/EDVuzEFXwEHp9/xOowGAZwfLjB9uAy3GllQVIYMWF6nU+qibx85WF75zD7AjqoT54Q==",
+    "node_modules/read-pkg-up/node_modules/find-up": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "clsx": "^2.0.0",
-        "eventemitter3": "^4.0.1",
-        "lodash": "^4.17.21",
-        "react-is": "^18.3.1",
-        "react-smooth": "^4.0.4",
-        "recharts-scale": "^0.4.4",
+        "locate-path": "^5.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/read-pkg-up/node_modules/locate-path": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-locate": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/read-pkg-up/node_modules/p-limit": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-try": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/read-pkg-up/node_modules/p-locate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-limit": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/read-pkg-up/node_modules/type-fest": {
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.8.1.tgz",
+      "integrity": "sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/read-pkg/node_modules/type-fest": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.6.0.tgz",
+      "integrity": "sha512-q+MB8nYR1KDLrgr4G5yemftpMC7/QLqVndBmEEdqzmNj5dcFOO4Oo8qlwZE3ULT3+Zim1F8Kq4cBnikNhlCMlg==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/readable-stream": {
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
+      "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
+      "devOptional": true,
+      "license": "MIT",
+      "dependencies": {
+        "inherits": "^2.0.3",
+        "string_decoder": "^1.1.1",
+        "util-deprecate": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "license": "MIT",
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/recharts": {
+      "version": "2.15.1",
+      "resolved": "https://registry.npmjs.org/recharts/-/recharts-2.15.1.tgz",
+      "integrity": "sha512-v8PUTUlyiDe56qUj82w/EDVuzEFXwEHp9/xOowGAZwfLjB9uAy3GllQVIYMWF6nU+qibx85WF75zD7AjqoT54Q==",
+      "license": "MIT",
+      "dependencies": {
+        "clsx": "^2.0.0",
+        "eventemitter3": "^4.0.1",
+        "lodash": "^4.17.21",
+        "react-is": "^18.3.1",
+        "react-smooth": "^4.0.4",
+        "recharts-scale": "^0.4.4",
         "tiny-invariant": "^1.3.1",
         "victory-vendor": "^36.6.8"
       },
@@ -15692,6 +16119,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/require-from-string": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
@@ -15816,6 +16253,69 @@
       "integrity": "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==",
       "license": "MIT"
     },
+    "node_modules/rimraf": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+      "deprecated": "Rimraf versions prior to v4 are no longer supported",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "glob": "^7.1.3"
+      },
+      "bin": {
+        "rimraf": "bin.js"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/rimraf/node_modules/brace-expansion": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/rimraf/node_modules/glob": {
+      "version": "7.2.3",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
+      "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "fs.realpath": "^1.0.0",
+        "inflight": "^1.0.4",
+        "inherits": "2",
+        "minimatch": "^3.1.1",
+        "once": "^1.3.0",
+        "path-is-absolute": "^1.0.0"
+      },
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/rimraf/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/roarr": {
       "version": "2.15.4",
       "resolved": "https://registry.npmjs.org/roarr/-/roarr-2.15.4.tgz",
@@ -16351,6 +16851,22 @@
         "simple-concat": "^1.0.0"
       }
     },
+    "node_modules/simple-git": {
+      "version": "3.27.0",
+      "resolved": "https://registry.npmjs.org/simple-git/-/simple-git-3.27.0.tgz",
+      "integrity": "sha512-ivHoFS9Yi9GY49ogc6/YAi3Fl9ROnF4VyubNylgCkA+RVqLaKWnDSzXOVzya8csELIaWaYNutsEuAhZrtOjozA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@kwsites/file-exists": "^1.1.1",
+        "@kwsites/promise-deferred": "^1.1.1",
+        "debug": "^4.3.5"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/steveukx/git-js?sponsor=1"
+      }
+    },
     "node_modules/slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -16474,6 +16990,42 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/spdx-correct": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.2.0.tgz",
+      "integrity": "sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "spdx-expression-parse": "^3.0.0",
+        "spdx-license-ids": "^3.0.0"
+      }
+    },
+    "node_modules/spdx-exceptions": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
+      "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
+      "dev": true,
+      "license": "CC-BY-3.0"
+    },
+    "node_modules/spdx-expression-parse": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.1.tgz",
+      "integrity": "sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "spdx-exceptions": "^2.1.0",
+        "spdx-license-ids": "^3.0.0"
+      }
+    },
+    "node_modules/spdx-license-ids": {
+      "version": "3.0.21",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.21.tgz",
+      "integrity": "sha512-Bvg/8F5XephndSK3JffaRqdT+gyhfqIPwDHpX80tJrF8QQRYMo8sNMeaZ2Dp5+jhwKnUmIOyFFQfHRkjJm5nXg==",
+      "dev": true,
+      "license": "CC0-1.0"
+    },
     "node_modules/spec-change": {
       "version": "1.11.11",
       "resolved": "https://registry.npmjs.org/spec-change/-/spec-change-1.11.11.tgz",
@@ -16552,8 +17104,8 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
       "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "safe-buffer": "~5.2.0"
       }
@@ -17172,6 +17724,19 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/term-size": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/term-size/-/term-size-2.2.1.tgz",
+      "integrity": "sha512-wK0Ri4fOGjv/XPy8SBHZChl8CM7uMc5VML7SqiQ0zG7+J5Vr+RMQDoHa2CNT6KHUnTGIXH34UDMkPzAUyapBZg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/terminal-size": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/terminal-size/-/terminal-size-4.0.0.tgz",
@@ -17211,6 +17776,14 @@
       "devOptional": true,
       "license": "MIT"
     },
+    "node_modules/text-table": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
+      "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
     "node_modules/thenify": {
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
@@ -17750,52 +18323,558 @@
         "node": ">=4"
       }
     },
-    "node_modules/unique-string": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-2.0.0.tgz",
-      "integrity": "sha512-uNaeirEPvpZWSgzwsPGtU2zVSTrn/8L5q/IexZmH0eH6SA73CmAA5U4GwORTxQAZs95TAXLNqeLoPPNO5gZfWg==",
+    "node_modules/unimported": {
+      "version": "1.31.0",
+      "resolved": "https://registry.npmjs.org/unimported/-/unimported-1.31.0.tgz",
+      "integrity": "sha512-QcbdHplhQzZfis6gs+IrbuSJ3hR7pN+w78p0WzvYwxU6SVjiwGZNOAlXbo6WFghA1MWmHPchi0L/2EfHnb549A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "crypto-random-string": "^2.0.0"
+        "@typescript-eslint/parser": "^6.7.3",
+        "@typescript-eslint/typescript-estree": "^6.7.3",
+        "chalk": "^4.1.0",
+        "cosmiconfig": "^8.3.6",
+        "debug": "^4.3.2",
+        "file-entry-cache": "^6.0.1",
+        "flow-remove-types": "2.156.0",
+        "glob": "^7.1.6",
+        "ignore": "^5.2.4",
+        "json5": "^2.2.0",
+        "ora": "^5.3.0",
+        "read-pkg-up": "^7.0.1",
+        "resolve": "^1.20.0",
+        "simple-git": "^3.18.0",
+        "term-size": "^2.2.1",
+        "typescript": "^5.2.2",
+        "yargs": "^16.2.0"
+      },
+      "bin": {
+        "unimported": "bin/unimported.js"
       },
       "engines": {
-        "node": ">=8"
+        "node": ">=16.0.0"
       }
     },
-    "node_modules/universalify": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
-      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+    "node_modules/unimported/node_modules/@eslint/eslintrc": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.4.tgz",
+      "integrity": "sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==",
+      "dev": true,
       "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "ajv": "^6.12.4",
+        "debug": "^4.3.2",
+        "espree": "^9.6.0",
+        "globals": "^13.19.0",
+        "ignore": "^5.2.0",
+        "import-fresh": "^3.2.1",
+        "js-yaml": "^4.1.0",
+        "minimatch": "^3.1.2",
+        "strip-json-comments": "^3.1.1"
+      },
       "engines": {
-        "node": ">= 10.0.0"
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/untildify": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/untildify/-/untildify-4.0.0.tgz",
-      "integrity": "sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==",
+    "node_modules/unimported/node_modules/@eslint/eslintrc/node_modules/brace-expansion": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "dev": true,
       "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/unimported/node_modules/@eslint/eslintrc/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "peer": true,
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
       "engines": {
-        "node": ">=8"
+        "node": "*"
       }
     },
-    "node_modules/upath": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
-      "integrity": "sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==",
+    "node_modules/unimported/node_modules/@eslint/js": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz",
+      "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
-        "node": ">=4",
-        "yarn": "*"
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
-    "node_modules/update-browserslist-db": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.1.tgz",
-      "integrity": "sha512-R8UzCaa9Az+38REPiJ1tXlImTJXlVfgHZsglwBD/k6nj76ctsH1E3q4doGrukiLQd3sGQYu56r5+lo5r94l29A==",
+    "node_modules/unimported/node_modules/@typescript-eslint/parser": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.21.0.tgz",
+      "integrity": "sha512-tbsV1jPne5CkFQCgPBcDOt30ItF7aJoZL997JSF7MhGQqOeT3svWRYxiqlfA5RUdlHN6Fi+EI9bxqbdyAUZjYQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "6.21.0",
+        "@typescript-eslint/types": "6.21.0",
+        "@typescript-eslint/typescript-estree": "6.21.0",
+        "@typescript-eslint/visitor-keys": "6.21.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/unimported/node_modules/@typescript-eslint/scope-manager": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.21.0.tgz",
+      "integrity": "sha512-OwLUIWZJry80O99zvqXVEioyniJMa+d2GrqpUTqi5/v5D5rOrppJVBPa0yKCblcigC0/aYAzxxqQ1B+DS2RYsg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "6.21.0",
+        "@typescript-eslint/visitor-keys": "6.21.0"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/unimported/node_modules/@typescript-eslint/types": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.21.0.tgz",
+      "integrity": "sha512-1kFmZ1rOm5epu9NZEZm1kckCDGj5UJEf7P1kliH4LKu/RkwpsfqqGmY2OOcUs18lSlQBKLDYBOGxRVtrMN5lpg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/unimported/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.21.0.tgz",
+      "integrity": "sha512-6npJTkZcO+y2/kr+z0hc4HwNfrrP4kNYh57ek7yCNlrBjWQ1Y0OS7jiZTkgumrvkX5HkEKXFZkkdFNkaW2wmUQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "@typescript-eslint/types": "6.21.0",
+        "@typescript-eslint/visitor-keys": "6.21.0",
+        "debug": "^4.3.4",
+        "globby": "^11.1.0",
+        "is-glob": "^4.0.3",
+        "minimatch": "9.0.3",
+        "semver": "^7.5.4",
+        "ts-api-utils": "^1.0.1"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/unimported/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.21.0.tgz",
+      "integrity": "sha512-JJtkDduxLi9bivAB+cYOVMtbkqdPOhZ+ZI5LC47MIRrDV4Yn2o+ZnW10Nkmr28xRpSpdJ6Sm42Hjf2+REYXm0A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "6.21.0",
+        "eslint-visitor-keys": "^3.4.1"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/unimported/node_modules/cosmiconfig": {
+      "version": "8.3.6",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz",
+      "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "import-fresh": "^3.3.0",
+        "js-yaml": "^4.1.0",
+        "parse-json": "^5.2.0",
+        "path-type": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/d-fischer"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.9.5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/unimported/node_modules/doctrine": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
+      "integrity": "sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "esutils": "^2.0.2"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/unimported/node_modules/eslint": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.1.tgz",
+      "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
+      "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.2.0",
+        "@eslint-community/regexpp": "^4.6.1",
+        "@eslint/eslintrc": "^2.1.4",
+        "@eslint/js": "8.57.1",
+        "@humanwhocodes/config-array": "^0.13.0",
+        "@humanwhocodes/module-importer": "^1.0.1",
+        "@nodelib/fs.walk": "^1.2.8",
+        "@ungap/structured-clone": "^1.2.0",
+        "ajv": "^6.12.4",
+        "chalk": "^4.0.0",
+        "cross-spawn": "^7.0.2",
+        "debug": "^4.3.2",
+        "doctrine": "^3.0.0",
+        "escape-string-regexp": "^4.0.0",
+        "eslint-scope": "^7.2.2",
+        "eslint-visitor-keys": "^3.4.3",
+        "espree": "^9.6.1",
+        "esquery": "^1.4.2",
+        "esutils": "^2.0.2",
+        "fast-deep-equal": "^3.1.3",
+        "file-entry-cache": "^6.0.1",
+        "find-up": "^5.0.0",
+        "glob-parent": "^6.0.2",
+        "globals": "^13.19.0",
+        "graphemer": "^1.4.0",
+        "ignore": "^5.2.0",
+        "imurmurhash": "^0.1.4",
+        "is-glob": "^4.0.0",
+        "is-path-inside": "^3.0.3",
+        "js-yaml": "^4.1.0",
+        "json-stable-stringify-without-jsonify": "^1.0.1",
+        "levn": "^0.4.1",
+        "lodash.merge": "^4.6.2",
+        "minimatch": "^3.1.2",
+        "natural-compare": "^1.4.0",
+        "optionator": "^0.9.3",
+        "strip-ansi": "^6.0.1",
+        "text-table": "^0.2.0"
+      },
+      "bin": {
+        "eslint": "bin/eslint.js"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/unimported/node_modules/eslint-scope": {
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
+      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "peer": true,
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/unimported/node_modules/eslint/node_modules/brace-expansion": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/unimported/node_modules/eslint/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "peer": true,
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/unimported/node_modules/espree": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
+      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "peer": true,
+      "dependencies": {
+        "acorn": "^8.9.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^3.4.1"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/unimported/node_modules/file-entry-cache": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz",
+      "integrity": "sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flat-cache": "^3.0.4"
+      },
+      "engines": {
+        "node": "^10.12.0 || >=12.0.0"
+      }
+    },
+    "node_modules/unimported/node_modules/flat-cache": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.2.0.tgz",
+      "integrity": "sha512-CYcENa+FtcUKLmhhqyctpclsq7QF38pKjZHsGNiSQF5r4FtoKDWabFDl3hzaEQMvT1LHEysw5twgLvpYYb4vbw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flatted": "^3.2.9",
+        "keyv": "^4.5.3",
+        "rimraf": "^3.0.2"
+      },
+      "engines": {
+        "node": "^10.12.0 || >=12.0.0"
+      }
+    },
+    "node_modules/unimported/node_modules/glob": {
+      "version": "7.2.3",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
+      "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "fs.realpath": "^1.0.0",
+        "inflight": "^1.0.4",
+        "inherits": "2",
+        "minimatch": "^3.1.1",
+        "once": "^1.3.0",
+        "path-is-absolute": "^1.0.0"
+      },
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/unimported/node_modules/glob/node_modules/brace-expansion": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/unimported/node_modules/glob/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/unimported/node_modules/globals": {
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "type-fest": "^0.20.2"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/unimported/node_modules/minimatch": {
+      "version": "9.0.3",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
+      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/unimported/node_modules/resolve": {
+      "version": "1.22.10",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",
+      "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-core-module": "^2.16.0",
+        "path-parse": "^1.0.7",
+        "supports-preserve-symlinks-flag": "^1.0.0"
+      },
+      "bin": {
+        "resolve": "bin/resolve"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/unimported/node_modules/type-fest": {
+      "version": "0.20.2",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
+      "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "peer": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/unique-string": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-2.0.0.tgz",
+      "integrity": "sha512-uNaeirEPvpZWSgzwsPGtU2zVSTrn/8L5q/IexZmH0eH6SA73CmAA5U4GwORTxQAZs95TAXLNqeLoPPNO5gZfWg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "crypto-random-string": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/universalify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
+      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
+    "node_modules/untildify": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/untildify/-/untildify-4.0.0.tgz",
+      "integrity": "sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/upath": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
+      "integrity": "sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4",
+        "yarn": "*"
+      }
+    },
+    "node_modules/update-browserslist-db": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.1.tgz",
+      "integrity": "sha512-R8UzCaa9Az+38REPiJ1tXlImTJXlVfgHZsglwBD/k6nj76ctsH1E3q4doGrukiLQd3sGQYu56r5+lo5r94l29A==",
       "funding": [
         {
           "type": "opencollective",
@@ -17936,6 +19015,17 @@
       "devOptional": true,
       "license": "MIT"
     },
+    "node_modules/validate-npm-package-license": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
+      "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "spdx-correct": "^3.0.0",
+        "spdx-expression-parse": "^3.0.0"
+      }
+    },
     "node_modules/validator": {
       "version": "13.12.0",
       "resolved": "https://registry.npmjs.org/validator/-/validator-13.12.0.tgz",
@@ -18646,6 +19736,13 @@
         "@esbuild/win32-x64": "0.21.5"
       }
     },
+    "node_modules/vlq": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/vlq/-/vlq-0.2.3.tgz",
+      "integrity": "sha512-DRibZL6DsNhIgYQ+wNdWDL2SL3bKPlVrRiBqV5yuMm++op8W4kGFtaQfCs4KEJn0wBZcHVHJ3eoywX8983k1ow==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/void-elements": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
@@ -18775,8 +19872,8 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/wcwidth/-/wcwidth-1.0.1.tgz",
       "integrity": "sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "defaults": "^1.0.3"
       }
@@ -19552,6 +20649,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/yallist": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
@@ -19570,6 +20677,67 @@
         "node": ">= 14"
       }
     },
+    "node_modules/yargs": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
+      "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^7.0.2",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^20.2.2"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "20.2.9",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
+      "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/yargs/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/yargs/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/yauzl": {
       "version": "2.10.0",
       "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.10.0.tgz",
diff --git a/package.json b/package.json
index df2e0678b34..c29aa4bce55 100644
--- a/package.json
+++ b/package.json
@@ -43,6 +43,7 @@
     "cypress:install": "cross-env NODE_ENV=development cypress install",
     "prepare": "husky",
     "lint": "eslint ./src",
+    "unimported": "unimported",
     "lint-fix": "eslint ./src --fix",
     "format": "prettier ./src ./cypress --write",
     "sort-locales": "node ./scripts/sort-locales.js"
@@ -168,6 +169,7 @@
     "ts-node": "^10.9.2",
     "tsx": "^4.19.2",
     "typescript": "^5.6.3",
+    "unimported": "^1.31.0",
     "uuid": "^11.0.2",
     "vite": "^5.4.10",
     "vite-plugin-checker": "^0.8.0",
@@ -197,6 +199,7 @@
     "*.{ts,tsx,js,jsx}": [
       "prettier --write --ignore-unknown --plugin prettier-plugin-tailwindcss --plugin @trivago/prettier-plugin-sort-imports",
       "eslint --fix",
+      "unimported",
       "git update-index --again"
     ],
     "public/locale/*.json": [
@@ -207,4 +210,4 @@
     "node": ">=22.8.0"
   },
   "packageManager": "npm@10.9.2"
-}
+}
\ No newline at end of file

From 5d9273d85baa3fbe414cfb19fc5df5009291f098 Mon Sep 17 00:00:00 2001
From: Amjith Titus <amjithtitus09@gmail.com>
Date: Wed, 5 Feb 2025 00:24:23 +0530
Subject: [PATCH 12/19] Medicine administration UI (#10289)

---
 public/locale/en.json                         |  25 +-
 src/CAREUI/display/SubHeading.tsx             |  34 -
 src/Utils/request/api.tsx                     |   9 +
 .../AdministrationTab.tsx                     | 760 ++++++++++++++++++
 .../MedicineAdminDialog.tsx                   | 111 +++
 .../MedicineAdminForm.tsx                     | 422 ++++++++++
 .../MedicineAdminSheet.tsx                    | 287 +++++++
 .../MedicationAdministration/utils.ts         | 116 +++
 .../Medicine/MedicationRequestTable/index.tsx | 283 ++++---
 src/components/Medicine/MedicationsTable.tsx  |   2 +-
 .../Medicine/MultiValueSetSelect.tsx          |   1 +
 src/components/Medicine/utils.ts              |  14 +-
 .../QuestionTypes/DateTimeQuestion.tsx        |   3 +-
 .../Questionnaire/QuestionnaireEditor.tsx     |   6 +-
 src/components/Resource/ResourceList.tsx      |   2 +-
 src/components/ui/button.tsx                  |   2 +-
 src/components/ui/date-picker.tsx             |   3 +-
 src/components/ui/date-range-picker.tsx       |   3 +-
 .../locations/components/LocationCard.tsx     |   2 +-
 .../medicationAdministration.ts               |  96 +++
 .../medicationAdministrationApi.ts            |  20 +
 src/types/emr/medicationRequest.ts            |  15 +-
 .../medicationRequest/medicationRequestApi.ts |  16 +-
 23 files changed, 2050 insertions(+), 182 deletions(-)
 delete mode 100644 src/CAREUI/display/SubHeading.tsx
 create mode 100644 src/components/Medicine/MedicationAdministration/AdministrationTab.tsx
 create mode 100644 src/components/Medicine/MedicationAdministration/MedicineAdminDialog.tsx
 create mode 100644 src/components/Medicine/MedicationAdministration/MedicineAdminForm.tsx
 create mode 100644 src/components/Medicine/MedicationAdministration/MedicineAdminSheet.tsx
 create mode 100644 src/components/Medicine/MedicationAdministration/utils.ts
 create mode 100644 src/types/emr/medicationAdministration/medicationAdministration.ts
 create mode 100644 src/types/emr/medicationAdministration/medicationAdministrationApi.ts

diff --git a/public/locale/en.json b/public/locale/en.json
index 79525b6771b..fb0e5e3381d 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -242,7 +242,7 @@
   "SYSTEM__org_type__team": "Team",
   "Submit": "Submit",
   "TELEMEDICINE": "Telemedicine",
-  "TRANSPORTATION TO BE ARRANGED": "Transportation",
+  "TRANSPORTATION_TO_BE_ARRANGED": "Transportation",
   "URINATION_FREQUENCY__DECREASED": "Decreased",
   "URINATION_FREQUENCY__INCREASED": "Increased",
   "URINATION_FREQUENCY__NORMAL": "Normal",
@@ -265,7 +265,7 @@
   "VENTILATOR_MODE__VCV_short": "VCV",
   "VENTILATOR_MODE__VC_SIMV": "Volume Controlled SIMV (VC-SIMV)",
   "VENTILATOR_MODE__VC_SIMV_short": "VC-SIMV",
-  "View Facility": "View Facility",
+  "View_Facility": "View Facility",
   "aadhaar_number": "Aadhaar Number",
   "aadhaar_number_will_not_be_stored": "Aadhaar number will not be stored by CARE",
   "aadhaar_otp_send_error": "Failed to send OTP. Please try again later.",
@@ -319,6 +319,7 @@
   "add_spoke": "Add Spoke Facility",
   "add_tags": "Add Tags",
   "add_user": "Add User",
+  "added_on": "Added on",
   "additional_information": "Additional Information",
   "additional_instructions": "Additional Instructions",
   "address": "Address",
@@ -485,6 +486,7 @@
   "cancel_appointment": "Cancel Appointment",
   "cancel_appointment_warning": "This action cannot be undone. The appointment will be cancelled and the patient will be notified.",
   "cancelled": "Cancelled",
+  "cannot_go_before_prescription_date": "Cannot view slots before the earliest prescription date",
   "cannot_select_date_out_of_range": "Cannot select date out of range",
   "cannot_select_month_out_of_range": "Cannot select month out of range",
   "cannot_select_year_out_of_range": "Cannot select year out of range",
@@ -752,12 +754,14 @@
   "downloading": "Downloading",
   "downloading_abha_card": "Generating ABHA Card, Please hold on",
   "downloads": "Downloads",
+  "draft": "Draft",
   "drag_drop_image_to_upload": "Drag & drop image to upload",
   "duplicate_patient_record_birth_unknown": "Please contact your district care coordinator, the shifting facility or the patient themselves if you are not sure about the patient's year of birth.",
   "duplicate_patient_record_confirmation": "Admit the patient record to your facility by adding the year of birth",
   "duplicate_patient_record_rejection": "I confirm that the suspect / patient I want to create is not on the list.",
   "duration": "Duration",
   "edit": "Edit",
+  "edit_administration": "Edit Administration",
   "edit_avatar": "Edit Avatar",
   "edit_avatar_note": "Change the avatar of the user",
   "edit_avatar_note_self": "Change your avatar",
@@ -902,6 +906,9 @@
   "end_datetime": "End Date/Time",
   "end_dose": "End Dose",
   "end_time": "End Time",
+  "end_time_before_start_error": "End time cannot be before start time",
+  "end_time_future_error": "End time cannot be in the future",
+  "ended": "Ended",
   "enter_dosage_instructions": "Enter Dosage Instructions",
   "enter_file_name": "Enter File Name",
   "enter_message": "Start typing...",
@@ -1074,6 +1081,7 @@
   "icmr_specimen_referral_form": "ICMR Specimen Referral Form",
   "immunisation-records": "Immunisation",
   "in_consultation": "In-Consultation",
+  "in_progress": "In Progress",
   "inactive": "Inactive",
   "incoming": "Incoming",
   "incomplete_patient_details_warning": "Patient details are incomplete. Please update the details before proceeding.",
@@ -1140,6 +1148,7 @@
   "is_it_upshift": "is it upshift",
   "is_phone_a_whatsapp_number": "Is the phone number a WhatsApp number?",
   "is_pregnant": "Is pregnant",
+  "is_this_administration_for_a_past_time": "Is this administration for a past time",
   "is_this_an_emergency": "Is this an Emergency?",
   "is_this_an_emergency_request": "Is this an emergency request?",
   "is_this_an_upshift": "Is this an upshift?",
@@ -1255,8 +1264,10 @@
   "medical_records": "Medical Records",
   "medical_worker": "Medical Worker",
   "medication": "Medication",
+  "medication_administration_saved": "Medicine Administration saved",
   "medication_taken_between": "Medication Taken Between",
   "medicine": "Medicine",
+  "medicine_administration": "Medicine Administration",
   "medicine_administration_history": "Medicine Administration History",
   "medicine_prescription": "Medicine Prescription",
   "medicines_administered": "Medicine(s) administered",
@@ -1314,6 +1325,7 @@
   "next_sessions": "Next Sessions",
   "next_week_short": "Next wk",
   "no": "No",
+  "no_active_medications": "No active medications",
   "no_address_provided": "No address provided",
   "no_allergies_recorded": "No allergies recorded",
   "no_appointments": "No appointments found",
@@ -1350,6 +1362,7 @@
   "no_log_updates": "No log updates found",
   "no_medical_history_available": "No Medical History Available",
   "no_medications_found_for_this_encounter": "No medications found for this encounter.",
+  "no_medications_to_administer": "No medications to administer",
   "no_notices_for_you": "No notices for you.",
   "no_observations": "No Observations",
   "no_ongoing_medications": "No Ongoing Medications",
@@ -1398,6 +1411,7 @@
   "none": "None",
   "normal": "Normal",
   "noshow": "No-show",
+  "not_done": "Not Done",
   "not_eligible": "Not Eligible",
   "not_found": "Not Found",
   "not_specified": "Not Specified",
@@ -1548,6 +1562,7 @@
   "phone_number_not_found": "Phone number not found",
   "phone_number_validation_error": "Entered phone number is not valid",
   "phone_number_verified": "Phone Number Verified",
+  "pick_a_date": "Pick a date",
   "pincode": "Pincode",
   "pincode_autofill": "State and District auto-filled from Pincode",
   "pincode_district_auto_fill_error": "Failed to auto-fill district information",
@@ -1601,6 +1616,7 @@
   "practitioner_information": "Practitioner Information",
   "preferred_facility_type": "Preferred Facility Type",
   "preferred_vehicle": "Preferred Vehicle",
+  "prescribed": "Prescribed",
   "prescription": "Prescription",
   "prescription_details": "Prescription Details",
   "prescription_discontinued": "Prescription discontinued",
@@ -1836,6 +1852,7 @@
   "search_investigation_placeholder": "Search Investigation & Groups",
   "search_medication": "Search Medication",
   "search_medications": "Search for medications to add",
+  "search_medicine": "Search Medicine",
   "search_patient_page_text": "Search for existing patients using their phone number or create a new patient record",
   "search_patients": "Search Patients",
   "search_resource": "Search Resource",
@@ -1935,6 +1952,7 @@
   "shifting_details": "Shifting details",
   "shifting_history": "Shifting History",
   "shifting_status": "Shifting status",
+  "show": "Show",
   "show_abha_profile": "Show ABHA Profile",
   "show_all": "Show all",
   "show_all_notifications": "Show All",
@@ -1976,6 +1994,8 @@
   "start_new_clinical_encounter": "Start a new clinical encounter",
   "start_review": "Start Review",
   "start_time": "Start Time",
+  "start_time_before_authored_error": "Start time cannot be before the medication was prescribed",
+  "start_time_future_error": "Start time cannot be in the future",
   "start_time_must_be_before_end_time": "Start time must be before end time",
   "state": "State",
   "state_reason_for_archiving": "State reason for archiving <strong>{{name}}</strong> file?",
@@ -2010,6 +2030,7 @@
   "tachycardia": "Tachycardia",
   "tag_name": "Tag Name",
   "tag_slug": "Tag Slug",
+  "taken": "Taken",
   "taper_titrate_dosage": "Taper & Titrate Dosage",
   "target_dosage": "Target Dosage",
   "template_deleted": "Template has been deleted",
diff --git a/src/CAREUI/display/SubHeading.tsx b/src/CAREUI/display/SubHeading.tsx
deleted file mode 100644
index 67072fd9e02..00000000000
--- a/src/CAREUI/display/SubHeading.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import { ReactNode } from "react";
-
-import RecordMeta from "@/CAREUI/display/RecordMeta";
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-interface Props {
-  title: ReactNode;
-  lastModified?: string;
-  className?: string;
-  options?: ReactNode;
-}
-
-export default function SubHeading(props: Props) {
-  return (
-    <div className="flex flex-wrap items-center justify-between py-2">
-      <div className="flex items-center">
-        <span className="text-lg font-semibold leading-relaxed text-secondary-900">
-          {props.title}
-        </span>
-        {props.lastModified && (
-          <div className="ml-3 flex flex-row gap-2 text-xs font-medium text-secondary-600">
-            <CareIcon icon="l-history-alt" className="text-sm" />
-            <RecordMeta time={props.lastModified} prefix="Last modified" />
-          </div>
-        )}
-      </div>
-      {props.options && (
-        <div className="flex w-full flex-col gap-2 sm:w-auto sm:flex-row sm:justify-end">
-          {props.options}
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/src/Utils/request/api.tsx b/src/Utils/request/api.tsx
index 45eddeedb24..c6edaeb3fb6 100644
--- a/src/Utils/request/api.tsx
+++ b/src/Utils/request/api.tsx
@@ -17,6 +17,7 @@ import {
 import { PaginatedResponse } from "@/Utils/request/types";
 import { AppointmentPatientRegister } from "@/pages/Patient/Utils";
 import { Encounter, EncounterEditRequest } from "@/types/emr/encounter";
+import { MedicationAdministration } from "@/types/emr/medicationAdministration/medicationAdministration";
 import { MedicationStatement } from "@/types/emr/medicationStatement";
 import { PartialPatientModel, Patient } from "@/types/emr/newPatient";
 import {
@@ -649,6 +650,14 @@ const routes = {
       TRes: Type<PaginatedResponse<MedicationStatement>>(),
     },
   },
+
+  medicationAdministration: {
+    list: {
+      path: "/api/v1/patient/{patientId}/medication/administration/",
+      method: "GET",
+      TRes: Type<PaginatedResponse<MedicationAdministration>>(),
+    },
+  },
 } as const;
 
 export default routes;
diff --git a/src/components/Medicine/MedicationAdministration/AdministrationTab.tsx b/src/components/Medicine/MedicationAdministration/AdministrationTab.tsx
new file mode 100644
index 00000000000..39f477f6d65
--- /dev/null
+++ b/src/components/Medicine/MedicationAdministration/AdministrationTab.tsx
@@ -0,0 +1,760 @@
+"use client";
+
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { format, formatDistanceToNow } from "date-fns";
+import { t } from "i18next";
+import React, { useState } from "react";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import { Button } from "@/components/ui/button";
+import { Card } from "@/components/ui/card";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover";
+import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
+
+import Loading from "@/components/Common/Loading";
+import { EmptyState } from "@/components/Medicine/MedicationRequestTable";
+import { getFrequencyDisplay } from "@/components/Medicine/MedicationsTable";
+import { formatDosage } from "@/components/Medicine/utils";
+
+import routes from "@/Utils/request/api";
+import mutate from "@/Utils/request/mutate";
+import query from "@/Utils/request/query";
+import { formatName } from "@/Utils/utils";
+import {
+  MedicationAdministration,
+  MedicationAdministrationRequest,
+} from "@/types/emr/medicationAdministration/medicationAdministration";
+import { MedicationRequestRead } from "@/types/emr/medicationRequest";
+import medicationRequestApi from "@/types/emr/medicationRequest/medicationRequestApi";
+
+import { MedicineAdminDialog } from "./MedicineAdminDialog";
+import { MedicineAdminSheet } from "./MedicineAdminSheet";
+import {
+  STATUS_COLORS,
+  TIME_SLOTS,
+  createMedicationAdministrationRequest,
+} from "./utils";
+
+const ACTIVE_STATUSES = ["active", "on-hold", "draft", "unknown"] as const;
+const INACTIVE_STATUSES = [
+  "ended",
+  "completed",
+  "cancelled",
+  "entered_in_error",
+] as const;
+
+// Utility Functions
+function isTimeInSlot(
+  date: Date,
+  slot: { date: Date; start: string; end: string },
+): boolean {
+  const slotStartDate = new Date(slot.date);
+  const [startHour] = slot.start.split(":").map(Number);
+  const [endHour] = slot.end.split(":").map(Number);
+
+  slotStartDate.setHours(startHour, 0, 0, 0);
+  const slotEndDate = new Date(slotStartDate);
+  slotEndDate.setHours(endHour, 0, 0, 0);
+
+  return date >= slotStartDate && date < slotEndDate;
+}
+
+function getAdministrationsForTimeSlot(
+  administrations: MedicationAdministration[],
+  medicationId: string,
+  slotDate: Date,
+  start: string,
+  end: string,
+): MedicationAdministration[] {
+  return administrations.filter((admin) => {
+    const adminDate = new Date(admin.occurrence_period_start);
+    const slotStartDate = new Date(slotDate);
+    const slotEndDate = new Date(slotDate);
+
+    const [startHour] = start.split(":").map(Number);
+    const [endHour] = end.split(":").map(Number);
+
+    slotStartDate.setHours(startHour, 0, 0, 0);
+    slotEndDate.setHours(endHour, 0, 0, 0);
+
+    return (
+      admin.request === medicationId &&
+      adminDate >= slotStartDate &&
+      adminDate < slotEndDate
+    );
+  });
+}
+
+// Types and Interfaces
+interface AdministrationTabProps {
+  patientId: string;
+  encounterId: string;
+}
+
+interface TimeSlotHeaderProps {
+  slot: (typeof TIME_SLOTS)[number] & { date: Date };
+  isCurrentSlot: boolean;
+  isEndSlot: boolean;
+}
+
+interface MedicationStatusBadgeProps {
+  status: string;
+}
+
+interface MedicationBadgesProps {
+  medication: MedicationRequestRead;
+}
+
+interface MedicationRowProps {
+  medication: MedicationRequestRead;
+  visibleSlots: ((typeof TIME_SLOTS)[number] & { date: Date })[];
+  currentDate: Date;
+  administrations?: MedicationAdministration[];
+  onAdminister: (medication: MedicationRequestRead) => void;
+  onEditAdministration: (
+    medication: MedicationRequestRead,
+    admin: MedicationAdministration,
+  ) => void;
+  onDiscontinue: (medication: MedicationRequestRead) => void;
+}
+
+// Utility Components
+const MedicationStatusBadge: React.FC<MedicationStatusBadgeProps> = ({
+  status,
+}) => (
+  <span
+    className={`text-xs px-2 py-0.5 rounded-md font-medium ${
+      status === "active"
+        ? "text-emerald-900 bg-emerald-100"
+        : "text-gray-900 bg-gray-100"
+    }`}
+  >
+    {t(status)}
+  </span>
+);
+
+const MedicationBadges: React.FC<MedicationBadgesProps> = ({ medication }) => (
+  <div className="flex flex-wrap gap-2 mt-1">
+    <span className="text-xs text-blue-900 bg-blue-100 px-2 py-0.5 rounded-md font-medium">
+      {medication.dosage_instruction[0]?.route?.display || "Oral"}
+    </span>
+    {medication.dosage_instruction[0]?.as_needed_boolean && (
+      <span className="text-xs text-pink-900 bg-pink-100 px-2 py-0.5 rounded-md font-medium">
+        {t("as_needed_prn")}
+      </span>
+    )}
+    <MedicationStatusBadge status={medication.status} />
+  </div>
+);
+
+const TimeSlotHeader: React.FC<TimeSlotHeaderProps> = ({
+  slot,
+  isCurrentSlot,
+  isEndSlot,
+}) => {
+  const isFirstSlotOfDay = slot.start === "00:00";
+  const isLastSlotOfDay = slot.start === "18:00";
+
+  return (
+    <div className="h-14">
+      {isFirstSlotOfDay && (
+        <div className="flex items-center h-full ml-2">
+          <div className="flex flex-col items-center">
+            <div className="text-sm font-medium">
+              {format(slot.date, "dd MMM").toUpperCase()}
+            </div>
+            <div className="text-sm text-[#6b7280]">
+              {format(slot.date, "EEE")}
+            </div>
+          </div>
+          <div className="flex-1 border-t border-dotted border-gray-300 ml-2" />
+        </div>
+      )}
+      {!isFirstSlotOfDay && !isLastSlotOfDay && (
+        <div className="flex items-center h-full">
+          <div className="w-full border-t border-dotted border-gray-300" />
+        </div>
+      )}
+      {isLastSlotOfDay && (
+        <div className="flex items-center h-full mr-2">
+          <div className="flex-1 border-t border-dotted border-gray-300 mr-2" />
+          <div className="flex flex-col items-center">
+            <div className="text-sm font-medium">
+              {format(slot.date, "dd MMM").toUpperCase()}
+            </div>
+            <div className="text-sm text-[#6b7280]">
+              {format(slot.date, "EEE")}
+            </div>
+          </div>
+        </div>
+      )}
+      {isCurrentSlot && isEndSlot && (
+        <div className="absolute top-0 left-1/2 -translate-y-1/2 -translate-x-1/2">
+          <div className="h-2 w-2 rounded-full bg-blue-500" />
+        </div>
+      )}
+    </div>
+  );
+};
+
+const MedicationRow: React.FC<MedicationRowProps> = ({
+  medication,
+  visibleSlots,
+  currentDate,
+  administrations,
+  onAdminister,
+  onEditAdministration,
+  onDiscontinue,
+}) => {
+  return (
+    <React.Fragment>
+      <div className="p-4 border-t">
+        <div className="font-semibold truncate">
+          {medication.medication?.display}
+        </div>
+        <MedicationBadges medication={medication} />
+        <div className="text-xs mt-1 font-medium truncate">
+          {formatDosage(medication.dosage_instruction[0])},{" "}
+          {
+            getFrequencyDisplay(medication.dosage_instruction[0]?.timing)
+              ?.meaning
+          }
+        </div>
+        <div className="text-xs text-[#6b7280] mt-1 truncate">
+          {t("added_on")}:{" "}
+          {format(
+            new Date(medication.authored_on || medication.created_date),
+            "MMM dd, yyyy, hh:mm a",
+          )}
+        </div>
+      </div>
+
+      {visibleSlots.map((slot) => {
+        const administrationRecords = getAdministrationsForTimeSlot(
+          administrations || [],
+          medication.id,
+          slot.date,
+          slot.start,
+          slot.end,
+        );
+        const isCurrentSlot = isTimeInSlot(currentDate, slot);
+
+        return (
+          <div
+            key={`${format(slot.date, "yyyy-MM-dd")}-${slot.start}`}
+            className="p-4 border-t relative text-sm"
+          >
+            {administrationRecords?.map((admin) => {
+              const colorClass =
+                STATUS_COLORS[admin.status as keyof typeof STATUS_COLORS] ||
+                STATUS_COLORS.default;
+
+              return (
+                <div
+                  key={admin.id}
+                  className={`flex font-medium items-center gap-2 rounded-md p-2 mb-2 cursor-pointer justify-between border ${colorClass}`}
+                  onClick={() => onEditAdministration(medication, admin)}
+                >
+                  <div className="flex items-center gap-1">
+                    <CareIcon icon="l-check-circle" className="h-3 w-3" />
+                    {new Date(admin.occurrence_period_start).toLocaleTimeString(
+                      "en-US",
+                      {
+                        hour: "numeric",
+                        minute: "2-digit",
+                        hour12: true,
+                      },
+                    )}
+                  </div>
+                  {admin.note && (
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className={`h-4 w-4 hover:${colorClass} p-0`}
+                    >
+                      <CareIcon icon="l-notes" className="h-3 w-3" />
+                    </Button>
+                  )}
+                </div>
+              );
+            })}
+            {isCurrentSlot && medication.status === "active" && (
+              <Button
+                variant="outline"
+                size="sm"
+                className="w-full h-8 text-primary-800 border-primary-600 hover:bg-primary-100 font-semibold"
+                onClick={() => onAdminister(medication)}
+              >
+                {t("administer")}
+              </Button>
+            )}
+          </div>
+        );
+      })}
+
+      <div className="p-4 border-t flex justify-center">
+        {ACTIVE_STATUSES.includes(
+          medication.status as (typeof ACTIVE_STATUSES)[number],
+        ) && (
+          <Popover>
+            <PopoverTrigger asChild>
+              <Button variant="ghost" size="icon" className="h-6 w-6">
+                <CareIcon icon="l-ellipsis-h" className="h-4 w-4" />
+              </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-40 p-0">
+              <Button
+                variant="ghost"
+                className="w-full justify-start px-3 py-2 text-sm text-red-600 hover:text-red-600 hover:bg-red-50"
+                onClick={() => {
+                  onDiscontinue(medication);
+                  // Close the popover after clicking
+                  const button = document.activeElement as HTMLElement;
+                  button?.blur();
+                }}
+              >
+                <CareIcon icon="l-ban" className="mr-2 h-4 w-4" />
+                {t("discontinue")}
+              </Button>
+            </PopoverContent>
+          </Popover>
+        )}
+      </div>
+    </React.Fragment>
+  );
+};
+
+export const AdministrationTab: React.FC<AdministrationTabProps> = ({
+  patientId,
+  encounterId,
+}) => {
+  const currentDate = new Date();
+  const [endSlotDate, setEndSlotDate] = useState(currentDate);
+  const [showStopped, setShowStopped] = useState(false);
+  const [endSlotIndex, setEndSlotIndex] = useState(
+    Math.floor(currentDate.getHours() / 6),
+  );
+  // Calculate visible slots based on end slot
+  const visibleSlots = React.useMemo(() => {
+    const slots = [];
+    let currentIndex = endSlotIndex;
+    let currentDate = new Date(endSlotDate);
+
+    // Add slots from right to left
+    for (let i = 0; i < 4; i++) {
+      if (currentIndex < 0) {
+        currentIndex = 3;
+        currentDate = new Date(currentDate);
+        currentDate.setDate(currentDate.getDate() - 1);
+      }
+      slots.unshift({
+        ...TIME_SLOTS[currentIndex],
+        date: new Date(currentDate),
+      });
+      currentIndex--;
+    }
+    return slots;
+  }, [endSlotDate, endSlotIndex]);
+
+  // Queries
+  const { data: activeMedications, refetch: refetchActive } = useQuery({
+    queryKey: ["medication_requests_active", patientId],
+    queryFn: query(medicationRequestApi.list, {
+      pathParams: { patientId },
+      queryParams: {
+        encounter: encounterId,
+        limit: 100,
+        status: ACTIVE_STATUSES.join(","),
+      },
+    }),
+    enabled: !!patientId,
+  });
+
+  const { data: stoppedMedications, refetch: refetchStopped } = useQuery({
+    queryKey: ["medication_requests_stopped", patientId],
+    queryFn: query(medicationRequestApi.list, {
+      pathParams: { patientId },
+      queryParams: {
+        encounter: encounterId,
+        limit: 100,
+        status: INACTIVE_STATUSES.join(","),
+      },
+    }),
+    enabled: !!patientId,
+  });
+
+  const { data: administrations, refetch: refetchAdministrations } = useQuery({
+    queryKey: ["medication_administrations", patientId, visibleSlots],
+    queryFn: query(routes.medicationAdministration.list, {
+      pathParams: { patientId },
+      queryParams: {
+        encounter: encounterId,
+        limit: 100,
+        ...(visibleSlots.length > 0 && {
+          occurrence_period_start_after: (() => {
+            const firstSlot = visibleSlots[0];
+            const [startHour] = firstSlot.start.split(":").map(Number);
+            const date = new Date(firstSlot.date);
+            date.setHours(startHour, 0, 0, 0);
+            return format(date, "yyyy-MM-dd'T'HH:mm:ss");
+          })(),
+          occurrence_period_start_before: (() => {
+            const lastSlot = visibleSlots[visibleSlots.length - 1];
+            const [endHour] = lastSlot.end.split(":").map(Number);
+            const date = new Date(lastSlot.date);
+            date.setHours(endHour, 0, 0, 0);
+            return format(date, "yyyy-MM-dd'T'HH:mm:ss");
+          })(),
+        }),
+      },
+    }),
+    enabled: !!patientId && !!visibleSlots?.length,
+  });
+
+  // Get last administered date and last administered by for each medication
+  const lastAdministeredDetails = React.useMemo(() => {
+    return administrations?.results?.reduce<{
+      dates: Record<string, string>;
+      performers: Record<string, string>;
+    }>(
+      (acc, admin) => {
+        const existingDate = acc.dates[admin.request];
+        const adminDate = new Date(admin.occurrence_period_start);
+
+        if (!existingDate || adminDate > new Date(existingDate)) {
+          acc.dates[admin.request] = admin.occurrence_period_start;
+          acc.performers[admin.request] = admin.created_by
+            ? formatName(admin.created_by)
+            : "";
+        }
+
+        return acc;
+      },
+      { dates: {}, performers: {} },
+    );
+  }, [administrations?.results]);
+
+  // Calculate earliest authored date from all medications
+  const getEarliestAuthoredDate = (medications: MedicationRequestRead[]) => {
+    if (!medications?.length) return null;
+    return new Date(
+      Math.min(
+        ...medications.map((med) =>
+          new Date(med.authored_on || med.created_date).getTime(),
+        ),
+      ),
+    );
+  };
+
+  // Calculate if we can go back further based on the earliest slot and authored date
+  const canGoBack = React.useMemo(() => {
+    const medications = showStopped
+      ? [
+          ...(activeMedications?.results || []),
+          ...(stoppedMedications?.results || []),
+        ]
+      : activeMedications?.results || [];
+
+    const earliestAuthoredDate = getEarliestAuthoredDate(medications);
+    if (!earliestAuthoredDate || !visibleSlots.length) return true;
+
+    const firstSlotDate = new Date(visibleSlots[0].date);
+    const [startHour] = visibleSlots[0].start.split(":").map(Number);
+    firstSlotDate.setHours(startHour, 0, 0, 0);
+
+    return firstSlotDate > earliestAuthoredDate;
+  }, [activeMedications, stoppedMedications, showStopped, visibleSlots]);
+
+  // State for administration
+  const [selectedMedication, setSelectedMedication] =
+    useState<MedicationRequestRead | null>(null);
+  const [dialogOpen, setDialogOpen] = useState(false);
+  const [isSheetOpen, setIsSheetOpen] = useState(false);
+  const [administrationRequest, setAdministrationRequest] =
+    useState<MedicationAdministrationRequest | null>(null);
+
+  // Calculate last modified date
+  const lastModifiedDate = React.useMemo(() => {
+    if (!administrations?.results?.length) return null;
+
+    const sortedAdmins = [...administrations.results].sort(
+      (a, b) =>
+        new Date(b.occurrence_period_start).getTime() -
+        new Date(a.occurrence_period_start).getTime(),
+    );
+
+    return new Date(sortedAdmins[0].occurrence_period_start);
+  }, [administrations?.results]);
+
+  // Mutations
+  const { mutate: discontinueMedication } = useMutation({
+    mutationFn: mutate(medicationRequestApi.upsert, {
+      pathParams: { patientId },
+    }),
+    onSuccess: () => {
+      refetchActive();
+      refetchStopped();
+    },
+  });
+
+  // Handlers
+  const handlePreviousSlot = React.useCallback(() => {
+    if (!canGoBack) return;
+
+    const newEndSlotIndex = endSlotIndex - 1;
+    if (newEndSlotIndex < 0) {
+      setEndSlotIndex(3);
+      const newDate = new Date(endSlotDate);
+      newDate.setDate(newDate.getDate() - 1);
+      setEndSlotDate(newDate);
+    } else {
+      setEndSlotIndex(newEndSlotIndex);
+    }
+  }, [endSlotDate, endSlotIndex, canGoBack]);
+
+  const handleNextSlot = React.useCallback(() => {
+    const newEndSlotIndex = endSlotIndex + 1;
+    if (newEndSlotIndex > 3) {
+      setEndSlotIndex(0);
+      const newDate = new Date(endSlotDate);
+      newDate.setDate(newDate.getDate() + 1);
+      setEndSlotDate(newDate);
+    } else {
+      setEndSlotIndex(newEndSlotIndex);
+    }
+  }, [endSlotDate, endSlotIndex]);
+
+  const handleAdminister = React.useCallback(
+    (medication: MedicationRequestRead) => {
+      setAdministrationRequest(
+        createMedicationAdministrationRequest(medication, encounterId),
+      );
+      setSelectedMedication(medication);
+      setDialogOpen(true);
+    },
+    [encounterId],
+  );
+
+  const handleEditAdministration = React.useCallback(
+    (medication: MedicationRequestRead, admin: MedicationAdministration) => {
+      setAdministrationRequest({
+        id: admin.id,
+        request: admin.request,
+        encounter: admin.encounter,
+        note: admin.note || "",
+        occurrence_period_start: admin.occurrence_period_start,
+        occurrence_period_end: admin.occurrence_period_end,
+        status: admin.status,
+        medication: admin.medication,
+        dosage: admin.dosage,
+      });
+      setSelectedMedication(medication);
+      setDialogOpen(true);
+    },
+    [],
+  );
+
+  const handleDiscontinue = React.useCallback(
+    (medication: MedicationRequestRead) => {
+      discontinueMedication({
+        datapoints: [
+          {
+            ...medication,
+            status: "ended",
+            encounter: encounterId,
+          },
+        ],
+      });
+    },
+    [discontinueMedication, encounterId],
+  );
+
+  const medications = showStopped
+    ? [
+        ...(activeMedications?.results || []),
+        ...(stoppedMedications?.results || []),
+      ]
+    : activeMedications?.results || [];
+
+  if (!activeMedications || !stoppedMedications) {
+    return (
+      <div className="min-h-[200px] flex items-center justify-center">
+        <Loading />
+      </div>
+    );
+  }
+
+  if (!medications?.length) {
+    return (
+      <EmptyState
+        message={t("no_active_medications")}
+        description={t("no_medications_to_administer")}
+      />
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-2 m-2">
+      <div className="flex justify-end">
+        <Button
+          variant="outline"
+          className="text-emerald-600 border-emerald-600 hover:bg-emerald-50"
+          onClick={() => setIsSheetOpen(true)}
+        >
+          <CareIcon icon="l-plus" className="mr-2 h-4 w-4" />
+          {t("administer_medicine")}
+        </Button>
+      </div>
+
+      <ScrollArea className="w-full whitespace-nowrap rounded-md">
+        <Card className="w-full border-none shadow-none min-w-[640px]">
+          <div className="grid grid-cols-[minmax(200px,2fr),repeat(4,minmax(140px,1fr)),40px]">
+            {/* Top row without vertical borders */}
+            <div className="col-span-full grid grid-cols-subgrid">
+              <div className="flex items-center justify-between p-4 bg-gray-50 border-t border-gray-50">
+                <div className="flex items-center gap-2 whitespace-break-spaces">
+                  {lastModifiedDate && (
+                    <div className="text-xs text-[#6b7280]">
+                      {t("last_modified")}{" "}
+                      {formatDistanceToNow(lastModifiedDate)} {t("ago")}
+                    </div>
+                  )}
+                </div>
+                <div className="flex justify-end items-center bg-gray-50 rounded">
+                  <Button
+                    variant="outline"
+                    size="icon"
+                    className="h-8 w-8 text-gray-400 mr-2"
+                    onClick={handlePreviousSlot}
+                    disabled={!canGoBack}
+                    title={
+                      !canGoBack ? t("cannot_go_before_prescription_date") : ""
+                    }
+                  >
+                    <CareIcon icon="l-angle-left" className="h-4 w-4" />
+                  </Button>
+                </div>
+              </div>
+              {visibleSlots.map((slot) => (
+                <TimeSlotHeader
+                  key={`${format(slot.date, "yyyy-MM-dd")}-${slot.start}`}
+                  slot={slot}
+                  isCurrentSlot={isTimeInSlot(currentDate, slot)}
+                  isEndSlot={slot.date.getTime() === currentDate.getTime()}
+                />
+              ))}
+              <div className="flex justify-start items-center px-1 bg-gray-50">
+                <Button
+                  variant="outline"
+                  size="icon"
+                  className="h-8 w-8 text-gray-400"
+                  onClick={handleNextSlot}
+                  disabled={isTimeInSlot(currentDate, visibleSlots[3])}
+                >
+                  <CareIcon icon="l-angle-right" className="h-4 w-4" />
+                </Button>
+              </div>
+            </div>
+
+            {/* Main content with borders */}
+            <div className="col-span-full grid grid-cols-subgrid divide-x divide-[#e5e7eb] border-l border-r">
+              {/* Headers */}
+              <div className="p-4 font-medium text-sm border-t bg-[#F3F4F6] text-secondary-700">
+                {t("medicine")}:
+              </div>
+              {visibleSlots.map((slot, i) => (
+                <div
+                  key={`${format(slot.date, "yyyy-MM-dd")}-${slot.start}`}
+                  className="p-4 font-semibold text-xs text-center border-t relative bg-[#F3F4F6] text-secondary-700"
+                >
+                  {i === endSlotIndex &&
+                    slot.date.getTime() === currentDate.getTime() && (
+                      <div className="absolute top-0 left-1/2 -translate-y-1/2 -translate-x-1/2">
+                        <div className="h-2 w-2 rounded-full bg-blue-500" />
+                      </div>
+                    )}
+                  {slot.label}
+                </div>
+              ))}
+              <div className="border-t bg-[#F3F4F6]" />
+
+              {/* Medication rows */}
+              {medications?.map((medication) => (
+                <MedicationRow
+                  key={medication.id}
+                  medication={medication}
+                  visibleSlots={visibleSlots}
+                  currentDate={currentDate}
+                  administrations={administrations?.results}
+                  onAdminister={handleAdminister}
+                  onEditAdministration={handleEditAdministration}
+                  onDiscontinue={handleDiscontinue}
+                />
+              ))}
+            </div>
+          </div>
+
+          {stoppedMedications?.results?.length > 0 && (
+            <div
+              className="p-4 border-t border-[#e5e7eb] flex items-center gap-2 cursor-pointer hover:bg-gray-50"
+              onClick={() => setShowStopped(!showStopped)}
+            >
+              <CareIcon
+                icon={showStopped ? "l-eye-slash" : "l-eye"}
+                className="h-4 w-4"
+              />
+              <span className="text-sm underline">
+                {showStopped ? t("hide") : t("show")}{" "}
+                {`${stoppedMedications?.results?.length} ${t("stopped")}`}{" "}
+                {t("prescriptions")}
+              </span>
+            </div>
+          )}
+        </Card>
+        <ScrollBar orientation="horizontal" />
+      </ScrollArea>
+
+      {selectedMedication && administrationRequest && (
+        <MedicineAdminDialog
+          open={dialogOpen}
+          onOpenChange={(open) => {
+            setDialogOpen(open);
+            if (!open) {
+              setAdministrationRequest(null);
+              setSelectedMedication(null);
+              refetchAdministrations();
+            }
+          }}
+          medication={selectedMedication}
+          lastAdministeredDate={
+            lastAdministeredDetails?.dates[selectedMedication.id]
+          }
+          lastAdministeredBy={
+            lastAdministeredDetails?.performers[selectedMedication.id]
+          }
+          administrationRequest={administrationRequest}
+          patientId={patientId}
+        />
+      )}
+
+      <MedicineAdminSheet
+        open={isSheetOpen}
+        onOpenChange={(open) => {
+          setIsSheetOpen(open);
+          if (!open) {
+            refetchAdministrations();
+          }
+        }}
+        medications={medications}
+        lastAdministeredDates={lastAdministeredDetails?.dates}
+        patientId={patientId}
+        encounterId={encounterId}
+      />
+    </div>
+  );
+};
diff --git a/src/components/Medicine/MedicationAdministration/MedicineAdminDialog.tsx b/src/components/Medicine/MedicationAdministration/MedicineAdminDialog.tsx
new file mode 100644
index 00000000000..3668e4f84de
--- /dev/null
+++ b/src/components/Medicine/MedicationAdministration/MedicineAdminDialog.tsx
@@ -0,0 +1,111 @@
+"use client";
+
+import { useMutation } from "@tanstack/react-query";
+import { t } from "i18next";
+import React from "react";
+import { toast } from "sonner";
+
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+
+import mutate from "@/Utils/request/mutate";
+import { MedicationAdministrationRequest } from "@/types/emr/medicationAdministration/medicationAdministration";
+import medicationAdministrationApi from "@/types/emr/medicationAdministration/medicationAdministrationApi";
+import { MedicationRequestRead } from "@/types/emr/medicationRequest";
+
+import { MedicineAdminForm } from "./MedicineAdminForm";
+
+interface Props {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  medication: MedicationRequestRead;
+  lastAdministeredDate?: string;
+  lastAdministeredBy?: string;
+  administrationRequest: MedicationAdministrationRequest;
+  patientId: string;
+}
+
+export const MedicineAdminDialog = ({
+  open,
+  onOpenChange,
+  medication,
+  lastAdministeredDate,
+  lastAdministeredBy,
+  administrationRequest: initialRequest,
+  patientId,
+}: Props) => {
+  const [administrationRequest, setAdministrationRequest] =
+    React.useState<MedicationAdministrationRequest>(initialRequest);
+  const [isFormValid, setIsFormValid] = React.useState(true);
+
+  // Update state when initialRequest changes
+  React.useEffect(() => {
+    setAdministrationRequest(initialRequest);
+  }, [initialRequest]);
+
+  const { mutate: upsertAdministration, isPending } = useMutation({
+    mutationFn: mutate(
+      medicationAdministrationApi.upsertMedicationAdministration,
+      {
+        pathParams: { patientId: patientId },
+      },
+    ),
+    onSuccess: () => {
+      onOpenChange(false);
+      toast.success(t("medication_administration_saved"));
+    },
+  });
+
+  const handleSubmit = () => {
+    upsertAdministration({
+      datapoints: [administrationRequest],
+    });
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-[525px]">
+        <DialogHeader>
+          <div className="flex items-center justify-between">
+            <DialogTitle className="text-xl">
+              {administrationRequest.id
+                ? t("edit_administration")
+                : t("administer_medicine")}
+            </DialogTitle>
+          </div>
+        </DialogHeader>
+
+        <div className="py-4">
+          <MedicineAdminForm
+            formId="single"
+            medication={medication}
+            lastAdministeredDate={lastAdministeredDate}
+            lastAdministeredBy={lastAdministeredBy}
+            administrationRequest={administrationRequest}
+            onChange={setAdministrationRequest}
+            isValid={setIsFormValid}
+          />
+        </div>
+
+        <DialogFooter>
+          <Button variant="outline" onClick={() => onOpenChange(false)}>
+            {t("cancel")}
+          </Button>
+          <Button onClick={handleSubmit} disabled={isPending || !isFormValid}>
+            {isPending
+              ? t("saving")
+              : administrationRequest.id
+                ? t("update")
+                : t("administer_medicine")}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
diff --git a/src/components/Medicine/MedicationAdministration/MedicineAdminForm.tsx b/src/components/Medicine/MedicationAdministration/MedicineAdminForm.tsx
new file mode 100644
index 00000000000..62b48d65b65
--- /dev/null
+++ b/src/components/Medicine/MedicationAdministration/MedicineAdminForm.tsx
@@ -0,0 +1,422 @@
+"use client";
+
+import { format, formatDistanceToNow } from "date-fns";
+import { t } from "i18next";
+import React, { useEffect, useState } from "react";
+
+import { cn } from "@/lib/utils";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import { Button } from "@/components/ui/button";
+import { Calendar } from "@/components/ui/calendar";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+
+import { getFrequencyDisplay } from "@/components/Medicine/MedicationsTable";
+import { formatDosage } from "@/components/Medicine/utils";
+
+import { formatName } from "@/Utils/utils";
+import {
+  MEDICATION_ADMINISTRATION_STATUS,
+  MedicationAdministrationRequest,
+  MedicationAdministrationStatus,
+} from "@/types/emr/medicationAdministration/medicationAdministration";
+import { MedicationRequestRead } from "@/types/emr/medicationRequest";
+
+interface MedicineAdminFormProps {
+  medication: MedicationRequestRead;
+  lastAdministeredDate?: string;
+  lastAdministeredBy?: string;
+  administrationRequest: MedicationAdministrationRequest;
+  onChange: (request: MedicationAdministrationRequest) => void;
+  formId: string;
+  isValid?: (valid: boolean) => void;
+}
+
+export const MedicineAdminForm: React.FC<MedicineAdminFormProps> = ({
+  medication,
+  lastAdministeredDate,
+  lastAdministeredBy,
+  administrationRequest,
+  onChange,
+  formId,
+  isValid,
+}) => {
+  const [isPastTime, setIsPastTime] = useState(
+    administrationRequest.occurrence_period_start !==
+      administrationRequest.occurrence_period_end || !!administrationRequest.id,
+  );
+  const [startTimeError, setStartTimeError] = useState("");
+  const [endTimeError, setEndTimeError] = useState("");
+
+  const validateDateTime = (date: Date, isStartTime: boolean): string => {
+    const now = new Date();
+    const authoredOn = new Date(medication.authored_on);
+    const startTime = new Date(administrationRequest.occurrence_period_start);
+
+    if (date > now) {
+      return t(
+        isStartTime ? "start_time_future_error" : "end_time_future_error",
+      );
+    }
+
+    if (isStartTime) {
+      return date < authoredOn ? t("start_time_before_authored_error") : "";
+    }
+
+    return date < startTime ? t("end_time_before_start_error") : "";
+  };
+
+  // Validate and notify parent whenever times change
+  useEffect(() => {
+    if (
+      !administrationRequest.occurrence_period_start ||
+      !administrationRequest.occurrence_period_end
+    ) {
+      isValid?.(false);
+      return;
+    }
+
+    const startDate = new Date(administrationRequest.occurrence_period_start);
+    const endDate = new Date(administrationRequest.occurrence_period_end);
+
+    const startError = validateDateTime(startDate, true);
+    const endError = validateDateTime(endDate, false);
+
+    setStartTimeError(startError);
+    setEndTimeError(endError);
+
+    isValid?.(!startError && !endError);
+  }, [
+    administrationRequest.occurrence_period_start,
+    administrationRequest.occurrence_period_end,
+    isValid,
+    validateDateTime,
+  ]);
+
+  const handleDateChange = (newTime: string, isStartTime: boolean) => {
+    const date = new Date(newTime);
+
+    // Preserve existing time if available
+    const existingDateStr = isStartTime
+      ? administrationRequest.occurrence_period_start
+      : administrationRequest.occurrence_period_end;
+
+    if (existingDateStr) {
+      const existingDate = new Date(existingDateStr);
+      date.setHours(existingDate.getHours());
+      date.setMinutes(existingDate.getMinutes());
+    }
+
+    onChange({
+      ...administrationRequest,
+      ...(isStartTime
+        ? {
+            occurrence_period_start: date.toISOString(),
+            occurrence_period_end: date.toISOString(),
+          }
+        : {
+            occurrence_period_end: date.toISOString(),
+          }),
+    });
+  };
+
+  const formatTime = (date: string | undefined) => {
+    if (!date) return "";
+    try {
+      const dateObj = new Date(date);
+      if (isNaN(dateObj.getTime())) return "";
+      return `${dateObj.getHours().toString().padStart(2, "0")}:${dateObj
+        .getMinutes()
+        .toString()
+        .padStart(2, "0")}`;
+    } catch {
+      return "";
+    }
+  };
+
+  const handleTimeChange = (
+    event: React.ChangeEvent<HTMLInputElement>,
+    isStartTime: boolean,
+  ) => {
+    const [hours, minutes] = event.target.value.split(":").map(Number);
+    if (isNaN(hours) || isNaN(minutes)) return;
+
+    const dateStr = isStartTime
+      ? administrationRequest.occurrence_period_start
+      : administrationRequest.occurrence_period_end;
+
+    if (!dateStr) return;
+
+    const currentDate = new Date(dateStr);
+    if (isNaN(currentDate.getTime())) return;
+
+    currentDate.setHours(hours);
+    currentDate.setMinutes(minutes);
+
+    onChange({
+      ...administrationRequest,
+      ...(isStartTime
+        ? {
+            occurrence_period_start: currentDate.toISOString(),
+            occurrence_period_end: currentDate.toISOString(),
+          }
+        : {
+            occurrence_period_end: currentDate.toISOString(),
+          }),
+    });
+  };
+
+  return (
+    <div className="space-y-6">
+      <div className="space-y-1">
+        <h3 className="text-lg font-semibold">
+          {medication.medication?.display}
+        </h3>
+        {lastAdministeredDate && (
+          <p className="text-sm text-gray-500">
+            {t("last_administered")}{" "}
+            {formatDistanceToNow(new Date(lastAdministeredDate))} {t("ago")}{" "}
+            {t("by")} {formatName(medication.created_by)}
+          </p>
+        )}
+        <p className="text-sm text-gray-500">
+          {t("prescribed")}{" "}
+          {formatDistanceToNow(
+            new Date(medication.authored_on || medication.created_date),
+          )}{" "}
+          {t("ago")} {t("by")} {lastAdministeredBy}
+        </p>
+      </div>
+
+      <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+        <div>
+          <Label className="text-xs text-gray-500">{t("dosage")}</Label>
+          <p className="font-medium">
+            {formatDosage(medication.dosage_instruction[0])}
+          </p>
+        </div>
+        <div>
+          <Label className="text-xs text-gray-500">{t("frequency")}</Label>
+          <p className="font-medium">
+            {getFrequencyDisplay(medication.dosage_instruction[0]?.timing)
+              ?.meaning || "-"}
+          </p>
+        </div>
+        <div>
+          <Label className="text-xs text-gray-500">{t("route")}</Label>
+          <p className="font-medium">
+            {medication.dosage_instruction[0]?.route?.display || "Oral"}
+          </p>
+        </div>
+        <div>
+          <Label className="text-xs text-gray-500">{t("duration")}</Label>
+          <p className="font-medium">
+            {medication.dosage_instruction[0]?.timing?.repeat?.bounds_duration
+              ?.value || "-"}{" "}
+            {medication.dosage_instruction[0]?.timing?.repeat?.bounds_duration
+              ?.unit || ""}
+          </p>
+        </div>
+      </div>
+
+      <div className="space-y-2">
+        <Label>{t("status")}</Label>
+        <Select
+          value={administrationRequest.status}
+          onValueChange={(value: MedicationAdministrationStatus) =>
+            onChange({ ...administrationRequest, status: value })
+          }
+        >
+          <SelectTrigger>
+            <SelectValue placeholder={t("select_status")} />
+          </SelectTrigger>
+          <SelectContent>
+            {MEDICATION_ADMINISTRATION_STATUS.map((status) => (
+              <SelectItem key={status} value={status}>
+                {t(status)}
+              </SelectItem>
+            ))}
+          </SelectContent>
+        </Select>
+      </div>
+
+      <div className="space-y-2">
+        <Label>{t("administration_notes")}</Label>
+        <Input
+          name={`${formId}notes`}
+          value={administrationRequest.note || ""}
+          onChange={(e) =>
+            onChange({ ...administrationRequest, note: e.target.value })
+          }
+        />
+      </div>
+
+      {!administrationRequest.id && (
+        <div className="space-y-2">
+          <Label>{t("is_this_administration_for_a_past_time")}?</Label>
+          <RadioGroup
+            name={`${formId}isPastTime`}
+            value={isPastTime ? "yes" : "no"}
+            onValueChange={(newValue) => {
+              setIsPastTime(newValue === "yes");
+              if (newValue === "no") {
+                // Set both times to current time
+                const now = new Date().toISOString();
+                onChange({
+                  ...administrationRequest,
+                  occurrence_period_start: now,
+                  occurrence_period_end: now,
+                });
+              }
+            }}
+            className="flex gap-4"
+          >
+            <div className="flex items-center space-x-2">
+              <RadioGroupItem value="yes" id={`yes-${formId}`} />
+              <Label htmlFor={`yes-${formId}`}>{t("yes")}</Label>
+            </div>
+            <div className="flex items-center space-x-2">
+              <RadioGroupItem value="no" id={`no-${formId}`} />
+              <Label htmlFor={`no-${formId}`}>{t("no")}</Label>
+            </div>
+          </RadioGroup>
+        </div>
+      )}
+
+      <div className="space-y-2">
+        <Label>{t("start_time")}</Label>
+        <div className="flex gap-2">
+          <Popover>
+            <PopoverTrigger asChild>
+              <Button
+                variant="outline"
+                className={cn(
+                  "flex-1 justify-start text-left font-normal",
+                  !administrationRequest.occurrence_period_start &&
+                    "text-gray-500",
+                )}
+                disabled={!isPastTime || !!administrationRequest.id}
+              >
+                <CareIcon icon="l-calender" className="mr-2 h-4 w-4" />
+                {administrationRequest.occurrence_period_start
+                  ? format(
+                      new Date(administrationRequest.occurrence_period_start),
+                      "PPP",
+                    )
+                  : t("pick_a_date")}
+              </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-auto p-0" align="start">
+              <Calendar
+                mode="single"
+                selected={
+                  administrationRequest.occurrence_period_start
+                    ? new Date(administrationRequest.occurrence_period_start)
+                    : undefined
+                }
+                onSelect={(date) => {
+                  if (!date) return;
+                  handleDateChange(date.toISOString(), true);
+                }}
+                initialFocus
+                disabled={(date) => {
+                  const now = new Date();
+                  const encounterStart = new Date(medication.authored_on);
+                  return date < encounterStart || date > now;
+                }}
+              />
+            </PopoverContent>
+          </Popover>
+          <Input
+            type="time"
+            className="w-[150px]"
+            value={formatTime(administrationRequest.occurrence_period_start)}
+            onChange={(e) => handleTimeChange(e, true)}
+            disabled={!isPastTime || !!administrationRequest.id}
+          />
+        </div>
+        {startTimeError && (
+          <p className="text-sm text-red-500">{startTimeError}</p>
+        )}
+      </div>
+
+      <div className="space-y-2">
+        <Label>{t("end_time")}</Label>
+        <div className="flex gap-2">
+          <Popover>
+            <PopoverTrigger asChild>
+              <Button
+                variant="outline"
+                className={cn(
+                  "flex-1 justify-start text-left font-normal",
+                  !administrationRequest.occurrence_period_end &&
+                    "text-gray-500",
+                )}
+                disabled={
+                  !isPastTime ||
+                  (!!administrationRequest.id &&
+                    administrationRequest.status !== "in_progress")
+                }
+              >
+                <CareIcon icon="l-calender" className="mr-2 h-4 w-4" />
+                {administrationRequest.occurrence_period_end
+                  ? format(
+                      new Date(administrationRequest.occurrence_period_end),
+                      "PPP",
+                    )
+                  : t("pick_a_date")}
+              </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-auto p-0" align="start">
+              <Calendar
+                mode="single"
+                selected={
+                  administrationRequest.occurrence_period_end
+                    ? new Date(administrationRequest.occurrence_period_end)
+                    : undefined
+                }
+                onSelect={(date) => {
+                  if (!date) return;
+                  handleDateChange(date.toISOString(), false);
+                }}
+                initialFocus
+                disabled={(date) => {
+                  const now = new Date();
+                  const encounterStart = new Date(medication.authored_on);
+                  return date < encounterStart || date > now;
+                }}
+              />
+            </PopoverContent>
+          </Popover>
+          <Input
+            type="time"
+            className="w-[150px]"
+            value={formatTime(administrationRequest.occurrence_period_end)}
+            onChange={(e) => handleTimeChange(e, false)}
+            disabled={
+              !isPastTime ||
+              (!!administrationRequest.id &&
+                administrationRequest.status !== "in_progress")
+            }
+          />
+        </div>
+        {endTimeError && <p className="text-sm text-red-500">{endTimeError}</p>}
+      </div>
+    </div>
+  );
+};
diff --git a/src/components/Medicine/MedicationAdministration/MedicineAdminSheet.tsx b/src/components/Medicine/MedicationAdministration/MedicineAdminSheet.tsx
new file mode 100644
index 00000000000..80b212081c4
--- /dev/null
+++ b/src/components/Medicine/MedicationAdministration/MedicineAdminSheet.tsx
@@ -0,0 +1,287 @@
+"use client";
+
+import { useMutation } from "@tanstack/react-query";
+import { t } from "i18next";
+import { Search } from "lucide-react";
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import { toast } from "sonner";
+
+import { Button } from "@/components/ui/button";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Input } from "@/components/ui/input";
+import {
+  Sheet,
+  SheetContent,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+} from "@/components/ui/sheet";
+
+import mutate from "@/Utils/request/mutate";
+import { MedicationAdministrationRequest } from "@/types/emr/medicationAdministration/medicationAdministration";
+import medicationAdministrationApi from "@/types/emr/medicationAdministration/medicationAdministrationApi";
+import { MedicationRequestRead } from "@/types/emr/medicationRequest";
+
+import { MedicineAdminForm } from "./MedicineAdminForm";
+import { createMedicationAdministrationRequest } from "./utils";
+
+interface Props {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  medications: MedicationRequestRead[];
+  lastAdministeredDates?: Record<string, string>;
+  patientId: string;
+  encounterId: string;
+}
+
+interface MedicineListItemProps {
+  medicine: MedicationRequestRead;
+  isSelected: boolean;
+  onSelect: (checked: boolean) => void;
+  administrationRequest?: MedicationAdministrationRequest;
+  lastAdministeredDate?: string;
+  lastAdministeredBy?: string;
+  onAdministrationChange: (request: MedicationAdministrationRequest) => void;
+  isValid: (valid: boolean) => void;
+}
+
+const MedicineListItem = ({
+  medicine,
+  isSelected,
+  onSelect,
+  administrationRequest,
+  lastAdministeredDate,
+  lastAdministeredBy,
+  onAdministrationChange,
+  isValid,
+}: MedicineListItemProps) => {
+  const medicationDisplay = medicine.medication?.display;
+
+  return (
+    <div className="border-b border-border py-4">
+      <div className="flex items-start justify-between">
+        <div className="space-y-1">
+          <div className="flex items-center gap-2">
+            <span className="font-medium">{medicationDisplay}</span>
+            {medicine.dosage_instruction[0]?.as_needed_boolean && (
+              <span className="text-sm text-rose-500">
+                {t("as_needed_prn")}
+              </span>
+            )}
+          </div>
+        </div>
+        <Checkbox
+          checked={isSelected}
+          onCheckedChange={onSelect}
+          className="mt-1"
+          aria-label="Select for administration"
+        />
+      </div>
+
+      <div
+        className={`grid gap-4 overflow-hidden transition-all ${
+          isSelected ? "grid-rows-[1fr] mt-4" : "grid-rows-[0fr]"
+        }`}
+      >
+        <div className="min-h-0">
+          {isSelected && administrationRequest && (
+            <MedicineAdminForm
+              medication={medicine}
+              lastAdministeredDate={lastAdministeredDate}
+              lastAdministeredBy={lastAdministeredBy}
+              formId={medicine.id}
+              administrationRequest={administrationRequest}
+              onChange={onAdministrationChange}
+              isValid={isValid}
+            />
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export function MedicineAdminSheet({
+  open,
+  onOpenChange,
+  medications,
+  lastAdministeredDates,
+  patientId,
+  encounterId,
+}: Props) {
+  const [selectedMedicines, setSelectedMedicines] = useState<Set<string>>(
+    new Set(),
+  );
+  const [administrationRequests, setAdministrationRequests] = useState<
+    Record<string, MedicationAdministrationRequest>
+  >({});
+  const [formValidation, setFormValidation] = useState<Record<string, boolean>>(
+    {},
+  );
+  const [search, setSearch] = useState("");
+  const formRef = useRef<HTMLFormElement>(null);
+
+  const { mutate: upsertAdministrations, isPending } = useMutation({
+    mutationFn: mutate(
+      medicationAdministrationApi.upsertMedicationAdministration,
+      {
+        pathParams: { patientId },
+      },
+    ),
+    onSuccess: () => {
+      toast.success(t("medication_administration_saved"));
+      handleClose();
+    },
+  });
+
+  const filteredMedicines = medications.filter((medicine) => {
+    const display = medicine.medication?.display;
+    return (
+      typeof display === "string" &&
+      display.toLowerCase().includes(search.toLowerCase())
+    );
+  });
+
+  const handleSelect = useCallback(
+    (id: string, checked: boolean) => {
+      setSelectedMedicines((prev) => {
+        const next = new Set(prev);
+        if (checked) {
+          next.add(id);
+          const medicine = medications.find((m) => m.id === id);
+          if (medicine?.medication?.display) {
+            setAdministrationRequests((prev) => ({
+              ...prev,
+              [id]: createMedicationAdministrationRequest(
+                medicine,
+                encounterId,
+              ),
+            }));
+          }
+        } else {
+          next.delete(id);
+          setAdministrationRequests((prev) => {
+            const { [id]: _, ...rest } = prev;
+            return rest;
+          });
+        }
+        return next;
+      });
+    },
+    [medications, encounterId],
+  );
+
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const administrations = Array.from(selectedMedicines).map(
+      (id) => administrationRequests[id],
+    );
+    upsertAdministrations({
+      datapoints: administrations,
+    });
+  };
+
+  const handleClose = () => {
+    onOpenChange(false);
+    setSelectedMedicines(new Set());
+    setAdministrationRequests({});
+  };
+
+  const handleAdministrationChange = useCallback(
+    (medicineId: string, request: MedicationAdministrationRequest) => {
+      setAdministrationRequests((prev) => ({
+        ...prev,
+        [medicineId]: request,
+      }));
+    },
+    [],
+  );
+
+  const handleFormValidation = useCallback(
+    (medicineId: string, isValid: boolean) => {
+      setFormValidation((prev) => ({
+        ...prev,
+        [medicineId]: isValid,
+      }));
+    },
+    [],
+  );
+
+  const isAllFormsValid = useMemo(
+    () =>
+      Array.from(selectedMedicines).every((id) => formValidation[id] !== false),
+    [selectedMedicines, formValidation],
+  );
+
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent
+        side="right"
+        className="w-full sm:min-w-[44rem] max-w-2xl flex flex-col h-full pr-0"
+      >
+        <form
+          ref={formRef}
+          onSubmit={handleSubmit}
+          className="flex flex-col h-full"
+        >
+          <SheetHeader className="space-y-4 flex-shrink-0 mr-2">
+            <SheetTitle className="text-xl">
+              {t("administer_medicines")}
+            </SheetTitle>
+            <div className="relative">
+              <Search className="absolute left-2 top-2.5 h-4 w-4 text-gray-500" />
+              <Input
+                placeholder={t("search_medicine")}
+                value={search}
+                onChange={(e) => setSearch(e.target.value)}
+                className="pl-8"
+              />
+            </div>
+          </SheetHeader>
+
+          <div className="flex-1 overflow-y-auto mt-8">
+            <div className="space-y-2 pb-4 mr-2">
+              {filteredMedicines.map((medicine) => (
+                <MedicineListItem
+                  key={medicine.id}
+                  medicine={medicine}
+                  isSelected={selectedMedicines.has(medicine.id)}
+                  onSelect={(checked) => handleSelect(medicine.id, checked)}
+                  administrationRequest={administrationRequests[medicine.id]}
+                  lastAdministeredDate={lastAdministeredDates?.[medicine.id]}
+                  onAdministrationChange={(request) =>
+                    handleAdministrationChange(medicine.id, request)
+                  }
+                  isValid={(valid) => handleFormValidation(medicine.id, valid)}
+                />
+              ))}
+            </div>
+          </div>
+
+          <SheetFooter className="border-t pt-4 mr-2">
+            <div className="flex justify-between w-full">
+              <Button type="button" variant="outline" onClick={handleClose}>
+                {t("cancel")}
+              </Button>
+              <Button
+                type="submit"
+                className="bg-[#006D4C] hover:bg-[#006D4C]/90"
+                disabled={
+                  selectedMedicines.size === 0 || isPending || !isAllFormsValid
+                }
+                onClick={(e) => {
+                  e.preventDefault();
+                  handleSubmit(e as any);
+                }}
+              >
+                {isPending
+                  ? t("saving")
+                  : `${t("administer_medicines")} (${selectedMedicines.size})`}
+              </Button>
+            </div>
+          </SheetFooter>
+        </form>
+      </SheetContent>
+    </Sheet>
+  );
+}
diff --git a/src/components/Medicine/MedicationAdministration/utils.ts b/src/components/Medicine/MedicationAdministration/utils.ts
new file mode 100644
index 00000000000..377f2febb1d
--- /dev/null
+++ b/src/components/Medicine/MedicationAdministration/utils.ts
@@ -0,0 +1,116 @@
+import { format } from "date-fns";
+
+import { MedicationAdministrationRequest } from "@/types/emr/medicationAdministration/medicationAdministration";
+import { MedicationRequestRead } from "@/types/emr/medicationRequest";
+
+// Constants
+export const TIME_SLOTS = [
+  { label: "12:00 AM - 06:00 AM", start: "00:00", end: "06:00" },
+  { label: "06:00 AM - 12:00 PM", start: "06:00", end: "12:00" },
+  { label: "12:00 PM - 06:00 PM", start: "12:00", end: "18:00" },
+  { label: "06:00 PM - 12:00 AM", start: "18:00", end: "24:00" },
+] as const;
+
+export const STATUS_COLORS = {
+  completed: "bg-emerald-50 text-emerald-700 border-emerald-200",
+  in_progress: "bg-yellow-50 text-yellow-700 border-yellow-200",
+  default: "bg-red-50 text-red-700 border-red-200",
+} as const;
+
+// Utility Functions
+export function createMedicationAdministrationRequest(
+  medication: MedicationRequestRead,
+  encounterId: string,
+): MedicationAdministrationRequest {
+  return {
+    request: medication.id,
+    encounter: encounterId,
+    medication: {
+      code: medication.medication?.code,
+      display: medication.medication?.display,
+      system: medication.medication?.system,
+    },
+    occurrence_period_start: format(new Date(), "yyyy-MM-dd'T'HH:mm"),
+    occurrence_period_end: format(new Date(), "yyyy-MM-dd'T'HH:mm"),
+    note: "",
+    status: "completed",
+    dosage: {
+      site: medication.dosage_instruction[0]?.site,
+      route: medication.dosage_instruction[0]?.route,
+      method: medication.dosage_instruction[0]?.method,
+      dose: medication.dosage_instruction[0]?.dose_and_rate?.dose_quantity && {
+        value:
+          medication.dosage_instruction[0]?.dose_and_rate?.dose_quantity?.value,
+        unit: medication.dosage_instruction[0]?.dose_and_rate?.dose_quantity
+          ?.unit,
+      },
+    },
+  };
+}
+
+export function isTimeInSlot(
+  date: Date,
+  slot: { date: Date; start: string; end: string },
+): boolean {
+  const slotStartDate = new Date(slot.date);
+  const [startHour] = slot.start.split(":").map(Number);
+  const [endHour] = slot.end.split(":").map(Number);
+
+  slotStartDate.setHours(startHour, 0, 0, 0);
+  const slotEndDate = new Date(slotStartDate);
+  slotEndDate.setHours(endHour, 0, 0, 0);
+
+  return date >= slotStartDate && date < slotEndDate;
+}
+
+export function getAdministrationsForTimeSlot<
+  T extends {
+    occurrence_period_start: string;
+    request: string;
+  },
+>(
+  administrations: T[],
+  medicationId: string,
+  slotDate: Date,
+  start: string,
+  end: string,
+): T[] {
+  return administrations.filter((admin) => {
+    const adminDate = new Date(admin.occurrence_period_start);
+    const slotStartDate = new Date(slotDate);
+    const slotEndDate = new Date(slotDate);
+
+    const [startHour] = start.split(":").map(Number);
+    const [endHour] = end.split(":").map(Number);
+
+    slotStartDate.setHours(startHour, 0, 0, 0);
+    slotEndDate.setHours(endHour, 0, 0, 0);
+
+    return (
+      admin.request === medicationId &&
+      adminDate >= slotStartDate &&
+      adminDate < slotEndDate
+    );
+  });
+}
+
+export function getCurrentTimeSlotIndex(): number {
+  const hour = new Date().getHours();
+  if (hour < 6) return 0;
+  if (hour < 12) return 1;
+  if (hour < 18) return 2;
+  return 3;
+}
+
+export function getEarliestAuthoredDate(
+  medications: MedicationRequestRead[],
+): Date | null {
+  if (!medications?.length) return null;
+  return new Date(
+    Math.min(
+      ...medications.map((med) =>
+        new Date(med.authored_on || med.created_date).getTime(),
+      ),
+    ),
+  );
+}
diff --git a/src/components/Medicine/MedicationRequestTable/index.tsx b/src/components/Medicine/MedicationRequestTable/index.tsx
index 92210bf98b9..389093ae429 100644
--- a/src/components/Medicine/MedicationRequestTable/index.tsx
+++ b/src/components/Medicine/MedicationRequestTable/index.tsx
@@ -1,23 +1,54 @@
 import { useQuery } from "@tanstack/react-query";
+import { t } from "i18next";
 import { PencilIcon } from "lucide-react";
 import { Link } from "raviger";
 import { useState } from "react";
 
-import SubHeading from "@/CAREUI/display/SubHeading";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 
 import Loading from "@/components/Common/Loading";
+import { AdministrationTab } from "@/components/Medicine/MedicationAdministration/AdministrationTab";
 import { MedicationsTable } from "@/components/Medicine/MedicationsTable";
 
 import query from "@/Utils/request/query";
 import { MedicationRequestRead } from "@/types/emr/medicationRequest";
 import medicationRequestApi from "@/types/emr/medicationRequest/medicationRequestApi";
 
+interface EmptyStateProps {
+  searching?: boolean;
+  searchQuery?: string;
+  message?: string;
+  description?: string;
+}
+
+export const EmptyState = ({
+  searching,
+  searchQuery,
+  message,
+  description,
+}: EmptyStateProps) => (
+  <div className="flex min-h-[200px] flex-col items-center justify-center gap-4 p-8 text-center">
+    <div className="rounded-full bg-secondary/10 p-3">
+      <CareIcon icon="l-tablets" className="text-3xl text-gray-500" />
+    </div>
+    <div className="max-w-[200px] space-y-1">
+      <h3 className="font-medium">
+        {message || (searching ? "No matches found" : "No Prescriptions")}
+      </h3>
+      <p className="text-sm text-gray-500">
+        {description ||
+          (searching
+            ? `No medications match "${searchQuery}"`
+            : "No medications have been prescribed yet")}
+      </p>
+    </div>
+  </div>
+);
+
 interface Props {
   readonly?: boolean;
   facilityId: string;
@@ -26,22 +57,49 @@ interface Props {
 }
 
 export default function MedicationRequestTable({
-  facilityId,
   patientId,
   encounterId,
+  facilityId,
 }: Props) {
   const [searchQuery, setSearchQuery] = useState("");
+  const [showStopped, setShowStopped] = useState(false);
+
+  const { data: activeMedications, isLoading: loadingActive } = useQuery({
+    queryKey: ["medication_requests_active", patientId],
+    queryFn: query(medicationRequestApi.list, {
+      pathParams: { patientId: patientId },
+      queryParams: {
+        encounter: encounterId,
+        limit: 100,
+        status: ["active", "on-hold", "draft", "unknown"].join(","),
+      },
+    }),
+    enabled: !!patientId,
+  });
 
-  const { data: medications, isLoading: loading } = useQuery({
-    queryKey: ["medication_requests", patientId],
+  const { data: stoppedMedications, isLoading: loadingStopped } = useQuery({
+    queryKey: ["medication_requests_stopped", patientId],
     queryFn: query(medicationRequestApi.list, {
       pathParams: { patientId: patientId },
-      queryParams: { encounter: encounterId },
+      queryParams: {
+        encounter: encounterId,
+        limit: 100,
+        status: ["ended", "completed", "cancelled", "entered_in_error"].join(
+          ",",
+        ),
+      },
     }),
     enabled: !!patientId,
   });
 
-  const filteredMedications = medications?.results?.filter(
+  const medications = showStopped
+    ? [
+        ...(activeMedications?.results || []),
+        ...(stoppedMedications?.results || []),
+      ]
+    : activeMedications?.results || [];
+
+  const displayedMedications = medications.filter(
     (med: MedicationRequestRead) => {
       if (!searchQuery.trim()) return true;
       const searchTerm = searchQuery.toLowerCase().trim();
@@ -50,123 +108,114 @@ export default function MedicationRequestTable({
     },
   );
 
-  const activeMedications = filteredMedications?.filter(
-    (med: MedicationRequestRead) =>
-      ["active", "on_hold"].includes(med.status || ""),
-  );
-  const discontinuedMedications = filteredMedications?.filter(
-    (med: MedicationRequestRead) =>
-      !["active", "on_hold"].includes(med.status || ""),
-  );
-
-  const EmptyState = ({ searching }: { searching?: boolean }) => (
-    <div className="flex min-h-[200px] flex-col items-center justify-center gap-4 p-8 text-center">
-      <div className="rounded-full bg-secondary/10 p-3">
-        <CareIcon icon="l-tablets" className="text-3xl text-gray-500" />
-      </div>
-      <div className="max-w-[200px] space-y-1">
-        <h3 className="font-medium">
-          {searching ? "No matches found" : "No Prescriptions"}
-        </h3>
-        <p className="text-sm text-gray-500">
-          {searching
-            ? `No medications match "${searchQuery}"`
-            : "No medications have been prescribed yet"}
-        </p>
-      </div>
-    </div>
-  );
+  const isLoading = loadingActive || loadingStopped;
 
   return (
     <div className="space-y-2">
-      <SubHeading
-        title="Prescriptions"
-        options={
-          <div className="flex items-center gap-2">
-            <Button asChild variant="outline" size="sm">
-              <Link
-                href={`/facility/${facilityId}/patient/${patientId}/encounter/${encounterId}/questionnaire/medication_request`}
-              >
-                <PencilIcon />
-                Edit
-              </Link>
-            </Button>
-            <Button asChild variant="outline" size="sm">
-              <Link
-                href={`/facility/${facilityId}/encounter/${encounterId}/prescriptions/print`}
-              >
-                <CareIcon icon="l-print" className="mr-2" />
-                Print
-              </Link>
-            </Button>
-          </div>
-        }
-      />
-
-      <div className="rounded-lg border">
-        <div className="flex items-center gap-2 border-b p-2">
-          <CareIcon icon="l-search" className="text-lg text-gray-500" />
-          <input
-            type="text"
-            placeholder="Search medications..."
-            value={searchQuery}
-            onChange={(e) => setSearchQuery(e.target.value)}
-            className="flex-1 bg-transparent text-sm outline-none placeholder:text-gray-500"
-          />
-          {searchQuery && (
-            <Button
-              variant="ghost"
-              size="sm"
-              className="h-6 px-2 text-gray-500 hover:text-foreground"
-              onClick={() => setSearchQuery("")}
+      <div className="rounded-lg">
+        <Tabs defaultValue="prescriptions">
+          <TabsList className="bg-gray-200 py-0 w-fit ">
+            <TabsTrigger
+              value="prescriptions"
+              className="data-[state=active]:bg-white rounded-md px-4 font-semibold"
             >
-              <CareIcon icon="l-times" className="text-lg" />
-            </Button>
-          )}
-        </div>
-
-        {loading ? (
-          <div className="min-h-[200px] flex items-center justify-center">
-            <Loading />
-          </div>
-        ) : !medications?.results?.length ? (
-          <EmptyState />
-        ) : !filteredMedications?.length ? (
-          <EmptyState searching />
-        ) : (
-          <ScrollArea className="h-[calc(100vh-16rem)]">
-            <Tabs defaultValue="active" className="w-full">
-              <div className="border-b px-2">
-                <TabsList className="h-9">
-                  <TabsTrigger value="active" className="text-xs">
-                    Active{" "}
-                    <Badge variant="secondary" className="ml-2">
-                      {activeMedications?.length || 0}
-                    </Badge>
-                  </TabsTrigger>
-                  <TabsTrigger value="discontinued" className="text-xs">
-                    Discontinued{" "}
-                    <Badge variant="secondary" className="ml-2">
-                      {discontinuedMedications?.length || 0}
-                    </Badge>
-                  </TabsTrigger>
-                </TabsList>
-              </div>
+              {t("prescriptions")}
+            </TabsTrigger>
+            <TabsTrigger
+              value="administration"
+              className="data-[state=active]:bg-white rounded-md px-4 font-semibold"
+            >
+              {t("medicine_administration")}
+            </TabsTrigger>
+          </TabsList>
 
-              <div className="min-w-[800px]">
-                <TabsContent value="active" className="p-2">
-                  <MedicationsTable medications={activeMedications || []} />
-                </TabsContent>
-                <TabsContent value="discontinued" className="p-2">
-                  <MedicationsTable
-                    medications={discontinuedMedications || []}
+          <TabsContent value="prescriptions">
+            <div className="flex flex-col gap-2">
+              <div className="flex items-center justify-between p-2 gap-2">
+                <div className="flex items-center gap-2 flex-1">
+                  <CareIcon icon="l-search" className="text-lg text-gray-500" />
+                  <input
+                    type="text"
+                    placeholder={t("search_medications")}
+                    value={searchQuery}
+                    onChange={(e) => setSearchQuery(e.target.value)}
+                    className="flex-1 bg-transparent text-sm outline-none placeholder:text-gray-500"
                   />
-                </TabsContent>
+                  {searchQuery && (
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      className="h-6 px-2 text-gray-500 hover:text-foreground"
+                      onClick={() => setSearchQuery("")}
+                    >
+                      <CareIcon icon="l-times" className="text-lg" />
+                    </Button>
+                  )}
+                </div>
+                <div className="flex items-center gap-2">
+                  <Button asChild variant="outline" size="sm">
+                    <Link
+                      href={`/facility/${facilityId}/patient/${patientId}/encounter/${encounterId}/questionnaire/medication_request`}
+                    >
+                      <PencilIcon className="mr-2 h-4 w-4" />
+                      {t("edit")}
+                    </Link>
+                  </Button>
+                  <Button asChild variant="outline" size="sm">
+                    <Link
+                      href={`/facility/${facilityId}/encounter/${encounterId}/prescriptions/print`}
+                    >
+                      <CareIcon icon="l-print" className="mr-2" />
+                      {t("print")}
+                    </Link>
+                  </Button>
+                </div>
               </div>
-              <ScrollBar orientation="horizontal" />
-            </Tabs>
-          </ScrollArea>
-        )}
+
+              {isLoading ? (
+                <div className="min-h-[200px] flex items-center justify-center">
+                  <Loading />
+                </div>
+              ) : !medications.length ? (
+                <EmptyState />
+              ) : !displayedMedications.length ? (
+                <EmptyState searching searchQuery={searchQuery} />
+              ) : (
+                <ScrollArea className="h-[calc(100vh-16rem)]">
+                  <div className="min-w-[800px]">
+                    <div className="p-2">
+                      <MedicationsTable medications={displayedMedications} />
+                    </div>
+                    {!!stoppedMedications?.results?.length && (
+                      <div
+                        className="p-4 flex items-center gap-2 cursor-pointer hover:bg-gray-50"
+                        onClick={() => setShowStopped(!showStopped)}
+                      >
+                        <CareIcon
+                          icon={showStopped ? "l-eye-slash" : "l-eye"}
+                          className="h-4 w-4"
+                        />
+                        <span className="text-sm underline">
+                          {showStopped ? t("hide") : t("show")}{" "}
+                          {`${stoppedMedications?.results?.length} ${t("stopped")}`}{" "}
+                          {t("prescriptions")}
+                        </span>
+                      </div>
+                    )}
+                  </div>
+                  <ScrollBar orientation="horizontal" />
+                </ScrollArea>
+              )}
+            </div>
+          </TabsContent>
+
+          <TabsContent value="administration">
+            <AdministrationTab
+              patientId={patientId}
+              encounterId={encounterId}
+            />
+          </TabsContent>
+        </Tabs>
       </div>
     </div>
   );
diff --git a/src/components/Medicine/MedicationsTable.tsx b/src/components/Medicine/MedicationsTable.tsx
index 059e35bd4d4..05a8e82bada 100644
--- a/src/components/Medicine/MedicationsTable.tsx
+++ b/src/components/Medicine/MedicationsTable.tsx
@@ -19,7 +19,7 @@ import {
 
 import { formatDosage, formatSig } from "./utils";
 
-function getFrequencyDisplay(
+export function getFrequencyDisplay(
   timing?: MedicationRequestDosageInstruction["timing"],
 ) {
   if (!timing) return undefined;
diff --git a/src/components/Medicine/MultiValueSetSelect.tsx b/src/components/Medicine/MultiValueSetSelect.tsx
index f80415b8254..c3da4742235 100644
--- a/src/components/Medicine/MultiValueSetSelect.tsx
+++ b/src/components/Medicine/MultiValueSetSelect.tsx
@@ -55,6 +55,7 @@ export function MultiValueSetSelect({
           <Button
             variant="outline"
             role="combobox"
+            disabled={disabled}
             className={cn(
               "w-full justify-start h-auto min-h-10 py-2",
               "text-left",
diff --git a/src/components/Medicine/utils.ts b/src/components/Medicine/utils.ts
index d83f4b62c46..1a6a9c5f866 100644
--- a/src/components/Medicine/utils.ts
+++ b/src/components/Medicine/utils.ts
@@ -4,17 +4,15 @@ import { MedicationRequestDosageInstruction } from "@/types/emr/medicationReques
 export function formatDosage(instruction: MedicationRequestDosageInstruction) {
   if (!instruction.dose_and_rate) return "";
 
-  if (instruction.dose_and_rate.type === "calculated") {
-    const { dose_range } = instruction.dose_and_rate;
-    if (!dose_range) return "";
+  const { dose_range, dose_quantity } = instruction.dose_and_rate;
+  if (dose_range) {
     return `${dose_range.low.value}${dose_range.low.unit.display} - ${dose_range.high.value}${dose_range.high.unit.display}`;
+  } else if (dose_quantity) {
+    return `${dose_quantity.value} ${dose_quantity.unit.display}`;
   }
-
-  const { dose_quantity } = instruction.dose_and_rate;
-  if (!dose_quantity?.value || !dose_quantity.unit) return "";
-
-  return `${dose_quantity.value} ${dose_quantity.unit.display}`;
+  return "";
 }
+
 // Helper function to format dosage instructions in Rx style
 export function formatSig(instruction: MedicationRequestDosageInstruction) {
   const parts: string[] = [];
diff --git a/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx b/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx
index 7cc3e837c71..8eb00eb8f33 100644
--- a/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx
+++ b/src/components/Questionnaire/QuestionTypes/DateTimeQuestion.tsx
@@ -1,4 +1,5 @@
 import { format } from "date-fns";
+import { t } from "i18next";
 
 import { cn } from "@/lib/utils";
 
@@ -104,7 +105,7 @@ export function DateTimeQuestion({
             disabled={disabled}
           >
             <CareIcon icon="l-calender" className="mr-2 h-4 w-4" />
-            {currentValue ? format(currentValue, "PPP") : "Pick a date"}
+            {currentValue ? format(currentValue, "PPP") : t("pick_a_date")}
           </Button>
         </PopoverTrigger>
         <PopoverContent className="w-auto p-0" align="start">
diff --git a/src/components/Questionnaire/QuestionnaireEditor.tsx b/src/components/Questionnaire/QuestionnaireEditor.tsx
index 880d42b4547..6182d537a83 100644
--- a/src/components/Questionnaire/QuestionnaireEditor.tsx
+++ b/src/components/Questionnaire/QuestionnaireEditor.tsx
@@ -427,7 +427,7 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
                                 </Badge>
                               ))
                           ) : (
-                            <p className="text-sm text-muted-foreground">
+                            <p className="text-sm text-gray-500">
                               No organizations selected
                             </p>
                           )}
@@ -458,7 +458,7 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
                                       <Building className="h-4 w-4" />
                                       <span>{org.name}</span>
                                       {org.description && (
-                                        <span className="text-xs text-muted-foreground">
+                                        <span className="text-xs text-gray-500">
                                           - {org.description}
                                         </span>
                                       )}
@@ -507,7 +507,7 @@ export default function QuestionnaireEditor({ id }: QuestionnaireEditorProps) {
                       placeholder="unique-identifier-for-questionnaire"
                       className="font-mono"
                     />
-                    <p className="text-sm text-muted-foreground mt-1">
+                    <p className="text-sm text-gray-500 mt-1">
                       A unique URL-friendly identifier for this questionnaire
                     </p>
                   </div>
diff --git a/src/components/Resource/ResourceList.tsx b/src/components/Resource/ResourceList.tsx
index 7695828f7e2..1ba35b0effe 100644
--- a/src/components/Resource/ResourceList.tsx
+++ b/src/components/Resource/ResourceList.tsx
@@ -52,7 +52,7 @@ function EmptyState() {
         <CareIcon icon="l-folder-open" className="h-6 w-6 text-primary" />
       </div>
       <h3 className="text-lg font-semibold mb-1">{t("no_resources_found")}</h3>
-      <p className="text-sm text-muted-foreground mb-4">
+      <p className="text-sm text-gray-500 mb-4">
         {t("adjust_resource_filters")}
       </p>
     </Card>
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index b794b6a99fb..68c7071a3b0 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -42,7 +42,7 @@ const buttonVariants = cva(
       },
     },
     defaultVariants: {
-      variant: "default",
+      variant: "primary",
       size: "default",
     },
   },
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index 9e95c5473c6..bdd2f4e17ee 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -1,4 +1,5 @@
 import { format } from "date-fns";
+import { t } from "i18next";
 import { useState } from "react";
 
 import { cn } from "@/lib/utils";
@@ -46,7 +47,7 @@ export function DatePicker({ date, onChange, disabled }: DatePickerProps) {
                 <span className="hidden sm:block">{format(date, "PPP")}</span>
               </>
             ) : (
-              <span>Pick a date</span>
+              <span>{t("pick_a_date")}</span>
             )}
           </span>
         </Button>
diff --git a/src/components/ui/date-range-picker.tsx b/src/components/ui/date-range-picker.tsx
index ffbbf482bce..7c61ec94c2d 100644
--- a/src/components/ui/date-range-picker.tsx
+++ b/src/components/ui/date-range-picker.tsx
@@ -1,4 +1,5 @@
 import { format } from "date-fns";
+import { t } from "i18next";
 import * as React from "react";
 import { DateRange } from "react-day-picker";
 
@@ -51,7 +52,7 @@ export function DateRangePicker({
                 format(date.from, "LLL dd, y")
               )
             ) : (
-              <span>Pick a date</span>
+              <span>{t("pick_a_date")}</span>
             )}
           </Button>
         </PopoverTrigger>
diff --git a/src/pages/Facility/settings/locations/components/LocationCard.tsx b/src/pages/Facility/settings/locations/components/LocationCard.tsx
index 60a427a4945..e12d031d6f2 100644
--- a/src/pages/Facility/settings/locations/components/LocationCard.tsx
+++ b/src/pages/Facility/settings/locations/components/LocationCard.tsx
@@ -82,7 +82,7 @@ export function LocationCard({ location, onEdit, className }: Props) {
               <h3 className="truncate text-lg font-semibold">
                 {location.name}
               </h3>
-              <p className="text-sm text-muted-foreground">
+              <p className="text-sm text-gray-500">
                 {getLocationFormLabel(location.form)}
               </p>
 
diff --git a/src/types/emr/medicationAdministration/medicationAdministration.ts b/src/types/emr/medicationAdministration/medicationAdministration.ts
new file mode 100644
index 00000000000..a736846de4a
--- /dev/null
+++ b/src/types/emr/medicationAdministration/medicationAdministration.ts
@@ -0,0 +1,96 @@
+import { UserBareMinimum } from "@/components/Users/models";
+
+import { DosageQuantity } from "@/types/emr/medicationRequest";
+import { Code } from "@/types/questionnaire/code";
+import { Quantity } from "@/types/questionnaire/quantity";
+
+export const MEDICATION_ADMINISTRATION_STATUS = [
+  "completed",
+  "not_done",
+  "entered_in_error",
+  "stopped",
+  "in_progress",
+  "on_hold",
+  "unknown",
+  "cancelled",
+] as const;
+
+export type MedicationAdministrationStatus =
+  (typeof MEDICATION_ADMINISTRATION_STATUS)[number];
+
+export interface MedicationAdministration {
+  readonly id?: string;
+  status: MedicationAdministrationStatus;
+  status_reason?: Code;
+  category?: "inpatient" | "outpatient" | "community";
+
+  medication: Code;
+
+  authored_on?: string; // datetime
+  occurrence_period_start: string; // datetime
+  occurrence_period_end?: string; // datetime
+  recorded?: string; // datetime
+
+  encounter: string; // uuid
+  request: string; // uuid
+
+  performer?: {
+    actor: string; // uuid
+    function: "performer" | "verifier" | "witness";
+  }[];
+  dosage?: {
+    text?: string;
+    site?: Code;
+    route?: Code;
+    method?: Code;
+    dose?: DosageQuantity;
+    rate?: Quantity;
+  };
+
+  note?: string;
+
+  created_by?: UserBareMinimum;
+  updated_by?: UserBareMinimum;
+}
+
+export interface MedicationAdministrationRequest {
+  id?: string;
+  encounter: string;
+  request: string;
+  status: MedicationAdministrationStatus;
+  status_reason?: Code;
+  medication: Code;
+  occurrence_period_start: string;
+  occurrence_period_end?: string;
+  recorded?: string;
+  note?: string;
+  dosage?: {
+    text?: string;
+    site?: Code;
+    route?: Code;
+    method?: Code;
+    dose?: DosageQuantity;
+    rate?: Quantity;
+  };
+}
+
+export interface MedicationAdministrationRead {
+  id: string;
+  status: MedicationAdministrationStatus;
+  status_reason?: Code;
+  medication: Code;
+  occurrence_period_start: string;
+  occurrence_period_end?: string;
+  recorded?: string;
+  encounter: string;
+  request: string;
+  note?: string;
+  dosage?: {
+    text?: string;
+    site?: Code;
+    route?: Code;
+    method?: Code;
+    dose?: DosageQuantity;
+    rate?: Quantity;
+  };
+}
diff --git a/src/types/emr/medicationAdministration/medicationAdministrationApi.ts b/src/types/emr/medicationAdministration/medicationAdministrationApi.ts
new file mode 100644
index 00000000000..77e37c391e2
--- /dev/null
+++ b/src/types/emr/medicationAdministration/medicationAdministrationApi.ts
@@ -0,0 +1,20 @@
+import { HttpMethod, Type } from "@/Utils/request/api";
+import { PaginatedResponse } from "@/Utils/request/types";
+
+import {
+  MedicationAdministrationRead,
+  MedicationAdministrationRequest,
+} from "./medicationAdministration";
+
+export default {
+  listMedicationAdministrations: {
+    path: "/api/v1/patient/{patientId}/medication/administration/",
+    method: HttpMethod.GET,
+    TRes: Type<PaginatedResponse<MedicationAdministrationRead>>(),
+  },
+  upsertMedicationAdministration: {
+    path: "/api/v1/patient/{patientId}/medication/administration/upsert/",
+    method: HttpMethod.POST,
+    TRes: Type<MedicationAdministrationRequest[]>,
+  },
+};
diff --git a/src/types/emr/medicationRequest.ts b/src/types/emr/medicationRequest.ts
index 8bd49281e2a..7e84391378a 100644
--- a/src/types/emr/medicationRequest.ts
+++ b/src/types/emr/medicationRequest.ts
@@ -42,16 +42,23 @@ export const UCUM_TIME_UNITS = [
   "a",
 ] as const;
 
-export const MEDICATION_REQUEST_STATUS = [
+export const ACTIVE_MEDICATION_STATUSES = [
   "active",
   "on-hold",
+  "draft",
+  "unknown",
+] as const;
+
+export const INACTIVE_MEDICATION_STATUSES = [
   "ended",
-  "stopped",
   "completed",
   "cancelled",
   "entered_in_error",
-  "draft",
-  "unknown",
+] as const;
+
+export const MEDICATION_REQUEST_STATUS = [
+  ...ACTIVE_MEDICATION_STATUSES,
+  ...INACTIVE_MEDICATION_STATUSES,
 ] as const;
 
 export type MedicationRequestStatus =
diff --git a/src/types/emr/medicationRequest/medicationRequestApi.ts b/src/types/emr/medicationRequest/medicationRequestApi.ts
index 5fe8c146b1f..0aed189b863 100644
--- a/src/types/emr/medicationRequest/medicationRequestApi.ts
+++ b/src/types/emr/medicationRequest/medicationRequestApi.ts
@@ -1,14 +1,16 @@
-import { Type } from "@/Utils/request/api";
+import { HttpMethod, Type } from "@/Utils/request/api";
 import { PaginatedResponse } from "@/Utils/request/types";
 import { MedicationRequestRead } from "@/types/emr/medicationRequest";
 
-const medicationRequestApi = {
-  // Medication
+export default {
   list: {
     path: "/api/v1/patient/{patientId}/medication/request/",
-    method: "GET",
+    method: HttpMethod.GET,
     TRes: Type<PaginatedResponse<MedicationRequestRead>>(),
   },
-} as const;
-
-export default medicationRequestApi;
+  upsert: {
+    path: "/api/v1/patient/{patientId}/medication/request/upsert/",
+    method: HttpMethod.POST,
+    TRes: Type<MedicationRequestRead[]>,
+  },
+};

From aa7fad89e59a1627ad518d7b15e27abe14e883ab Mon Sep 17 00:00:00 2001
From: Amjith Titus <amjithtitus09@gmail.com>
Date: Wed, 5 Feb 2025 18:00:48 +0530
Subject: [PATCH 13/19] Logout API (#10416)

---
 src/Providers/AuthUserProvider.tsx | 17 ++++++++++++++++-
 src/Utils/request/api.tsx          |  6 ++++++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/Providers/AuthUserProvider.tsx b/src/Providers/AuthUserProvider.tsx
index 7b94ba73e4a..a0e9aefeac2 100644
--- a/src/Providers/AuthUserProvider.tsx
+++ b/src/Providers/AuthUserProvider.tsx
@@ -9,7 +9,8 @@ import { AuthUserContext } from "@/hooks/useAuthUser";
 
 import { LocalStorageKeys } from "@/common/constants";
 
-import routes from "@/Utils/request/api";
+import routes, { Type } from "@/Utils/request/api";
+import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import request from "@/Utils/request/request";
 import { TokenData } from "@/types/auth/otpToken";
@@ -85,6 +86,20 @@ export default function AuthUserProvider({
   };
 
   const signOut = useCallback(async () => {
+    const accessToken = localStorage.getItem(LocalStorageKeys.accessToken);
+    const refreshToken = localStorage.getItem(LocalStorageKeys.refreshToken);
+
+    if (accessToken && refreshToken) {
+      try {
+        await mutate({
+          ...routes.logout,
+          TRes: Type<Record<string, never>>(),
+        })({ access: accessToken, refresh: refreshToken });
+      } catch (error) {
+        console.error("Error during logout:", error);
+      }
+    }
+
     localStorage.removeItem(LocalStorageKeys.accessToken);
     localStorage.removeItem(LocalStorageKeys.refreshToken);
     localStorage.removeItem(LocalStorageKeys.patientTokenKey);
diff --git a/src/Utils/request/api.tsx b/src/Utils/request/api.tsx
index c6edaeb3fb6..9066aab0e1f 100644
--- a/src/Utils/request/api.tsx
+++ b/src/Utils/request/api.tsx
@@ -103,6 +103,12 @@ const routes = {
     TBody: Type<LoginCredentials>(),
   },
 
+  logout: {
+    path: "/api/v1/auth/logout/",
+    method: "POST",
+    TBody: Type<JwtTokenObtainPair>(),
+  },
+
   token_refresh: {
     path: "/api/v1/auth/token/refresh/",
     method: "POST",

From 66a90fb67643c3d3dfe9005c5f7f8b67b4d44d72 Mon Sep 17 00:00:00 2001
From: Khavin Shankar <khavinshankar@gmail.com>
Date: Wed, 5 Feb 2025 19:25:38 +0530
Subject: [PATCH 14/19] added PatientDetailsTabDemographyGeneralInfo plaggable
 (#10418)

---
 src/components/Facility/FacilityHome.tsx                | 2 +-
 src/components/Patient/PatientDetailsTab/Demography.tsx | 6 ++++++
 src/pluginTypes.ts                                      | 7 +++++++
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/components/Facility/FacilityHome.tsx b/src/components/Facility/FacilityHome.tsx
index 4856911d5e7..be79cce3c63 100644
--- a/src/components/Facility/FacilityHome.tsx
+++ b/src/components/Facility/FacilityHome.tsx
@@ -251,7 +251,7 @@ export const FacilityHome = ({ facilityId }: Props) => {
                     </div>
                   </div>
                   <div className="flex-shrink-0">
-                    <DropdownMenu>
+                    <DropdownMenu modal={false}>
                       <DropdownMenuTrigger asChild>
                         <Button
                           variant="secondary"
diff --git a/src/components/Patient/PatientDetailsTab/Demography.tsx b/src/components/Patient/PatientDetailsTab/Demography.tsx
index 956c55b1d87..bc5cb04ffb5 100644
--- a/src/components/Patient/PatientDetailsTab/Demography.tsx
+++ b/src/components/Patient/PatientDetailsTab/Demography.tsx
@@ -12,6 +12,7 @@ import { PatientProps } from "@/components/Patient/PatientDetailsTab";
 
 import { GENDER_TYPES } from "@/common/constants";
 
+import { PLUGIN_Component } from "@/PluginEngine";
 import { formatPatientAge } from "@/Utils/utils";
 import {
   Organization,
@@ -139,6 +140,11 @@ export const Demography = (props: PatientProps) => {
       id: "general-info",
       allowEdit: true,
       details: [
+        <PLUGIN_Component
+          key="patient_details_tab__demography__general_info"
+          __name="PatientDetailsTabDemographyGeneralInfo"
+          {...props}
+        />,
         { label: t("full_name"), value: patientData.name },
         {
           label: t("phone_number"),
diff --git a/src/pluginTypes.ts b/src/pluginTypes.ts
index 36d2bbb0467..f25c3aa7eb3 100644
--- a/src/pluginTypes.ts
+++ b/src/pluginTypes.ts
@@ -41,6 +41,12 @@ export type PatientRegistrationFormComponentType = React.FC<{
   patientId?: string;
 }>;
 
+export type PatientDetailsTabDemographyGeneralInfoComponentType = React.FC<{
+  facilityId: string;
+  patientId: string;
+  patientData: Patient;
+}>;
+
 // Define supported plugin components
 export type SupportedPluginComponents = {
   DoctorConnectButtons: DoctorConnectButtonComponentType;
@@ -49,6 +55,7 @@ export type SupportedPluginComponents = {
   PatientInfoCardActions: PatientInfoCardActionsComponentType;
   FacilityHomeActions: FacilityHomeActionsComponentType;
   PatientRegistrationForm: PatientRegistrationFormComponentType;
+  PatientDetailsTabDemographyGeneralInfo: PatientDetailsTabDemographyGeneralInfoComponentType;
 };
 
 // Create a type for lazy-loaded components

From eeff6d306c1daec63f9c8f4608dc410628636f89 Mon Sep 17 00:00:00 2001
From: Mahendar Chikolla <119734520+Mahendar0701@users.noreply.github.com>
Date: Wed, 5 Feb 2025 19:43:57 +0530
Subject: [PATCH 15/19] Fix : Cancelled requests in appointments page and
 Remove files button from actions (#10219)

---
 src/components/Patient/PatientHome.tsx      | 98 +++++++++++----------
 src/pages/Appointments/AppointmentsPage.tsx |  2 +
 2 files changed, 53 insertions(+), 47 deletions(-)

diff --git a/src/components/Patient/PatientHome.tsx b/src/components/Patient/PatientHome.tsx
index e3b8e0b28d8..1f47323204d 100644
--- a/src/components/Patient/PatientHome.tsx
+++ b/src/components/Patient/PatientHome.tsx
@@ -5,6 +5,12 @@ import { useTranslation } from "react-i18next";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
 import { Button } from "@/components/ui/button";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
 
 import { Avatar } from "@/components/Common/Avatar";
 import Loading from "@/components/Common/Loading";
@@ -17,7 +23,7 @@ import {
 import { PLUGIN_Component } from "@/PluginEngine";
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
-import { formatDateTime, formatPatientAge, relativeDate } from "@/Utils/utils";
+import { formatDateTime, formatPatientAge, relativeTime } from "@/Utils/utils";
 import { Patient } from "@/types/emr/newPatient";
 
 export const PatientHome = (props: {
@@ -139,7 +145,7 @@ export const PatientHome = (props: {
               />
             )}
           </div>
-          <div className="sticky top-20 mt-8 h-full lg:basis-1/6">
+          <div className="sticky top-20 mt-8 mx-4 md:mx-0 h-full lg:basis-1/6">
             <section className="mb-4 space-y-2 md:flex">
               <div className="w-full lg:mx-0">
                 <div className="font-semibold text-secondary-900">
@@ -148,21 +154,6 @@ export const PatientHome = (props: {
                 <div className="mt-2 h-full space-y-2">
                   <div className="space-y-3 text-left text-lg font-semibold text-secondary-900">
                     <div className="space-y-2">
-                      <Button
-                        className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
-                        id="upload-patient-files"
-                        onClick={() =>
-                          navigate(
-                            `/facility/${facilityId}/patient/${id}/files`,
-                          )
-                        }
-                      >
-                        <span className="flex w-full items-center justify-start gap-2">
-                          <CareIcon icon="l-file-upload" className="text-xl" />
-                          {t("view_update_patient_files")}
-                        </span>
-                      </Button>
-
                       <PLUGIN_Component
                         __name="PatientHomeActions"
                         patient={patientData}
@@ -178,49 +169,62 @@ export const PatientHome = (props: {
               id="actions"
               className="my-2 flex h-full flex-col justify-between space-y-2"
             >
-              <div className="my-1 rounded-sm p-2">
+              <div className="my-1 rounded-sm py-2">
                 <div>
-                  <div className="text-xs font-normal text-gray-600">
-                    {t("last_updated_by")}{" "}
-                    <span className="font-semibold text-gray-900">
+                  <div className="text-xs font-normal leading-5 text-gray-600">
+                    {t("last_updated_by")}
+                    <div className="font-semibold text-gray-900">
                       {patientData.updated_by?.first_name}{" "}
                       {patientData.updated_by?.last_name}
-                    </span>
-                  </div>
-                  <div className="whitespace-normal text-sm font-semibold text-gray-900">
-                    <div className="tooltip">
-                      <span className={`tooltip-text tooltip`}>
-                        {patientData.modified_date
-                          ? formatDateTime(patientData.modified_date)
-                          : "--:--"}
-                      </span>
-                      {patientData.modified_date
-                        ? relativeDate(patientData.modified_date)
-                        : "--:--"}
                     </div>
                   </div>
+
+                  <div className="whitespace-normal text-xs font-normal text-gray-900">
+                    {patientData.modified_date ? (
+                      <TooltipProvider delayDuration={1}>
+                        <Tooltip>
+                          <TooltipTrigger asChild>
+                            <span>
+                              {relativeTime(patientData.modified_date)}
+                            </span>
+                          </TooltipTrigger>
+                          <TooltipContent>
+                            {formatDateTime(patientData.modified_date)}
+                          </TooltipContent>
+                        </Tooltip>
+                      </TooltipProvider>
+                    ) : (
+                      "--:--"
+                    )}
+                  </div>
                 </div>
 
                 <div className="mt-4">
                   <div className="text-xs font-normal leading-5 text-gray-600">
-                    {t("patient_profile_created_by")}{" "}
-                    <span className="font-semibold text-gray-900">
+                    {t("patient_profile_created_by")}
+                    <div className="font-semibold text-gray-900">
                       {patientData.created_by?.first_name}{" "}
                       {patientData.created_by?.last_name}
-                    </span>
-                  </div>
-                  <div className="whitespace-normal text-sm font-semibold text-gray-900">
-                    <div className="tooltip">
-                      <span className={`tooltip-text tooltip`}>
-                        {patientData.created_date
-                          ? formatDateTime(patientData.created_date)
-                          : "--:--"}
-                      </span>
-                      {patientData.created_date
-                        ? relativeDate(patientData.created_date)
-                        : "--:--"}
                     </div>
                   </div>
+                  <div className="whitespace-normal text-xs font-normal text-gray-900">
+                    {patientData.created_date ? (
+                      <TooltipProvider delayDuration={1}>
+                        <Tooltip>
+                          <TooltipTrigger asChild>
+                            <span>
+                              {relativeTime(patientData.created_date)}
+                            </span>
+                          </TooltipTrigger>
+                          <TooltipContent>
+                            {formatDateTime(patientData.created_date)}
+                          </TooltipContent>
+                        </Tooltip>
+                      </TooltipProvider>
+                    ) : (
+                      "--:--"
+                    )}
+                  </div>
                 </div>
               </div>
             </div>
diff --git a/src/pages/Appointments/AppointmentsPage.tsx b/src/pages/Appointments/AppointmentsPage.tsx
index 6b939f54fac..5b227bdbe9b 100644
--- a/src/pages/Appointments/AppointmentsPage.tsx
+++ b/src/pages/Appointments/AppointmentsPage.tsx
@@ -677,6 +677,7 @@ function AppointmentColumn(props: {
         date_before: props.date_to,
       },
     }),
+    enabled: !!props.date_from && !!props.date_to,
   });
 
   let appointments = data?.results ?? [];
@@ -801,6 +802,7 @@ function AppointmentRow(props: {
         date_before: props.date_to,
       },
     }),
+    enabled: !!props.date_from && !!props.date_to,
   });
 
   let appointments = data?.results ?? [];

From 6bf2f6161c547a2a851d81e2327a1cdec5640745 Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Wed, 5 Feb 2025 14:14:25 +0000
Subject: [PATCH 16/19] API Erorr Handler: early exit if error can be silenced
 (#10409)

---
 src/Utils/request/errorHandler.ts | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/Utils/request/errorHandler.ts b/src/Utils/request/errorHandler.ts
index e83973cfeeb..8d07981307d 100644
--- a/src/Utils/request/errorHandler.ts
+++ b/src/Utils/request/errorHandler.ts
@@ -6,7 +6,8 @@ import * as Notifications from "@/Utils/Notifications";
 import { HTTPError, StructuredError } from "@/Utils/request/types";
 
 export function handleHttpError(error: Error) {
-  if (error.name === "AbortError") {
+  // Skip handling silent errors and AbortError
+  if (("silent" in error && error.silent) || error.name === "AbortError") {
     return;
   }
 
@@ -15,10 +16,6 @@ export function handleHttpError(error: Error) {
     return;
   }
 
-  if (error.silent) {
-    return;
-  }
-
   const cause = error.cause;
 
   if (isNotFound(error)) {

From a69c25e5b91df14b00cf3af0ea21d6c31545dedb Mon Sep 17 00:00:00 2001
From: Amjith Titus <amjithtitus09@gmail.com>
Date: Wed, 5 Feb 2025 19:44:58 +0530
Subject: [PATCH 17/19] Questionnaire hide tooltip (#10408)

---
 src/components/Questionnaire/QuestionTypes/QuestionGroup.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Questionnaire/QuestionTypes/QuestionGroup.tsx b/src/components/Questionnaire/QuestionTypes/QuestionGroup.tsx
index d38be63abcb..37c95e324c6 100644
--- a/src/components/Questionnaire/QuestionTypes/QuestionGroup.tsx
+++ b/src/components/Questionnaire/QuestionTypes/QuestionGroup.tsx
@@ -119,7 +119,7 @@ export const QuestionGroup = memo(function QuestionGroup({
 
   return (
     <div
-      title="group_styling"
+      data-cy="group_styling"
       className={cn(
         "space-y-4 rounded-lg",
         isActive && "ring-2 ring-primary",
@@ -135,7 +135,7 @@ export const QuestionGroup = memo(function QuestionGroup({
         </div>
       )}
       <div
-        title="group_container_styling"
+        data-cy="group_container_styling"
         className={cn(
           "gap-2",
           question.styling_metadata?.containerClasses &&

From 6bee9ac66f74e941e9876325beb644edb023791e Mon Sep 17 00:00:00 2001
From: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
Date: Wed, 5 Feb 2025 19:45:13 +0530
Subject: [PATCH 18/19] new test for assign a user to a patient (#10394)

---
 .../e2e/patient_spec/patient_creation.cy.ts   |  5 +-
 .../e2e/patient_spec/patient_details.cy.ts    | 35 +++++++++++
 .../pageObject/Patients/PatientDashboard.ts   |  8 ---
 cypress/pageObject/Patients/PatientDetails.ts | 61 +++++++++++++++++++
 .../pageObject/Patients/PatientEncounter.ts   |  5 ++
 .../PatientDetailsTab/PatientUsers.tsx        | 16 +++--
 src/components/Patient/PatientHome.tsx        |  1 +
 7 files changed, 115 insertions(+), 16 deletions(-)
 create mode 100644 cypress/e2e/patient_spec/patient_details.cy.ts
 delete mode 100644 cypress/pageObject/Patients/PatientDashboard.ts
 create mode 100644 cypress/pageObject/Patients/PatientDetails.ts

diff --git a/cypress/e2e/patient_spec/patient_creation.cy.ts b/cypress/e2e/patient_spec/patient_creation.cy.ts
index 9cec5afc0fd..8f2c1606c38 100644
--- a/cypress/e2e/patient_spec/patient_creation.cy.ts
+++ b/cypress/e2e/patient_spec/patient_creation.cy.ts
@@ -8,7 +8,6 @@ import {
   PatientFormData,
   patientCreation,
 } from "@/pageObject/Patients/PatientCreation";
-import { patientDashboard } from "@/pageObject/Patients/PatientDashboard";
 import { PatientEncounter } from "@/pageObject/Patients/PatientEncounter";
 import { patientVerify } from "@/pageObject/Patients/PatientVerify";
 import { FacilityCreation } from "@/pageObject/facility/FacilityCreation";
@@ -126,7 +125,7 @@ describe("Patient Management", () => {
         .clickSubmitEncounter()
         .assertEncounterCreationSuccess();
 
-      patientDashboard.verifyEncounterPatientInfo([
+      patientEncounter.verifyEncounterPatientInfo([
         ENCOUNTER_TYPE,
         ENCOUNTER_STATUS,
         ENCOUNTER_PRIORITY,
@@ -154,7 +153,7 @@ describe("Patient Management", () => {
       .clickSubmitEncounter()
       .assertEncounterCreationSuccess();
 
-    patientDashboard.verifyEncounterPatientInfo([
+    patientEncounter.verifyEncounterPatientInfo([
       ENCOUNTER_TYPE,
       ENCOUNTER_STATUS,
       ENCOUNTER_PRIORITY,
diff --git a/cypress/e2e/patient_spec/patient_details.cy.ts b/cypress/e2e/patient_spec/patient_details.cy.ts
new file mode 100644
index 00000000000..0f8d9c897a9
--- /dev/null
+++ b/cypress/e2e/patient_spec/patient_details.cy.ts
@@ -0,0 +1,35 @@
+import { PatientDetails } from "@/pageObject/Patients/PatientDetails";
+import { PatientEncounter } from "@/pageObject/Patients/PatientEncounter";
+import { FacilityCreation } from "@/pageObject/facility/FacilityCreation";
+
+const facilityCreation = new FacilityCreation();
+const patientEncounter = new PatientEncounter();
+const patientDetails = new PatientDetails();
+
+describe("Patient Management", () => {
+  beforeEach(() => {
+    cy.loginByApi("doctor");
+    cy.visit("/");
+  });
+
+  it("Assign users to a patient", () => {
+    const userName = "nihal-nurse";
+    const userRole = "Nurse";
+    facilityCreation.selectFacility("GHC Trikaripur");
+    patientEncounter
+      .navigateToEncounters()
+      .openFirstEncounterDetails()
+      .clickPatientDetailsButton();
+    patientDetails
+      .clickUsersTab()
+      .clickAssignUserButton()
+      .selectUserToAssign(userName)
+      .selectUserRole(userRole)
+      .confirmUserAssignment()
+      .verifyUserAssignmentSuccess()
+      .verifyUserContent([userName])
+      .clickRemoveUserButton()
+      .confirmUserRemoval()
+      .verifyUserRemovalSuccess();
+  });
+});
diff --git a/cypress/pageObject/Patients/PatientDashboard.ts b/cypress/pageObject/Patients/PatientDashboard.ts
deleted file mode 100644
index 9d608b17ea6..00000000000
--- a/cypress/pageObject/Patients/PatientDashboard.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-class PatientDashboard {
-  verifyEncounterPatientInfo(contents: string[]) {
-    cy.verifyContentPresence("#patient-infobadges", contents);
-    return this;
-  }
-}
-
-export const patientDashboard = new PatientDashboard();
diff --git a/cypress/pageObject/Patients/PatientDetails.ts b/cypress/pageObject/Patients/PatientDetails.ts
new file mode 100644
index 00000000000..1a5c2979fac
--- /dev/null
+++ b/cypress/pageObject/Patients/PatientDetails.ts
@@ -0,0 +1,61 @@
+export class PatientDetails {
+  clickUsersTab() {
+    cy.verifyAndClickElement('[data-cy="tab-users"]', "Users");
+    return this;
+  }
+
+  clickAssignUserButton() {
+    cy.verifyAndClickElement('[data-cy="assign-user-button"]', "Assign User");
+    return this;
+  }
+
+  selectUserToAssign(username: string) {
+    cy.typeAndSelectOption(
+      '[data-cy="patient-user-selector-container"]',
+      username,
+      false,
+    );
+    return this;
+  }
+
+  selectUserRole(role: string) {
+    cy.clickAndSelectOption('[data-cy="patient-user-role-select"]', role);
+    return this;
+  }
+
+  confirmUserAssignment() {
+    cy.verifyAndClickElement(
+      '[data-cy="patient-user-assign-button"]',
+      "Assign to Patient",
+    );
+    return this;
+  }
+
+  verifyUserAssignmentSuccess() {
+    cy.verifyNotification("User added to patient successfully");
+    return this;
+  }
+
+  clickRemoveUserButton() {
+    cy.get('[data-cy="patient-user-remove-button"]').first().click();
+    return this;
+  }
+
+  confirmUserRemoval() {
+    cy.verifyAndClickElement(
+      '[data-cy="patient-user-remove-confirm-button"]',
+      "Remove",
+    );
+    return this;
+  }
+
+  verifyUserContent(expectedTexts: string[]) {
+    cy.verifyContentPresence('[data-cy="patient-users"]', expectedTexts);
+    return this;
+  }
+
+  verifyUserRemovalSuccess() {
+    cy.verifyNotification("User removed successfully");
+    return this;
+  }
+}
diff --git a/cypress/pageObject/Patients/PatientEncounter.ts b/cypress/pageObject/Patients/PatientEncounter.ts
index fd8dd325572..95e3b8c1fe0 100644
--- a/cypress/pageObject/Patients/PatientEncounter.ts
+++ b/cypress/pageObject/Patients/PatientEncounter.ts
@@ -22,6 +22,11 @@ export class PatientEncounter {
     return this;
   }
 
+  verifyEncounterPatientInfo(contents: string[]) {
+    cy.verifyContentPresence("#patient-infobadges", contents);
+    return this;
+  }
+
   // Questionnaire actions
   addQuestionnaire(questionnaireName: string) {
     cy.get('[data-cy="add-questionnaire-button"]').click();
diff --git a/src/components/Patient/PatientDetailsTab/PatientUsers.tsx b/src/components/Patient/PatientDetailsTab/PatientUsers.tsx
index 5e6f00494ab..5f0e90e8297 100644
--- a/src/components/Patient/PatientDetailsTab/PatientUsers.tsx
+++ b/src/components/Patient/PatientDetailsTab/PatientUsers.tsx
@@ -103,7 +103,7 @@ function AddUserSheet({ patientId }: AddUserSheetProps) {
   return (
     <Sheet open={open} onOpenChange={setOpen}>
       <SheetTrigger asChild>
-        <Button variant="outline_primary">
+        <Button variant="outline_primary" data-cy="assign-user-button">
           <CareIcon icon="l-plus" className="mr-2 h-4 w-4" />
           {t("assign_user")}
         </Button>
@@ -114,7 +114,7 @@ function AddUserSheet({ patientId }: AddUserSheetProps) {
           <SheetDescription>{t("search_user_description")}</SheetDescription>
         </SheetHeader>
         <div className="space-y-6 py-4">
-          <div className="space-y-4">
+          <div className="space-y-4" data-cy="patient-user-selector-container">
             <h3 className="text-sm font-medium">{t("search_user")}</h3>
             <UserSelector
               selected={selectedUser}
@@ -167,7 +167,7 @@ function AddUserSheet({ patientId }: AddUserSheetProps) {
                   {t("select_role")}
                 </label>
                 <Select value={selectedRole} onValueChange={setSelectedRole}>
-                  <SelectTrigger>
+                  <SelectTrigger data-cy="patient-user-role-select">
                     <SelectValue placeholder="Select a role" />
                   </SelectTrigger>
                   <SelectContent>
@@ -188,6 +188,7 @@ function AddUserSheet({ patientId }: AddUserSheetProps) {
               </div>
 
               <Button
+                data-cy="patient-user-assign-button"
                 className="w-full"
                 onClick={handleAddUser}
                 disabled={!selectedRole}
@@ -264,7 +265,11 @@ export const PatientUsers = (props: PatientProps) => {
               </div>
               <AlertDialog>
                 <AlertDialogTrigger asChild>
-                  <Button variant="ghost" size="icon">
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    data-cy="patient-user-remove-button"
+                  >
                     <CareIcon icon="l-trash" className="h-4 w-4" />
                   </Button>
                 </AlertDialogTrigger>
@@ -280,6 +285,7 @@ export const PatientUsers = (props: PatientProps) => {
                   <AlertDialogFooter>
                     <AlertDialogCancel>{t("cancel")}</AlertDialogCancel>
                     <AlertDialogAction
+                      data-cy="patient-user-remove-confirm-button"
                       onClick={() => removeUser(user.id)}
                       className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
                     >
@@ -306,7 +312,7 @@ export const PatientUsers = (props: PatientProps) => {
   };
 
   return (
-    <div className="mt-4 px-4 md:px-0" data-test-id="patient-users">
+    <div className="mt-4 px-4 md:px-0" data-cy="patient-users">
       <div className="group my-2 w-full">
         <div className="h-full space-y-2">
           <div className="flex flex-row items-center justify-between">
diff --git a/src/components/Patient/PatientHome.tsx b/src/components/Patient/PatientHome.tsx
index 1f47323204d..0807023978a 100644
--- a/src/components/Patient/PatientHome.tsx
+++ b/src/components/Patient/PatientHome.tsx
@@ -115,6 +115,7 @@ export const PatientHome = (props: {
             {tabs.map((tab) => (
               <Link
                 key={tab.route}
+                data-cy={`tab-${tab.route}`}
                 href={
                   facilityId
                     ? `/facility/${facilityId}/patient/${id}/${tab.route}`

From 1db9e70ad1a595638234b89be25ede73a1c84d9f Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Wed, 5 Feb 2025 18:44:34 +0000
Subject: [PATCH 19/19] Remove appointment type section from patient details
 page (#10431)

---
 src/pages/Patient/index.tsx | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/pages/Patient/index.tsx b/src/pages/Patient/index.tsx
index 3c38269cbb2..680a0f6bb02 100644
--- a/src/pages/Patient/index.tsx
+++ b/src/pages/Patient/index.tsx
@@ -127,12 +127,6 @@ function PatientIndex() {
         </CardHeader>
         <CardContent className="mt-2 pt-2 px-6 pb-3">
           <div className="flex flex-col md:flex-row gap-2 justify-between">
-            <div className="flex flex-row md:flex-col gap-2 md:gap-0">
-              <span className="text-xs font-medium">
-                {t("appointment_type")}:{" "}
-              </span>
-              <span className="text-sm">{"Currently doesn't exist"}</span>
-            </div>
             <div className="flex flex-row md:flex-col gap-2 md:gap-0">
               <span className="text-xs font-medium">{t("location")}: </span>
               <span className="text-sm">{"Facility Location"}</span>