From dee6380765bb7ba0187c88060fc98aaa06819c52 Mon Sep 17 00:00:00 2001
From: Walid Kayhan <walid.kayhan@outlook.com>
Date: Tue, 18 Feb 2025 09:45:58 -0500
Subject: [PATCH] Add fallback navigation when unable to go back

---
 src/app/src/components/Page/index.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/app/src/components/Page/index.tsx b/src/app/src/components/Page/index.tsx
index e028fd3ea..6264293c2 100644
--- a/src/app/src/components/Page/index.tsx
+++ b/src/app/src/components/Page/index.tsx
@@ -1,5 +1,5 @@
 import cn from 'classnames';
-import { useRouter } from '@tanstack/react-router';
+import { useRouter, useCanGoBack } from '@tanstack/react-router';
 import { LuArrowLeft } from 'react-icons/lu';
 
 import { Button } from 'app/components/shadcn/Button';
@@ -20,6 +20,8 @@ const Page = ({
     withGoBackButton,
 }: PageProps) => {
     const navigate = useRouter();
+    const canGoBack = useCanGoBack();
+
     return (
         <div
             className={cn(
@@ -30,10 +32,15 @@ const Page = ({
         >
             <div className="flex items-center justify-between mb-4 min-h-12">
                 <h1 className="text-3xl font-bold">{title}</h1>
+
                 {withGoBackButton && (
                     <Button
                         variant="outline"
-                        onClick={() => navigate.history.back()}
+                        onClick={() =>
+                            canGoBack
+                                ? navigate.history.back()
+                                : navigate({ to: '/' })
+                        }
                         size="lg"
                         className="flex items-center justify-center"
                     >