diff --git a/src/App.tsx b/src/App.tsx
index c36d1a97491..19d8b5dab7d 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -12,7 +12,6 @@ import ProductionWarningBanner from "@/components/Common/ProductionWarningBanner
 import Integrations from "@/Integrations";
 import PluginEngine from "@/PluginEngine";
 import AuthUserProvider from "@/Providers/AuthUserProvider";
-import HistoryAPIProvider from "@/Providers/HistoryAPIProvider";
 import Routers from "@/Routers";
 import { displayCareConsoleArt } from "@/Utils/consoleArt";
 import queryClient from "@/Utils/request/queryClient";
@@ -42,14 +41,12 @@ const App = () => {
           <PubSubProvider>
             <ShortcutProvider>
               <PluginEngine>
-                <HistoryAPIProvider>
-                  <AuthUserProvider
-                    unauthorized={<Routers.PublicRouter />}
-                    otpAuthorized={<Routers.PatientRouter />}
-                  >
-                    <Routers.AppRouter />
-                  </AuthUserProvider>
-                </HistoryAPIProvider>
+                <AuthUserProvider
+                  unauthorized={<Routers.PublicRouter />}
+                  otpAuthorized={<Routers.PatientRouter />}
+                >
+                  <Routers.AppRouter />
+                </AuthUserProvider>
                 <Toaster
                   position="top-center"
                   theme="light"
diff --git a/src/CAREUI/misc/PrintPreview.tsx b/src/CAREUI/misc/PrintPreview.tsx
index 0d9644f9371..305da3bcd1e 100644
--- a/src/CAREUI/misc/PrintPreview.tsx
+++ b/src/CAREUI/misc/PrintPreview.tsx
@@ -11,8 +11,8 @@ import { Button } from "@/components/ui/button";
 
 import Page from "@/components/Common/Page";
 
+import BackButton from "@/components/Common/BackButton";
 import { useShortcutSubContext } from "@/context/ShortcutContext";
-import useAppHistory from "@/hooks/useAppHistory";
 import useAutoPrint, { AutoPrintOptions } from "@/hooks/useAutoPrint";
 import useBreakpoints from "@/hooks/useBreakpoints";
 import { FacilityRead } from "@/types/facility/facility";
@@ -38,7 +38,6 @@ type Props = {
 
 export default function PrintPreview(props: Props) {
   const initialScale = useBreakpoints({ default: 0.44, md: 1 });
-  const { goBack } = useAppHistory();
   const { t } = useTranslation();
   useShortcutSubContext();
 
@@ -61,14 +60,10 @@ export default function PrintPreview(props: Props) {
         options={
           <div className="flex items-center gap-2">
             {props.showBackButton !== false && (
-              <Button
-                variant="outline"
-                onClick={() => goBack()}
-                data-shortcut-id="go-back"
-              >
+              <BackButton variant="outline" data-shortcut-id="go-back">
                 <CareIcon icon="l-arrow-left" className="text-lg" />
                 {t("back")}
-              </Button>
+              </BackButton>
             )}
             <Button
               variant="primary"
diff --git a/src/Providers/HistoryAPIProvider.tsx b/src/Providers/HistoryAPIProvider.tsx
deleted file mode 100644
index 455335b9c39..00000000000
--- a/src/Providers/HistoryAPIProvider.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { useLocationChange } from "raviger";
-import { ReactNode, createContext, useState } from "react";
-
-export const HistoryContext = createContext<string[]>([]);
-
-export const ResetHistoryContext = createContext(() => {});
-
-export default function HistoryAPIProvider(props: { children: ReactNode }) {
-  const [history, setHistory] = useState<string[]>([]);
-  useLocationChange(
-    (location) => {
-      const newPath = location.fullPath + location.search;
-      const action = location.initiatedBy;
-
-      setHistory((history) => {
-        // Pop current path if navigate back to previous path
-        if (
-          (history.length > 1 && newPath === history[1]) ||
-          action === "pop"
-        ) {
-          return history.slice(1);
-        }
-
-        if (action === "replace") {
-          return [newPath, ...history.slice(1)];
-        }
-
-        // Otherwise just push the current path
-        return [newPath, ...history];
-      });
-    },
-    { onInitial: true },
-  );
-  const resetHistory = () => setHistory((history) => history.slice(0, 1));
-
-  return (
-    <HistoryContext.Provider value={history}>
-      <ResetHistoryContext.Provider value={resetHistory}>
-        {props.children}
-      </ResetHistoryContext.Provider>
-    </HistoryContext.Provider>
-  );
-}
diff --git a/src/Routers/routes/ConsultationRoutes.tsx b/src/Routers/routes/ConsultationRoutes.tsx
index 2453e831cab..1f2c0916eb6 100644
--- a/src/Routers/routes/ConsultationRoutes.tsx
+++ b/src/Routers/routes/ConsultationRoutes.tsx
@@ -103,22 +103,12 @@ const consultationRoutes: AppRoutes = {
       <TreatmentSummary encounterId={encounterId} patientId={patientId} />
     ),
   "/facility/:facilityId/patient/:patientId/encounter/:encounterId/report/template/:templateSlug":
-    ({ facilityId, encounterId, patientId, templateSlug }) => (
-      <ReportViewer
-        facilityId={facilityId}
-        patientId={patientId}
-        encounterId={encounterId}
-        templateSlug={templateSlug}
-      />
+    ({ encounterId, templateSlug }) => (
+      <ReportViewer encounterId={encounterId} templateSlug={templateSlug} />
     ),
   "/facility/:facilityId/patient/:patientId/encounter/:encounterId/report/:reportId":
-    ({ facilityId, encounterId, patientId, reportId }) => (
-      <ReportViewer
-        facilityId={facilityId}
-        encounterId={encounterId}
-        patientId={patientId}
-        reportId={reportId}
-      />
+    ({ encounterId, reportId }) => (
+      <ReportViewer encounterId={encounterId} reportId={reportId} />
     ),
   "/facility/:facilityId/patient/:patientId/encounter/:encounterId/questionnaire":
     ({ facilityId, encounterId, patientId }) => (
diff --git a/src/components/Common/BackButton.tsx b/src/components/Common/BackButton.tsx
index 2b98b585ff6..f1930287201 100644
--- a/src/components/Common/BackButton.tsx
+++ b/src/components/Common/BackButton.tsx
@@ -1,32 +1,31 @@
-import { Link } from "raviger";
-
-import { Button } from "@/components/ui/button";
-
-import useAppHistory from "@/hooks/useAppHistory";
+import { Button, ButtonSize, ButtonVariant } from "@/components/ui/button";
 
 type BackButtonProps = {
-  to?: string;
-  fallbackUrl?: string;
-} & React.ComponentProps<typeof Button>;
-
+  children: React.ReactNode;
+  variant?: ButtonVariant;
+  className?: string;
+  size?: ButtonSize;
+  disabled?: boolean;
+} & Omit<React.ComponentProps<"button">, "onClick">;
 export default function BackButton({
-  to,
-  fallbackUrl,
+  children,
+  variant = "outline",
+  className,
+  size = "default",
+  disabled = false,
   ...props
 }: BackButtonProps) {
-  const { history } = useAppHistory();
-
-  to ??= history[1] ?? fallbackUrl;
-
-  if (!to) {
-    return null;
-  }
-
   return (
-    <Button variant="outline" data-shortcut-id="go-back" asChild {...props}>
-      <Link basePath="/" href={to}>
-        {props.children}
-      </Link>
+    <Button
+      type="button"
+      variant={variant}
+      onClick={() => history.back()}
+      className={className}
+      size={size}
+      disabled={disabled}
+      {...props}
+    >
+      {children}
     </Button>
   );
 }
diff --git a/src/components/Common/Drawings/ExcalidrawEditor.tsx b/src/components/Common/Drawings/ExcalidrawEditor.tsx
index 96e13cfe7d3..3bd22d0412f 100644
--- a/src/components/Common/Drawings/ExcalidrawEditor.tsx
+++ b/src/components/Common/Drawings/ExcalidrawEditor.tsx
@@ -31,8 +31,6 @@ import { Input } from "@/components/ui/input";
 
 import Loading from "@/components/Common/Loading";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import metaArtifactApi from "@/types/metaArtifact/metaArtifactApi";
@@ -57,7 +55,6 @@ export default function ExcalidrawEditor({
   const [name, setName] = useState("");
   const [isDirty, setIsDirty] = useState(false);
   const [isAlertOpen, setIsAlertOpen] = useState(false);
-  const { goBack } = useAppHistory();
 
   const { mutate: saveDrawing } = useMutation({
     mutationFn: mutate(metaArtifactApi.upsert),
@@ -65,7 +62,7 @@ export default function ExcalidrawEditor({
       queryClient.invalidateQueries({
         queryKey: ["drawing", drawingId, associatingId],
       });
-      goBack();
+      history.back();
     },
   });
 
@@ -119,7 +116,7 @@ export default function ExcalidrawEditor({
     if (isDirty) {
       setIsAlertOpen(true);
     } else {
-      goBack();
+      history.back();
     }
   };
 
@@ -148,7 +145,7 @@ export default function ExcalidrawEditor({
               className="bg-red-500 text-gray-50 shadow-xs hover:bg-red-500/90"
               onClick={() => {
                 setIsAlertOpen(false);
-                goBack();
+                history.back();
               }}
             >
               {t("discard_changes")}
diff --git a/src/components/ErrorPages/DefaultErrorPage.tsx b/src/components/ErrorPages/DefaultErrorPage.tsx
index 4599db5130b..64d8a0577e8 100644
--- a/src/components/ErrorPages/DefaultErrorPage.tsx
+++ b/src/components/ErrorPages/DefaultErrorPage.tsx
@@ -6,7 +6,7 @@ import { cn } from "@/lib/utils";
 
 import { Button } from "@/components/ui/button";
 
-import useAppHistory from "@/hooks/useAppHistory";
+import { navigate } from "raviger";
 
 type ErrorType = "PAGE_NOT_FOUND" | "PAGE_LOAD_ERROR" | "CUSTOM_ERROR";
 
@@ -32,7 +32,6 @@ export default function ErrorPage({
   ...props
 }: ErrorPageProps) {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const [mousePos, setMousePos] = useState({ x: 0, y: 0 });
   const containerRef = useRef<HTMLDivElement>(null);
   const [isHovering, setIsHovering] = useState(false);
@@ -176,7 +175,7 @@ export default function ErrorPage({
         <div className="mt-6">
           <Button
             onClick={() => {
-              goBack("/");
+              navigate("/");
               window.location.reload();
             }}
             className="rounded-md bg-primary-700 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-primary-600 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-800"
diff --git a/src/components/Facility/FacilityDeleteDialog.tsx b/src/components/Facility/FacilityDeleteDialog.tsx
index 022e2f4c45d..d42ea85820a 100644
--- a/src/components/Facility/FacilityDeleteDialog.tsx
+++ b/src/components/Facility/FacilityDeleteDialog.tsx
@@ -9,8 +9,6 @@ import { buttonVariants } from "@/components/ui/button";
 
 import CriticalActionConfirmationDialog from "@/components/Common/CriticalActionConfirmationDialog";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import mutate from "@/Utils/request/mutate";
 import facilityApi from "@/types/facility/facilityApi";
 
@@ -27,7 +25,6 @@ const FacilityDeleteDialog = ({
   trigger,
 }: FacilityDeleteDialogProps) => {
   const { t } = useTranslation();
-  const { goBack, history } = useAppHistory();
   const queryClient = useQueryClient();
 
   const [open, setOpen] = useState(false);
@@ -53,17 +50,7 @@ const FacilityDeleteDialog = ({
       });
 
       setOpen(false);
-
-      if (history.length > 1) {
-        const prevPath = history[1];
-        if (prevPath.startsWith("/facility/")) {
-          navigate("/");
-        } else {
-          goBack("/");
-        }
-      } else {
-        navigate("/");
-      }
+      navigate("/");
     },
     onError: () => {
       setOpen(false);
diff --git a/src/components/Patient/EncounterQuestionnaire.tsx b/src/components/Patient/EncounterQuestionnaire.tsx
index 4bbba146a04..31ffbe14fca 100644
--- a/src/components/Patient/EncounterQuestionnaire.tsx
+++ b/src/components/Patient/EncounterQuestionnaire.tsx
@@ -7,8 +7,6 @@ import { Card, CardContent } from "@/components/ui/card";
 import Page from "@/components/Common/Page";
 import { QuestionnaireForm } from "@/components/Questionnaire/QuestionnaireForm";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import query from "@/Utils/request/query";
 import {
   PatientDeceasedInfo,
@@ -33,7 +31,6 @@ export default function EncounterQuestionnaire({
 }: Props) {
   const { t } = useTranslation();
 
-  const { goBack } = useAppHistory();
   const { data: encounter } = useQuery({
     queryKey: ["encounter", encounterId],
     queryFn: query(encounterApi.get, {
@@ -81,7 +78,6 @@ export default function EncounterQuestionnaire({
                   navigate(`/patient/${patientId}/updates`);
                 }
               }}
-              onCancel={() => goBack()}
             />
           </CardContent>
         </Card>
diff --git a/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx b/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
index db6e518b57f..9e2e9226321 100644
--- a/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
+++ b/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { useQueryParams } from "raviger";
+import { navigate, useQueryParams } from "raviger";
 import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
@@ -14,8 +14,6 @@ import CreateEncounterForm from "@/components/Encounter/CreateEncounterForm";
 import { TimelineEncounterCard } from "@/components/Facility/EncounterCard";
 import { PatientProps } from "@/components/Patient/PatientDetailsTab";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import { getPermissions } from "@/common/Permissions";
 
 import { ShortcutBadge } from "@/Utils/keyboardShortcutComponents";
@@ -40,7 +38,6 @@ const EncounterHistory = (props: PatientProps) => {
     hasPermission,
     patientData.permissions,
   );
-  const { goBack } = useAppHistory();
 
   const { data: encounterData, isLoading } = useQuery({
     queryKey: ["encounterHistory", patientId, qParams],
@@ -57,7 +54,7 @@ const EncounterHistory = (props: PatientProps) => {
   useEffect(() => {
     if (!canViewPatients) {
       toast.error(t("no_permission_to_view_page"));
-      goBack(`/facility/${facilityId}/patient/${patientId}`);
+      navigate(`/facility/${facilityId}/patient/${patientId}`);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [canViewPatients]);
diff --git a/src/components/Patient/PatientDetailsTab/patientUpdates.tsx b/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
index b4794b2f397..b5f39254180 100644
--- a/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
+++ b/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
@@ -1,4 +1,4 @@
-import { Link } from "raviger";
+import { Link, navigate } from "raviger";
 import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
@@ -9,8 +9,6 @@ import { Button } from "@/components/ui/button";
 
 import QuestionnaireResponsesList from "@/components/Facility/ConsultationDetails/QuestionnaireResponsesList";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import { getPermissions } from "@/common/Permissions";
 
 import { usePermissions } from "@/context/PermissionContext";
@@ -22,7 +20,6 @@ export const Updates = (props: PatientProps) => {
   const patientId = patientData.id;
   const { t } = useTranslation();
   const { hasPermission } = usePermissions();
-  const { goBack } = useAppHistory();
   const {
     canViewPatientQuestionnaireResponses,
     canSubmitPatientQuestionnaireResponses,
@@ -31,7 +28,7 @@ export const Updates = (props: PatientProps) => {
   useEffect(() => {
     if (!canViewPatientQuestionnaireResponses) {
       toast.error(t("no_permission_to_view_page"));
-      goBack(
+      navigate(
         facilityId
           ? `/facility/${facilityId}/patient/${patientId}`
           : `/patient/${patientId}`,
diff --git a/src/components/Patient/PatientRegistration.tsx b/src/components/Patient/PatientRegistration.tsx
index 6101522fa6e..dd5525387f9 100644
--- a/src/components/Patient/PatientRegistration.tsx
+++ b/src/components/Patient/PatientRegistration.tsx
@@ -36,7 +36,6 @@ import {
 import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Textarea } from "@/components/ui/textarea";
 import { useShortcutSubContext } from "@/context/ShortcutContext";
-import useAppHistory from "@/hooks/useAppHistory";
 import {
   ExtensionEntityType,
   getCombinedExtensionProps,
@@ -88,7 +87,6 @@ interface QParams {
 export const PatientRegistration = ({ patientId }: { patientId?: string }) => {
   useShortcutSubContext();
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const { facility, facilityId } = useCurrentFacility();
   const [{ phone_number, flow }] = useQueryParams<QParams>();
 
@@ -279,6 +277,7 @@ export const PatientRegistration = ({ patientId }: { patientId?: string }) => {
             open_schedule: "true",
           }),
         },
+        replace: true,
       });
     },
   });
@@ -290,7 +289,7 @@ export const PatientRegistration = ({ patientId }: { patientId?: string }) => {
     }),
     onSuccess: () => {
       toast.success(t("patient_update_success"));
-      goBack();
+      history.back();
     },
   });
 
diff --git a/src/components/Questionnaire/QuestionnaireForm.tsx b/src/components/Questionnaire/QuestionnaireForm.tsx
index 5cf28c38809..6afc208089d 100644
--- a/src/components/Questionnaire/QuestionnaireForm.tsx
+++ b/src/components/Questionnaire/QuestionnaireForm.tsx
@@ -82,7 +82,6 @@ export interface QuestionnaireFormProps {
   encounterId?: string;
   subjectType?: string;
   onSubmit?: () => void;
-  onCancel?: () => void;
   facilityId?: string;
 }
 
@@ -370,7 +369,6 @@ export function QuestionnaireForm({
   encounterId,
   subjectType,
   onSubmit,
-  onCancel,
   facilityId,
 }: QuestionnaireFormProps) {
   const { t } = useTranslation();
@@ -1128,14 +1126,9 @@ export function QuestionnaireForm({
             {/* Submit and Cancel Buttons */}
             {questionnaireForms.length > 0 && (
               <div className="flex justify-end gap-4 mx-4 mt-4 max-w-4xl">
-                <Button
-                  type="button"
-                  variant="outline"
-                  onClick={onCancel}
-                  disabled={isPending}
-                >
+                <BackButton variant="outline" disabled={isPending}>
                   {t("cancel")}
-                </Button>
+                </BackButton>
                 {isDraftSaveable && (
                   <Button
                     type="button"
diff --git a/src/components/Resource/ResourceForm.tsx b/src/components/Resource/ResourceForm.tsx
index 00f42b3b8f7..93f3465daa1 100644
--- a/src/components/Resource/ResourceForm.tsx
+++ b/src/components/Resource/ResourceForm.tsx
@@ -38,13 +38,13 @@ import Loading from "@/components/Common/Loading";
 import PageTitle from "@/components/Common/PageTitle";
 import UserSelector from "@/components/Common/UserSelector";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import useAuthUser from "@/hooks/useAuthUser";
 
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import { formatName, mergeAutocompleteOptions, valuesOf } from "@/Utils/utils";
 import validators from "@/Utils/validators";
+import BackButton from "@/components/Common/BackButton";
 import patientApi from "@/types/emr/patient/patientApi";
 import publicFacilityApi from "@/types/facility/publicFacilityApi";
 import {
@@ -64,7 +64,6 @@ interface ResourceProps {
 
 export default function ResourceForm({ facilityId, id }: ResourceProps) {
   const [facilitySearch, setFacilitySearch] = useState("");
-  const { goBack } = useAppHistory();
   const { t } = useTranslation();
   const [{ related_patient }] = useQueryParams();
   const [assignedToUser, setAssignedToUser] = useState<UserReadMinimal>();
@@ -153,7 +152,9 @@ export default function ResourceForm({ facilityId, id }: ResourceProps) {
     mutationFn: mutate(resourceRequestApi.create),
     onSuccess: (data: ResourceRequestRead) => {
       toast.success(t("resource_created_successfully"));
-      navigate(`/facility/${facilityId}/resource/${data.id}`);
+      navigate(`/facility/${facilityId}/resource/${data.id}`, {
+        replace: true,
+      });
     },
   });
 
@@ -163,7 +164,9 @@ export default function ResourceForm({ facilityId, id }: ResourceProps) {
     }),
     onSuccess: (data: ResourceRequestRead) => {
       toast.success(t("resource_updated_successfully"));
-      navigate(`/facility/${facilityId}/resource/${data.id}`);
+      navigate(`/facility/${facilityId}/resource/${data.id}`, {
+        replace: true,
+      });
     },
   });
 
@@ -541,9 +544,7 @@ export default function ResourceForm({ facilityId, id }: ResourceProps) {
           </div>
 
           <div className="flex justify-end gap-4 border-t border-gray-200 pt-4">
-            <Button type="button" variant="outline" onClick={() => goBack()}>
-              {t("cancel")}
-            </Button>
+            <BackButton variant="outline">{t("cancel")}</BackButton>
             <Button
               type="submit"
               variant="primary"
diff --git a/src/components/Resource/ResourceList.tsx b/src/components/Resource/ResourceList.tsx
index d352853e86b..f8f67a28cbf 100644
--- a/src/components/Resource/ResourceList.tsx
+++ b/src/components/Resource/ResourceList.tsx
@@ -91,7 +91,6 @@ export default function ResourceList({ facilityId }: { facilityId: string }) {
       },
     }),
   });
-
   const resources = queryResources?.results || [];
 
   return (
diff --git a/src/components/Users/UserDeleteDialog.tsx b/src/components/Users/UserDeleteDialog.tsx
index c32f65c08a6..740d0c8b5e3 100644
--- a/src/components/Users/UserDeleteDialog.tsx
+++ b/src/components/Users/UserDeleteDialog.tsx
@@ -1,5 +1,6 @@
 import { useMutation } from "@tanstack/react-query";
 import { SkullIcon, Trash2Icon } from "lucide-react";
+import { navigate } from "raviger";
 import { useState } from "react";
 import { Trans, useTranslation } from "react-i18next";
 import { toast } from "sonner";
@@ -8,8 +9,6 @@ import { buttonVariants } from "@/components/ui/button";
 
 import CriticalActionConfirmationDialog from "@/components/Common/CriticalActionConfirmationDialog";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import mutate from "@/Utils/request/mutate";
 import { UserBase } from "@/types/user/user";
 import userApi from "@/types/user/userApi";
@@ -24,7 +23,6 @@ const CONFIRMATION_TEXT = "Delete Account";
 
 const UserDeleteDialog = (props: ConfirmDialogProps) => {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
 
   const [open, setOpen] = useState(false);
 
@@ -35,7 +33,7 @@ const UserDeleteDialog = (props: ConfirmDialogProps) => {
     onSuccess: () => {
       toast.success(t("user_deleted_successfully"));
       setOpen(false);
-      goBack("/");
+      navigate("/");
     },
     onError: () => {
       setOpen(false);
diff --git a/src/components/Users/UserHome.tsx b/src/components/Users/UserHome.tsx
index 1817a7864c6..90c1d5dbfba 100644
--- a/src/components/Users/UserHome.tsx
+++ b/src/components/Users/UserHome.tsx
@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { Link } from "raviger";
+import { Link, navigate } from "raviger";
 import { useTranslation } from "react-i18next";
 
 import { cn } from "@/lib/utils";
@@ -13,7 +13,6 @@ import UserBanner from "@/components/Users/UserBanner";
 import UserDepartmentsTab from "@/components/Users/UserDepartmentsTab";
 import UserSummaryTab from "@/components/Users/UserSummary";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import useAuthUser from "@/hooks/useAuthUser";
 
 import { getPermissions } from "@/common/Permissions";
@@ -43,7 +42,6 @@ export default function UserHome(props: UserHomeProps) {
     username = authUser.username;
   }
   const { hasPermission } = usePermissions();
-  const { goBack } = useAppHistory();
 
   const {
     data: userData,
@@ -72,7 +70,7 @@ export default function UserHome(props: UserHomeProps) {
   );
 
   if (isError) {
-    goBack("/");
+    navigate("/");
   }
 
   if (isLoading || !userData) {
diff --git a/src/components/ValueSet/ValueSetForm.tsx b/src/components/ValueSet/ValueSetForm.tsx
index 243ae38a137..b8c7061d1ae 100644
--- a/src/components/ValueSet/ValueSetForm.tsx
+++ b/src/components/ValueSet/ValueSetForm.tsx
@@ -27,8 +27,6 @@ import {
 } from "@/components/ui/select";
 import { Textarea } from "@/components/ui/textarea";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import {
   TERMINOLOGY_SYSTEMS,
   ValueSetBase,
@@ -37,6 +35,7 @@ import {
 } from "@/types/valueSet/valueSet";
 import { valuesOf } from "@/Utils/utils";
 
+import BackButton from "@/components/Common/BackButton";
 import { generateSlug } from "@/Utils/utils";
 import { CodingField } from "./CodingField";
 import { ValueSetPreview } from "./ValueSetPreview";
@@ -369,8 +368,6 @@ export function ValueSetForm({
     }),
   });
 
-  const { goBack } = useAppHistory();
-
   const form = useForm({
     resolver: zodResolver(valuesetFormSchema),
     defaultValues: {
@@ -507,14 +504,9 @@ export function ValueSetForm({
           </div>
         )}
         <div className="flex gap-2 w-full justify-end">
-          <Button
-            variant="outline"
-            disabled={isSubmitting}
-            type="button"
-            onClick={() => goBack("/admin/valuesets")}
-          >
+          <BackButton variant="outline" size="sm" disabled={isSubmitting}>
             {t("cancel")}
-          </Button>
+          </BackButton>
 
           <Button
             variant="primary"
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 848327f9b59..30d31c4a45e 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -62,6 +62,7 @@ export type ButtonVariant =
   | "alert"
   | "warning"
   | "outline_primary";
+export type ButtonSize = "default" | "xs" | "sm" | "md" | "lg" | "icon";
 
 function Button({
   className,
diff --git a/src/hooks/useAppHistory.ts b/src/hooks/useAppHistory.ts
deleted file mode 100644
index b2164b189e7..00000000000
--- a/src/hooks/useAppHistory.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import { navigate } from "raviger";
-import { useContext, useMemo } from "react";
-
-import {
-  HistoryContext,
-  ResetHistoryContext,
-} from "@/Providers/HistoryAPIProvider";
-
-export default function useAppHistory() {
-  const history = useContext(HistoryContext);
-  const resetHistory = useContext(ResetHistoryContext);
-
-  // Volunarily extracting the last url from the history stack on mount.
-  // So that `goBack` always yields the previous url at the time of component mount and not when it was last rendered / updated.
-  const lastUrl = useMemo(() => {
-    if (history.length > 1) return history[1];
-  }, []);
-
-  const goBack = (fallbackUrl?: string) => {
-    // If last url is present, navigate to it.
-    if (lastUrl) {
-      return navigate(lastUrl);
-    }
-
-    // else fallback to using the provided url
-    if (fallbackUrl) {
-      return navigate(fallbackUrl);
-    }
-
-    // As a last resort, fallback to browser's go back behaviour.
-    window.history.back();
-  };
-
-  return { history, resetHistory, goBack };
-}
diff --git a/src/pages/Admin/TagConfig/TagConfigView.tsx b/src/pages/Admin/TagConfig/TagConfigView.tsx
index bad8a4987c2..f212239f473 100644
--- a/src/pages/Admin/TagConfig/TagConfigView.tsx
+++ b/src/pages/Admin/TagConfig/TagConfigView.tsx
@@ -14,8 +14,6 @@ import TagConfigFormDrawer from "./components/TagConfigFormDrawer";
 import Page from "@/components/Common/Page";
 import { FormSkeleton } from "@/components/Common/SkeletonLoading";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import {
@@ -25,6 +23,7 @@ import {
 } from "@/types/emr/tagConfig/tagConfig";
 import tagConfigApi from "@/types/emr/tagConfig/tagConfigApi";
 
+import BackButton from "@/components/Common/BackButton";
 import TagConfigTable from "./components/TagConfigTable";
 
 interface TagConfigViewProps {
@@ -38,7 +37,6 @@ export default function TagConfigView({
 }: TagConfigViewProps) {
   const { t } = useTranslation();
   const queryClient = useQueryClient();
-  const { goBack } = useAppHistory();
 
   // Fetch tag details
   const { data: tagConfig, isLoading } = useQuery({
@@ -146,18 +144,10 @@ export default function TagConfigView({
   return (
     <Page title={tagConfig.display} hideTitleOnPage>
       <div className="container mx-auto space-y-6">
-        <Button
-          variant="outline"
-          size="sm"
-          onClick={(e) => {
-            e.preventDefault();
-            goBack();
-          }}
-          className="shrink-0"
-        >
+        <BackButton variant="outline" size="sm" className="shrink-0">
           <CareIcon icon="l-arrow-left" className="size-5" />
           {t("back")}
-        </Button>
+        </BackButton>
         {/* Header */}
         <div className="flex items-center justify-between">
           <div className="flex items-center gap-4">
diff --git a/src/pages/Appointments/AppointmentDetail.tsx b/src/pages/Appointments/AppointmentDetail.tsx
index 93edb18a551..cc8e8f9e696 100644
--- a/src/pages/Appointments/AppointmentDetail.tsx
+++ b/src/pages/Appointments/AppointmentDetail.tsx
@@ -101,7 +101,6 @@ import { Separator } from "@/components/ui/separator";
 import { Textarea } from "@/components/ui/textarea";
 import { usePermissions } from "@/context/PermissionContext";
 import { useShortcutSubContext } from "@/context/ShortcutContext";
-import useAppHistory from "@/hooks/useAppHistory";
 import { cn } from "@/lib/utils";
 import { AppointmentDateSelection } from "@/pages/Appointments/BookAppointment/AppointmentDateSelection";
 import { AppointmentSlotPicker } from "@/pages/Appointments/BookAppointment/AppointmentSlotPicker";
@@ -124,7 +123,6 @@ export default function AppointmentDetail(props: Props) {
   const queryClient = useQueryClient();
   const { facility, facilityId, isFacilityLoading } = useCurrentFacility();
   const { hasPermission } = usePermissions();
-  const { goBack } = useAppHistory();
   const [params, setQueryParams] = useQueryParams();
   const { showSuccess } = params;
   const [{ from_queue }] = useQueryParams();
@@ -158,14 +156,14 @@ export default function AppointmentDetail(props: Props) {
     // If facility query failed (no access to facility)
     if (!facility) {
       toast.error(t("no_permission_to_view_page"));
-      goBack(`/`);
+      navigate(`/`);
       return;
     }
 
     // If facility is loaded but user doesn't have permission to view appointments
     if (facility && !canViewAppointments) {
       toast.error(t("no_permission_to_view_page"));
-      goBack(`/facility/${facility.id}/overview`);
+      navigate(`/facility/${facility.id}/overview`);
       return;
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -207,7 +205,7 @@ export default function AppointmentDetail(props: Props) {
     <Page title={t("appointment_details")} hideTitleOnPage>
       <div className="container mx-auto max-w-7xl mt-4">
         <div className="flex gap-2 items-center mb-2">
-          <BackButton size="icon" variant="ghost">
+          <BackButton variant="ghost">
             <ChevronLeft />
           </BackButton>
           <h4 className="font-semibold text-gray-800">
diff --git a/src/pages/Appointments/AppointmentsPage.tsx b/src/pages/Appointments/AppointmentsPage.tsx
index add64c3eddd..c7302c6d8b6 100644
--- a/src/pages/Appointments/AppointmentsPage.tsx
+++ b/src/pages/Appointments/AppointmentsPage.tsx
@@ -57,7 +57,6 @@ import {
   TableSkeleton,
 } from "@/components/Common/SkeletonLoading";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import useFilters, { FilterState } from "@/hooks/useFilters";
 
 import { getPermissions } from "@/common/Permissions";
@@ -208,7 +207,6 @@ export default function AppointmentsPage({ resourceType, resourceId }: Props) {
     .filter(Boolean) as TagConfig[];
 
   const { hasPermission } = usePermissions();
-  const { goBack } = useAppHistory();
 
   const { canViewAppointments } = getPermissions(
     hasPermission,
@@ -315,7 +313,7 @@ export default function AppointmentsPage({ resourceType, resourceId }: Props) {
   useEffect(() => {
     if (!isFacilityLoading && !canViewAppointments && !facility) {
       toast.error(t("no_permission_to_view_page"));
-      goBack("/");
+      navigate("/");
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [canViewAppointments, facility, isFacilityLoading]);
diff --git a/src/pages/Encounters/EncounterShow.tsx b/src/pages/Encounters/EncounterShow.tsx
index dabc3ae57d9..c06e3ba2c87 100644
--- a/src/pages/Encounters/EncounterShow.tsx
+++ b/src/pages/Encounters/EncounterShow.tsx
@@ -19,7 +19,6 @@ import { Card } from "@/components/ui/card";
 import { CommandShortcut } from "@/components/ui/command";
 import { NavTabs } from "@/components/ui/nav-tabs";
 import { Skeleton } from "@/components/ui/skeleton";
-import useAppHistory from "@/hooks/useAppHistory";
 import useBreakpoints from "@/hooks/useBreakpoints";
 import { useCareAppEncounterTabs } from "@/hooks/useCareApps";
 import { useSidebarAutoCollapse } from "@/hooks/useSidebarAutoCollapse";
@@ -82,7 +81,6 @@ export const EncounterShow = (props: Props) => {
 
   const { t } = useTranslation();
   const pluginTabs = useCareAppEncounterTabs();
-  const { goBack } = useAppHistory();
   const showMoreAfterIndex = useBreakpoints({
     default: 2,
     xs: 2,
@@ -107,7 +105,7 @@ export const EncounterShow = (props: Props) => {
   useEffect(() => {
     if (!isPrimaryEncounterLoading && !isPatientLoading && !canAccess) {
       toast.error(t("permission_denied_encounter"));
-      goBack("/");
+      navigate("/");
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isPrimaryEncounterLoading, isPatientLoading]);
diff --git a/src/pages/Encounters/ReportViewer.tsx b/src/pages/Encounters/ReportViewer.tsx
index 916fcd8083f..284399b57dc 100644
--- a/src/pages/Encounters/ReportViewer.tsx
+++ b/src/pages/Encounters/ReportViewer.tsx
@@ -52,16 +52,12 @@ const POLL_INTERVAL_MS = 2000;
 const POLL_TIMEOUT_MS = 30000;
 
 interface ReportViewerProps {
-  facilityId: string;
-  patientId: string;
   encounterId: string;
   templateSlug?: string;
   reportId?: string;
 }
 
 export default function ReportViewer({
-  facilityId: facilityId,
-  patientId: patientId,
   encounterId,
   templateSlug,
   reportId,
@@ -385,7 +381,7 @@ export default function ReportViewer({
           icon={<FileText className="size-6 text-gray-400" />}
           title={t("template_not_found")}
           action={
-            <BackButton fallbackUrl="/">
+            <BackButton>
               <ChevronLeft /> {t("back")}
             </BackButton>
           }
@@ -402,11 +398,7 @@ export default function ReportViewer({
       hideTitleOnPage
       componentRight={
         <div className="flex gap-2 items-center">
-          <BackButton
-            size="icon"
-            aria-label={t("back")}
-            fallbackUrl={`/facility/${facilityId}/patient/${patientId}/encounter/${encounterId}/updates`}
-          >
+          <BackButton size="icon" aria-label={t("back")}>
             <ChevronLeft className="size-4" />
           </BackButton>
           <h3 className="text-gray-800 truncate">{template.name}</h3>
diff --git a/src/pages/Facility/FacilityDetailsPage.tsx b/src/pages/Facility/FacilityDetailsPage.tsx
index 859aa06f4ef..9c6b0ca74da 100644
--- a/src/pages/Facility/FacilityDetailsPage.tsx
+++ b/src/pages/Facility/FacilityDetailsPage.tsx
@@ -4,7 +4,6 @@ import { toast } from "sonner";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
 import { Markdown } from "@/components/ui/markdown";
 
@@ -14,12 +13,12 @@ import { CardGridSkeleton } from "@/components/Common/SkeletonLoading";
 import { FacilityMapsLink } from "@/components/Facility/FacilityMapLink";
 import { Skeleton } from "@/components/ui/skeleton";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import useFilters from "@/hooks/useFilters";
 
 import query from "@/Utils/request/query";
 import publicFacilityApi from "@/types/facility/publicFacilityApi";
 
+import BackButton from "@/components/Common/BackButton";
 import { FeatureBadge } from "./Utils";
 import { UserCard } from "./components/UserCard";
 
@@ -29,7 +28,6 @@ interface Props {
 
 export function FacilityDetailsPage({ id }: Props) {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const { data: facilityResponse, isLoading } = useQuery({
     queryKey: ["facility", id],
     queryFn: query(publicFacilityApi.getAny, {
@@ -85,13 +83,9 @@ export function FacilityDetailsPage({ id }: Props) {
           <h2 className="text-xl font-semibold mb-4">
             {t("facility_not_found")}
           </h2>
-          <Button
-            variant="outline"
-            className="border border-secondary-400"
-            onClick={() => goBack("/facilities")}
-          >
+          <BackButton variant="outline" className="border border-secondary-400">
             {t("back_to_facilities")}
-          </Button>
+          </BackButton>
         </Card>
       </div>
     );
@@ -100,14 +94,10 @@ export function FacilityDetailsPage({ id }: Props) {
   return (
     <div className="container mx-auto px-4 py-8">
       <div className="flex justify-between items-center pb-4">
-        <Button
-          variant="outline"
-          className="border border-secondary-400"
-          onClick={() => goBack("/facilities")}
-        >
+        <BackButton variant="outline" className="border border-secondary-400">
           <CareIcon icon="l-arrow-left" className="size-4 mr-1" />
           <span className="text-sm underline">{t("back")}</span>
-        </Button>
+        </BackButton>
         <LoginHeader />
       </div>
       <Card className="overflow-hidden bg-white border border-gray-200">
diff --git a/src/pages/Facility/billing/account/CreateInvoice.tsx b/src/pages/Facility/billing/account/CreateInvoice.tsx
index 258394ace07..f37e14668d9 100644
--- a/src/pages/Facility/billing/account/CreateInvoice.tsx
+++ b/src/pages/Facility/billing/account/CreateInvoice.tsx
@@ -79,7 +79,6 @@ import { PaginatedResponse } from "@/Utils/request/types";
 import { formatDateTime, formatName } from "@/Utils/utils";
 
 import { EditInvoiceDialog } from "@/components/Billing/Invoice/EditInvoiceDialog";
-import BackButton from "@/components/Common/BackButton";
 import { ResourceDefinitionCategoryPicker } from "@/components/Common/ResourceDefinitionCategoryPicker";
 import { ResourceCategoryResourceType } from "@/types/base/resourceCategory/resourceCategory";
 import {
@@ -915,16 +914,22 @@ export function CreateInvoicePage({
             </Collapsible>
 
             <div className="flex justify-end space-x-4">
-              <BackButton
+              <Button
                 type="button"
                 variant="ghost"
                 className="text-base font-semibold"
-                {...(onCancel && { onClick: onCancel })}
+                onClick={() => {
+                  if (onCancel) {
+                    onCancel();
+                  } else {
+                    history.back();
+                  }
+                }}
                 disabled={createMutation.isPending}
                 data-shortcut-id="go-back"
               >
                 <span className="underline">{t("cancel")}</span>
-              </BackButton>
+              </Button>
               {dispenseOrderId && (
                 <Button
                   type="button"
diff --git a/src/pages/Facility/billing/account/components/PrintChargeItems.tsx b/src/pages/Facility/billing/account/components/PrintChargeItems.tsx
index db4d58dee68..6785b32b942 100644
--- a/src/pages/Facility/billing/account/components/PrintChargeItems.tsx
+++ b/src/pages/Facility/billing/account/components/PrintChargeItems.tsx
@@ -13,7 +13,6 @@ import { usePermissions } from "@/context/PermissionContext";
 
 import { DisablingCover } from "@/components/Common/DisablingCover";
 import PrintFooter from "@/components/Common/PrintFooter";
-import { Button } from "@/components/ui/button";
 import { MonetaryDisplay } from "@/components/ui/monetary-display";
 import {
   Select,
@@ -32,8 +31,6 @@ import {
   TableRow,
 } from "@/components/ui/table";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import useCurrentFacility from "@/pages/Facility/utils/useCurrentFacility";
 import { PAYMENT_RECONCILIATION_METHOD_MAP } from "@/types/billing/paymentReconciliation/paymentReconciliation";
 
@@ -57,6 +54,7 @@ import useFilters from "@/hooks/useFilters";
 import { add, multiply, round } from "@/Utils/decimal";
 import query from "@/Utils/request/query";
 import { formatDateTime, formatName, formatPatientAge } from "@/Utils/utils";
+import BackButton from "@/components/Common/BackButton";
 
 interface DetailRowProps {
   label: string;
@@ -91,7 +89,6 @@ export const PrintChargeItems = (props: {
   const { facilityId, accountId } = props;
   const { facility } = useCurrentFacility();
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const { hasPermission } = usePermissions();
   const { canManageLockedInvoice } = getPermissions(
     hasPermission,
@@ -210,9 +207,7 @@ export const PrintChargeItems = (props: {
         <p className="text-gray-500">
           {t("no_permission_to_print_charge_items")}
         </p>
-        <Button variant="outline" onClick={() => goBack()}>
-          {t("go_back")}
-        </Button>
+        <BackButton variant="outline">{t("go_back")}</BackButton>
       </div>
     );
   }
diff --git a/src/pages/Facility/billing/paymentReconciliation/PaymentReconciliationShow.tsx b/src/pages/Facility/billing/paymentReconciliation/PaymentReconciliationShow.tsx
index 1d91b004be4..21623b9617e 100644
--- a/src/pages/Facility/billing/paymentReconciliation/PaymentReconciliationShow.tsx
+++ b/src/pages/Facility/billing/paymentReconciliation/PaymentReconciliationShow.tsx
@@ -22,8 +22,7 @@ import { Separator } from "@/components/ui/separator";
 import CriticalActionConfirmationDialog from "@/components/Common/CriticalActionConfirmationDialog";
 import { TableSkeleton } from "@/components/Common/SkeletonLoading";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
+import BackButton from "@/components/Common/BackButton";
 import { useShortcutSubContext } from "@/context/ShortcutContext";
 import {
   PAYMENT_RECONCILIATION_METHOD_MAP,
@@ -60,7 +59,6 @@ export function PaymentReconciliationShow({
   paymentReconciliationId: string;
 }) {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const queryClient = useQueryClient();
   const [cancelDialogOpen, setCancelDialogOpen] = useState(false);
   const [errorDialogOpen, setErrorDialogOpen] = useState(false);
@@ -522,17 +520,13 @@ export function PaymentReconciliationShow({
                       />
                     </>
                   )}
-                <Button
+                <BackButton
                   className="w-full flex items-center relative"
                   variant="outline"
-                  onClick={() =>
-                    goBack(`/facility/${facilityId}/billing/payments`)
-                  }
-                  data-shortcut-id="go-back"
                 >
                   <ArrowLeft className="size-4" />
                   {t("back_to_payments")}
-                </Button>
+                </BackButton>
                 <Button variant="outline" className="w-full" asChild>
                   <Link
                     href={`/facility/${facilityId}/billing/account/${payment.account?.id}`}
diff --git a/src/pages/Facility/queues/ManageQueue.tsx b/src/pages/Facility/queues/ManageQueue.tsx
index b5810bb13cf..8bd98ffa9bf 100644
--- a/src/pages/Facility/queues/ManageQueue.tsx
+++ b/src/pages/Facility/queues/ManageQueue.tsx
@@ -3,10 +3,7 @@ import { AnimatedCounter } from "@/components/Common/AnimatedCounter";
 import BackButton from "@/components/Common/BackButton";
 import Page from "@/components/Common/Page";
 import { ScheduleResourceIcon } from "@/components/Schedule/ScheduleResourceIcon";
-import {
-  resourceTypeToResourcePathSlug,
-  useScheduleResource,
-} from "@/components/Schedule/useScheduleResource";
+import { useScheduleResource } from "@/components/Schedule/useScheduleResource";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
@@ -45,7 +42,6 @@ import {
 import { TokenStatus } from "@/types/tokens/token/token";
 import tokenQueueApi from "@/types/tokens/tokenQueue/tokenQueueApi";
 import query from "@/Utils/request/query";
-import { dateQueryString } from "@/Utils/utils";
 import careConfig from "@careConfig";
 import { useQuery } from "@tanstack/react-query";
 import { formatDate } from "date-fns";
@@ -128,11 +124,6 @@ export function ManageQueuePage({
           <div className="flex gap-2 items-center">
             <BackButton
               // TODO: move queue index page for practitioner to similar pattern path
-              to={
-                resourceType === SchedulableResourceType.Practitioner
-                  ? `/facility/${facilityId}/queues?date=${dateQueryString(queue.date)}&resource_id=${resourceId}`
-                  : `/facility/${facilityId}/${resourceTypeToResourcePathSlug[resourceType]}/${resourceId}/queues?date=${dateQueryString(queue.date)}&resource_id=${resourceId}`
-              }
               size="icon"
               variant="ghost"
             >
diff --git a/src/pages/Facility/services/HealthcareServiceShow.tsx b/src/pages/Facility/services/HealthcareServiceShow.tsx
index 07c514e96ba..bfbe8ac4d96 100644
--- a/src/pages/Facility/services/HealthcareServiceShow.tsx
+++ b/src/pages/Facility/services/HealthcareServiceShow.tsx
@@ -123,7 +123,7 @@ export default function HealthcareServiceShow({
 
   return (
     <div className="container px-4 mx-auto max-w-4xl space-y-6">
-      <BackButton to={`/facility/${facilityId}/services`}>
+      <BackButton>
         <ArrowLeft />
         <span>{t("back_to_services")}</span>
       </BackButton>
diff --git a/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderForm.tsx b/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderForm.tsx
index caab9ad577b..dec1d668718 100644
--- a/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderForm.tsx
+++ b/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderForm.tsx
@@ -226,6 +226,9 @@ export default function DeliveryOrderForm({
           false,
           `${deliveryOrder.id}${supplyOrderId ? `?supplyOrder=${supplyOrderId}` : ""}`,
         ),
+        {
+          replace: true,
+        },
       );
     },
   });
diff --git a/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderShow.tsx b/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderShow.tsx
index 6f208cecda4..4e84388bb7a 100644
--- a/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderShow.tsx
+++ b/src/pages/Facility/services/inventory/externalSupply/deliveryOrder/DeliveryOrderShow.tsx
@@ -8,13 +8,12 @@ import {
   Printer,
   Truck,
 } from "lucide-react";
-import { Link } from "raviger";
+import { Link, navigate } from "raviger";
 import { useMemo, useState } from "react";
 import { Trans, useTranslation } from "react-i18next";
 import { toast } from "sonner";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import BackButton from "@/components/Common/BackButton";
 import ConfirmActionDialog from "@/components/Common/ConfirmActionDialog";
 import Page from "@/components/Common/Page";
 import { TableSkeleton } from "@/components/Common/SkeletonLoading";
@@ -426,20 +425,25 @@ export function DeliveryOrderShow({
       >
         <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-2">
           <div className="flex items-center gap-4">
-            <BackButton
+            <Button
               size="icon"
+              variant="outline"
               className="shrink-0"
-              to={getInventoryBasePath(
-                facilityId,
-                locationId,
-                internal,
-                false,
-                isRequester,
-                "",
-              )}
+              onClick={() =>
+                navigate(
+                  getInventoryBasePath(
+                    facilityId,
+                    locationId,
+                    internal,
+                    false,
+                    isRequester,
+                    "",
+                  ),
+                )
+              }
             >
               <ChevronLeft />
-            </BackButton>
+            </Button>
             <div>
               <h4>{deliveryOrder.name}</h4>
               <p className="text-sm text-gray-700">
diff --git a/src/pages/Facility/services/inventory/externalSupply/requestOrder/RequestOrderForm.tsx b/src/pages/Facility/services/inventory/externalSupply/requestOrder/RequestOrderForm.tsx
index 1cf8bcab54e..4bec2a8036c 100644
--- a/src/pages/Facility/services/inventory/externalSupply/requestOrder/RequestOrderForm.tsx
+++ b/src/pages/Facility/services/inventory/externalSupply/requestOrder/RequestOrderForm.tsx
@@ -214,7 +214,9 @@ export default function RequestOrderForm({
     onSuccess: (requestOrder: RequestOrderRetrieve) => {
       queryClient.invalidateQueries({ queryKey: ["requestOrders"] });
       toast.success(t("order_created"));
-      navigate(returnPath + requestOrder.id);
+      navigate(returnPath + requestOrder.id, {
+        replace: true,
+      });
     },
   });
 
@@ -228,7 +230,9 @@ export default function RequestOrderForm({
     onSuccess: (requestOrder: RequestOrderRetrieve) => {
       queryClient.invalidateQueries({ queryKey: ["requestOrders"] });
       toast.success(t("order_updated"));
-      navigate(returnPath + requestOrder.id);
+      navigate(returnPath + requestOrder.id, {
+        replace: true,
+      });
     },
   });
 
@@ -551,13 +555,7 @@ export default function RequestOrderForm({
                   <Button
                     type="button"
                     variant="outline"
-                    onClick={() =>
-                      navigate(
-                        requestOrderId
-                          ? returnPath + requestOrderId
-                          : returnPath,
-                      )
-                    }
+                    onClick={() => history.back()}
                   >
                     {t("cancel")}
                     <ShortcutBadge actionId="cancel-action" />
diff --git a/src/pages/Facility/services/pharmacy/MedicationReturnShow.tsx b/src/pages/Facility/services/pharmacy/MedicationReturnShow.tsx
index 76856fcab01..3708c476f5a 100644
--- a/src/pages/Facility/services/pharmacy/MedicationReturnShow.tsx
+++ b/src/pages/Facility/services/pharmacy/MedicationReturnShow.tsx
@@ -330,7 +330,7 @@ export default function MedicationReturnShow({
       <div className="space-y-6">
         <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-2">
           <div className="flex items-center gap-4">
-            <BackButton size="icon" className="shrink-0" to={basePath}>
+            <BackButton size="icon" className="shrink-0">
               <ChevronLeft />
             </BackButton>
             <div>
diff --git a/src/pages/Facility/services/serviceRequests/ServiceRequestShow.tsx b/src/pages/Facility/services/serviceRequests/ServiceRequestShow.tsx
index 4251cd49160..b794a640175 100644
--- a/src/pages/Facility/services/serviceRequests/ServiceRequestShow.tsx
+++ b/src/pages/Facility/services/serviceRequests/ServiceRequestShow.tsx
@@ -30,7 +30,6 @@ import { Skeleton } from "@/components/ui/skeleton";
 
 import { ChargeItemsSection } from "@/components/Billing/ChargeItems/ChargeItemsSection";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import useBreakpoints from "@/hooks/useBreakpoints";
 
 import mutate from "@/Utils/request/mutate";
@@ -53,6 +52,7 @@ import specimenApi from "@/types/emr/specimen/specimenApi";
 import { SpecimenDefinitionRead } from "@/types/emr/specimenDefinition/specimenDefinition";
 
 import { ShortcutBadge } from "@/Utils/keyboardShortcutComponents";
+import BackButton from "@/components/Common/BackButton";
 import { PatientHeader } from "@/components/Patient/PatientHeader";
 import { DiagnosticReportForm } from "./components/DiagnosticReportForm";
 import { DiagnosticReportReview } from "./components/DiagnosticReportReview";
@@ -77,7 +77,6 @@ export default function ServiceRequestShow({
 }: ServiceRequestShowProps) {
   const { t } = useTranslation();
   const queryClient = useQueryClient();
-  const { goBack } = useAppHistory();
   const isMobile = useBreakpoints({
     default: true,
     lg: false,
@@ -311,15 +310,13 @@ export default function ServiceRequestShow({
       <div className="flex-1 p-4 max-w-6xl">
         <div className="space-y-6">
           <div className="flex items-center justify-between gap-2">
-            <Button
+            <BackButton
               variant="outline"
-              size="sm"
-              onClick={() => goBack()}
               className="font-semibold border border-gray-400 text-gray-950 underline underline-offset-2"
             >
               <ArrowLeft />
               {t("back")}
-            </Button>
+            </BackButton>
 
             <div className="flex items-end gap-2">
               {(!request?.activity_definition?.diagnostic_report_codes ||
diff --git a/src/pages/Facility/settings/activityDefinition/ActivityDefinitionForm.tsx b/src/pages/Facility/settings/activityDefinition/ActivityDefinitionForm.tsx
index 04327152316..c4fef1cd37e 100644
--- a/src/pages/Facility/settings/activityDefinition/ActivityDefinitionForm.tsx
+++ b/src/pages/Facility/settings/activityDefinition/ActivityDefinitionForm.tsx
@@ -40,6 +40,7 @@ import { HealthcareServiceSelector } from "@/pages/Facility/services/HealthcareS
 import { CodeSchema } from "@/types/base/code/code";
 import chargeItemDefinitionApi from "@/types/billing/chargeItemDefinition/chargeItemDefinitionApi";
 
+import BackButton from "@/components/Common/BackButton";
 import ObservationDefinitionForm from "@/pages/Facility/settings/observationDefinition/ObservationDefinitionForm";
 import SpecimenDefinitionForm from "@/pages/Facility/settings/specimen-definitions/SpecimenDefinitionForm";
 import { ResourceCategoryResourceType } from "@/types/base/resourceCategory/resourceCategory";
@@ -360,7 +361,9 @@ function ActivityDefinitionFormContent({
           queryKey: ["activityDefinition", activityDefinitionSlug],
         });
         toast.success(t("activity_definition_created_successfully"));
-        navigate(`/facility/${facilityId}/settings/activity_definitions`);
+        navigate(`/facility/${facilityId}/settings/activity_definitions`, {
+          replace: true,
+        });
       },
     });
 
@@ -382,6 +385,9 @@ function ActivityDefinitionFormContent({
         toast.success(t("activity_definition_updated_successfully"));
         navigate(
           `/facility/${facilityId}/settings/activity_definitions/${activityDefinition.slug}`,
+          {
+            replace: true,
+          },
         );
       },
     });
@@ -1067,17 +1073,7 @@ function ActivityDefinitionFormContent({
             </div>
 
             <div className="flex justify-end space-x-3">
-              <Button
-                type="button"
-                variant="outline"
-                onClick={() =>
-                  navigate(
-                    `/facility/${facilityId}/settings/activity_definitions`,
-                  )
-                }
-              >
-                {t("cancel")}
-              </Button>
+              <BackButton variant="outline">{t("cancel")}</BackButton>
               <Button type="submit" disabled={isPending}>
                 {isPending
                   ? isEditMode
diff --git a/src/pages/Facility/settings/activityDefinition/ActivityDefinitionView.tsx b/src/pages/Facility/settings/activityDefinition/ActivityDefinitionView.tsx
index 9675692f463..33753409d9e 100644
--- a/src/pages/Facility/settings/activityDefinition/ActivityDefinitionView.tsx
+++ b/src/pages/Facility/settings/activityDefinition/ActivityDefinitionView.tsx
@@ -88,7 +88,9 @@ export default function ActivityDefinitionView({
         queryClient.invalidateQueries({
           queryKey: ["activityDefinition", activityDefinitionSlug],
         });
-        navigate(`/facility/${facilityId}/settings/activity_definitions`);
+        navigate(`/facility/${facilityId}/settings/activity_definitions`, {
+          replace: true,
+        });
       },
     });
 
@@ -129,11 +131,7 @@ export default function ActivityDefinitionView({
             <AlertTitle>{t("error_loading_definitions")}</AlertTitle>
             <AlertDescription>{t("definition_not_found")}</AlertDescription>
           </Alert>
-          <BackButton
-            variant="outline"
-            className="mt-4"
-            to={`/facility/${facilityId}/settings/activity_definitions`}
-          >
+          <BackButton variant="outline" className="mt-4">
             <CareIcon icon="l-arrow-left" className="mr-2 size-4" />
             {t("back_to_list")}
           </BackButton>
@@ -145,9 +143,7 @@ export default function ActivityDefinitionView({
   return (
     <Page title={definition.title} hideTitleOnPage={true}>
       <div className="container mx-auto max-w-3xl space-y-6">
-        <BackButton
-          fallbackUrl={`/facility/${facilityId}/settings/activity_definitions/categories/${definition.category.slug}`}
-        >
+        <BackButton>
           <ArrowLeft />
           {t("back")}
         </BackButton>
diff --git a/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionDetail.tsx b/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionDetail.tsx
index 647978d6e44..4436aa80e83 100644
--- a/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionDetail.tsx
+++ b/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionDetail.tsx
@@ -64,6 +64,9 @@ export function ChargeItemDefinitionDetail({
         queryClient.invalidateQueries({ queryKey: ["chargeItemDefinitions"] });
         navigate(
           `/facility/${facilityId}/settings/charge_item_definitions/categories/${chargeItemDefinition?.category.slug}`,
+          {
+            replace: true,
+          },
         );
       },
     });
@@ -152,9 +155,7 @@ export function ChargeItemDefinitionDetail({
   return (
     <Page title={chargeItemDefinition.title} hideTitleOnPage={true}>
       <div className="container mx-auto max-w-3xl space-y-6">
-        <BackButton
-          fallbackUrl={`/facility/${facilityId}/settings/charge_item_definitions/categories/${chargeItemDefinition.category.slug}`}
-        >
+        <BackButton>
           <ArrowLeft />
           {t("back")}
         </BackButton>
diff --git a/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionForm.tsx b/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionForm.tsx
index 0ae8933a6e4..09d8a948a89 100644
--- a/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionForm.tsx
+++ b/src/pages/Facility/settings/chargeItemDefinitions/ChargeItemDefinitionForm.tsx
@@ -87,19 +87,18 @@ export function ChargeItemDefinitionForm({
     if (categorySlug) {
       navigate(
         `/facility/${facilityId}/settings/charge_item_definitions/categories/${categorySlug}`,
+        {
+          replace: true,
+        },
       );
     } else {
-      navigate(`/facility/${facilityId}/settings/charge_item_definitions`);
+      navigate(`/facility/${facilityId}/settings/charge_item_definitions`, {
+        replace: true,
+      });
     }
   },
   onCancel = () => {
-    if (categorySlug) {
-      navigate(
-        `/facility/${facilityId}/settings/charge_item_definitions/categories/${categorySlug}`,
-      );
-    } else {
-      navigate(`/facility/${facilityId}/settings/charge_item_definitions`);
-    }
+    history.back();
   },
 }: ChargeItemDefinitionFormProps) {
   const { t } = useTranslation();
diff --git a/src/pages/Facility/settings/chargeItemDefinitions/UpdateChargeItemDefinition.tsx b/src/pages/Facility/settings/chargeItemDefinitions/UpdateChargeItemDefinition.tsx
index f12359b2726..2a6028d7df4 100644
--- a/src/pages/Facility/settings/chargeItemDefinitions/UpdateChargeItemDefinition.tsx
+++ b/src/pages/Facility/settings/chargeItemDefinitions/UpdateChargeItemDefinition.tsx
@@ -83,6 +83,9 @@ export function UpdateChargeItemDefinition({
   const handleSuccess = () => {
     navigate(
       `/facility/${facilityId}/settings/charge_item_definitions/categories/${chargeItemDefinition.category.slug}`,
+      {
+        replace: true,
+      },
     );
   };
 
diff --git a/src/pages/Facility/settings/devices/CreateDevice.tsx b/src/pages/Facility/settings/devices/CreateDevice.tsx
index 012240c6b18..d380314a543 100644
--- a/src/pages/Facility/settings/devices/CreateDevice.tsx
+++ b/src/pages/Facility/settings/devices/CreateDevice.tsx
@@ -1,4 +1,4 @@
-import { navigate, useQueryParams } from "raviger";
+import { useQueryParams } from "raviger";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 
@@ -35,7 +35,7 @@ export default function CreateDevice({ facilityId }: Props) {
           facilityId={facilityId}
           onSuccess={() => {
             toast.success(t("device_registered"));
-            navigate(`/facility/${facilityId}/settings/devices`);
+            history.back();
           }}
         />
       </div>
diff --git a/src/pages/Facility/settings/devices/UpdateDevice.tsx b/src/pages/Facility/settings/devices/UpdateDevice.tsx
index a774202d7f9..0cddd7e0af1 100644
--- a/src/pages/Facility/settings/devices/UpdateDevice.tsx
+++ b/src/pages/Facility/settings/devices/UpdateDevice.tsx
@@ -8,8 +8,6 @@ import { Separator } from "@/components/ui/separator";
 
 import Loading from "@/components/Common/Loading";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import query from "@/Utils/request/query";
 import deviceApi from "@/types/device/deviceApi";
 
@@ -23,7 +21,6 @@ interface Props {
 
 export default function UpdateDevice({ facilityId, deviceId }: Props) {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
 
   const { data: device, isLoading } = useQuery({
     queryKey: ["device", facilityId, deviceId],
@@ -52,7 +49,7 @@ export default function UpdateDevice({ facilityId, deviceId }: Props) {
             device={device}
             onSuccess={() => {
               toast.success(t("device_updated"));
-              goBack(`/facility/${facilityId}/settings/devices/${device.id}`);
+              history.back();
             }}
           />
         </div>
diff --git a/src/pages/Facility/settings/devices/components/DeviceForm.tsx b/src/pages/Facility/settings/devices/components/DeviceForm.tsx
index 30f70c195a6..fb56498aba1 100644
--- a/src/pages/Facility/settings/devices/components/DeviceForm.tsx
+++ b/src/pages/Facility/settings/devices/components/DeviceForm.tsx
@@ -31,9 +31,8 @@ import {
 
 import ErrorBoundary from "@/components/Common/ErrorBoundary";
 
-import useAppHistory from "@/hooks/useAppHistory";
-
 import mutate from "@/Utils/request/mutate";
+import BackButton from "@/components/Common/BackButton";
 import { Skeleton } from "@/components/ui/skeleton";
 import {
   usePluginDevice,
@@ -58,7 +57,6 @@ interface Props {
 
 export default function DeviceForm({ facilityId, device, onSuccess }: Props) {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const [qParams] = useQueryParams<{ type?: string }>();
 
   const queryClient = useQueryClient();
@@ -571,20 +569,9 @@ export default function DeviceForm({ facilityId, device, onSuccess }: Props) {
         )}
 
         <div className="flex items-center justify-end">
-          <Button
-            variant="outline"
-            type="button"
-            className="m-4"
-            onClick={() => {
-              if (device) {
-                goBack(`/facility/${facilityId}/settings/devices/${device.id}`);
-              } else {
-                goBack(`/facility/${facilityId}/settings/devices`);
-              }
-            }}
-          >
+          <BackButton variant="outline" className="m-4">
             {t("cancel")}
-          </Button>
+          </BackButton>
           <Button type="submit" disabled={isPending || !form.formState.isDirty}>
             {isPending ? t("saving") : t("save")}
           </Button>
diff --git a/src/pages/Facility/settings/healthcareService/HealthcareServiceForm.tsx b/src/pages/Facility/settings/healthcareService/HealthcareServiceForm.tsx
index 14b1ced913f..935dd2a5e81 100644
--- a/src/pages/Facility/settings/healthcareService/HealthcareServiceForm.tsx
+++ b/src/pages/Facility/settings/healthcareService/HealthcareServiceForm.tsx
@@ -173,7 +173,9 @@ function HealthcareServiceFormContent({
           queryKey: ["healthcareService", healthcareServiceId],
         });
         toast.success(t("healthcare_service_created_successfully"));
-        navigate(`/facility/${facilityId}/settings/healthcare_services`);
+        navigate(`/facility/${facilityId}/settings/healthcare_services`, {
+          replace: true,
+        });
       },
     });
 
@@ -190,6 +192,9 @@ function HealthcareServiceFormContent({
         toast.success(t("healthcare_service_updated_successfully"));
         navigate(
           `/facility/${facilityId}/settings/healthcare_services/${healthcareServiceId}`,
+          {
+            replace: true,
+          },
         );
       },
     });
diff --git a/src/pages/Facility/settings/product/ProductForm.tsx b/src/pages/Facility/settings/product/ProductForm.tsx
index f4a7a60d793..8ab88be4ead 100644
--- a/src/pages/Facility/settings/product/ProductForm.tsx
+++ b/src/pages/Facility/settings/product/ProductForm.tsx
@@ -144,13 +144,11 @@ export function ProductFormContent({
   slug,
   containerClassName,
   onSuccess = (product: ProductRead) =>
-    navigate(`/facility/${facilityId}/settings/product/${product.id}`),
+    navigate(`/facility/${facilityId}/settings/product/${product.id}`, {
+      replace: true,
+    }),
   onCancel = () => {
-    if (productId) {
-      navigate(`/facility/${facilityId}/settings/product/${productId}`);
-    } else {
-      navigate(`/facility/${facilityId}/settings/product`);
-    }
+    history.back();
   },
   disableButtons = false,
   enabled = true,
diff --git a/src/pages/Facility/settings/productKnowledge/ProductKnowledgeView.tsx b/src/pages/Facility/settings/productKnowledge/ProductKnowledgeView.tsx
index 0e36812f443..c9cc81cb1a9 100644
--- a/src/pages/Facility/settings/productKnowledge/ProductKnowledgeView.tsx
+++ b/src/pages/Facility/settings/productKnowledge/ProductKnowledgeView.tsx
@@ -137,9 +137,7 @@ export default function ProductKnowledgeView({ facilityId, slug }: Props) {
   return (
     <Page title={product.name} hideTitleOnPage={true}>
       <div className="container mx-auto max-w-3xl space-y-6">
-        <BackButton
-          to={`/facility/${facilityId}/settings/product_knowledge/categories/${product.category.slug}`}
-        >
+        <BackButton>
           <ArrowLeft />
           {t("back")}
         </BackButton>
diff --git a/src/pages/Patient/PatientHome.tsx b/src/pages/Patient/PatientHome.tsx
index e5338ef8c0b..2ea789b9799 100644
--- a/src/pages/Patient/PatientHome.tsx
+++ b/src/pages/Patient/PatientHome.tsx
@@ -16,6 +16,7 @@ import { useState } from "react";
 
 import { pharmacyDispenseServiceAtom } from "@/atoms/pharmacy";
 import { getPermissions } from "@/common/Permissions";
+import BackButton from "@/components/Common/BackButton";
 import CreateEncounterForm from "@/components/Encounter/CreateEncounterForm";
 import { PatientInfoCard } from "@/components/Patient/PatientInfoCard";
 import CreateTokenForm from "@/components/Tokens/CreateTokenForm";
@@ -23,7 +24,6 @@ import PatientTokensList from "@/components/Tokens/PatientTokensList";
 import { Button } from "@/components/ui/button";
 import { usePermissions } from "@/context/PermissionContext";
 import { useShortcutSubContext } from "@/context/ShortcutContext";
-import useAppHistory from "@/hooks/useAppHistory";
 import useBreakpoints from "@/hooks/useBreakpoints";
 import BookAppointmentSheet from "@/pages/Appointments/BookAppointment/BookAppointmentSheet";
 import { UpcomingAppointmentCard } from "@/pages/Appointments/components/UpcomingAppointmentCard";
@@ -53,7 +53,6 @@ export default function PatientHome() {
     useQueryParams<QParams>();
   const queryClient = useQueryClient();
 
-  const { goBack } = useAppHistory();
   const { facility, facilityId } = useCurrentFacility();
 
   const pharmacyDispenseService = useAtomValue(
@@ -272,13 +271,9 @@ export default function PatientHome() {
               <p className="text-sm text-gray-500 mb-6">
                 {t("please_enter_correct_birth_year")}
               </p>
-              <Button
-                variant={"primary_gradient"}
-                className="gap-3 group"
-                onClick={() => goBack(`/facility/${facilityId}/patients`)}
-              >
+              <BackButton variant="primary_gradient" className="gap-3 group">
                 {t("go_back")}
-              </Button>
+              </BackButton>
             </div>
           </div>
         )
diff --git a/src/pages/PublicAppointments/Schedule.tsx b/src/pages/PublicAppointments/Schedule.tsx
index 54c2c31c5ad..193957f8db4 100644
--- a/src/pages/PublicAppointments/Schedule.tsx
+++ b/src/pages/PublicAppointments/Schedule.tsx
@@ -19,12 +19,12 @@ import { Textarea } from "@/components/ui/textarea";
 import { Avatar } from "@/components/Common/Avatar";
 import Loading from "@/components/Common/Loading";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import { usePatientContext } from "@/hooks/usePatientUser";
 
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import { dateQueryString, formatName } from "@/Utils/utils";
+import BackButton from "@/components/Common/BackButton";
 import { TokenSlotButton } from "@/pages/Appointments/BookAppointment/AppointmentSlotPicker";
 import { groupSlotsByAvailability } from "@/pages/Appointments/utils";
 import publicFacilityApi from "@/types/facility/publicFacilityApi";
@@ -44,7 +44,6 @@ interface AppointmentsProps {
 
 export function ScheduleAppointment(props: AppointmentsProps) {
   const { t } = useTranslation();
-  const { goBack } = useAppHistory();
   const { facilityId, staffId, appointmentId } = props;
   const [selectedMonth, setSelectedMonth] = useState(new Date());
   const [selectedDate, setSelectedDate] = useState(new Date());
@@ -228,13 +227,9 @@ export function ScheduleAppointment(props: AppointmentsProps) {
     <div className="flex flex-col">
       <div className="container mx-auto px-4 py-8">
         <div className="flex px-2 pb-4 justify-start">
-          <Button
-            variant="outline"
-            className="border border-secondary-400"
-            onClick={() => goBack(`/facility/${facilityId}`)}
-          >
+          <BackButton>
             <span className="text-sm underline">{t("back")}</span>
-          </Button>
+          </BackButton>
         </div>
         <div className="flex flex-col sm:flex-row gap-4">
           <div className="sm:w-1/3">
diff --git a/src/pages/PublicAppointments/auth/PatientLogin.tsx b/src/pages/PublicAppointments/auth/PatientLogin.tsx
index c589f0514cf..e9f4ce936c8 100644
--- a/src/pages/PublicAppointments/auth/PatientLogin.tsx
+++ b/src/pages/PublicAppointments/auth/PatientLogin.tsx
@@ -30,7 +30,6 @@ import { PhoneInput } from "@/components/ui/phone-input";
 
 import CircularProgress from "@/components/Common/CircularProgress";
 
-import useAppHistory from "@/hooks/useAppHistory";
 import { useAuthContext } from "@/hooks/useAuthUser";
 
 import mutate from "@/Utils/request/mutate";
@@ -52,7 +51,6 @@ export default function PatientLogin({
   staffId: string;
   page: string;
 }) {
-  const { goBack } = useAppHistory();
   const { t } = useTranslation();
   const [phoneNumber, setPhoneNumber] = useState("");
   const [error, setError] = useState("");
@@ -243,7 +241,7 @@ export default function PatientLogin({
         className="border border-secondary-400"
         onClick={() =>
           page === "send"
-            ? goBack(`/facility/${facilityId}`)
+            ? navigate(`/facility/${facilityId}`)
             : navigate(
                 `/facility/${facilityId}/appointments/${staffId}/otp/send`,
               )