Adjusted solution

invoiceninja · Jan 21, 2025 · 4beef71 · 4beef71
1 parent 7cb6d4d
commit 4beef71
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 18 deletions.
diff --git a/src/components/PreviousNextNavigation.tsx b/src/components/PreviousNextNavigation.tsx
@@ -32,6 +32,7 @@ import { RecurringExpense } from '$app/common/interfaces/recurring-expense';
 import { Transaction } from '$app/common/interfaces/transactions';
 import { Tooltip } from './Tooltip';
 import { useTranslation } from 'react-i18next';
+import { usePreventNavigation } from '$app/common/hooks/usePreventNavigation';
 
 type Entity =
   | 'recurring_invoice'
@@ -85,6 +86,7 @@ export function PreviousNextNavigation({ entity, entityEndpointName }: Props) {
 
   const [t] = useTranslation();
   const navigate = useNavigate();
+  const preventNavigation = usePreventNavigation();
 
   const queryClient = useQueryClient();
 
@@ -118,6 +120,30 @@ export function PreviousNextNavigation({ entity, entityEndpointName }: Props) {
     return currentIndex + 1;
   };
 
+  const navigateToPrevious = () => {
+    const previousIndex = getPreviousIndex();
+
+    if (previousIndex !== null) {
+      navigate(
+        route(`/${entity}s/:id/${isEditPage ? 'edit' : ''}`, {
+          id: currentData[previousIndex].id,
+        })
+      );
+    }
+  };
+
+  const navigateToNext = () => {
+    const nextIndex = getNextIndex();
+
+    if (nextIndex !== null) {
+      navigate(
+        route(`/${entity}s/:id/${isEditPage ? 'edit' : ''}`, {
+          id: currentData[nextIndex].id,
+        })
+      );
+    }
+  };
+
   useEffect(() => {
     const data = queryClient
       .getQueryCache()
@@ -164,15 +190,9 @@ export function PreviousNextNavigation({ entity, entityEndpointName }: Props) {
             'cursor-pointer': getPreviousIndex() !== null,
           })}
           onClick={() => {
-            const previousIndex = getPreviousIndex();
-
-            if (previousIndex !== null) {
-              navigate(
-                route(`/${entity}s/:id/${isEditPage ? 'edit' : ''}`, {
-                  id: currentData[previousIndex].id,
-                })
-              );
-            }
+            preventNavigation({
+              fn: () => navigateToPrevious(),
+            });
           }}
         >
           <Icon element={MdKeyboardArrowLeft} size={29} />
@@ -192,15 +212,9 @@ export function PreviousNextNavigation({ entity, entityEndpointName }: Props) {
             'cursor-pointer': getNextIndex() !== null,
           })}
           onClick={() => {
-            const nextIndex = getNextIndex();
-
-            if (nextIndex !== null) {
-              navigate(
-                route(`/${entity}s/:id/${isEditPage ? 'edit' : ''}`, {
-                  id: currentData[nextIndex].id,
-                })
-              );
-            }
+            preventNavigation({
+              fn: () => navigateToNext(),
+            });
           }}
         >
           <Icon element={MdKeyboardArrowRight} size={29} />

diff --git a/src/pages/credits/common/hooks.tsx b/src/pages/credits/common/hooks.tsx
@@ -485,6 +485,7 @@ export function useActions(params?: Params) {
             isCommonActionSection={!dropdown}
             tooltipText={t('add_comment')}
             icon={MdComment}
+            disablePreventNavigation
           >
             {t('add_comment')}
           </EntityActionElement>

diff --git a/src/pages/invoices/edit/components/Actions.tsx b/src/pages/invoices/edit/components/Actions.tsx
@@ -264,6 +264,7 @@ export function useActions(params?: Params) {
             isCommonActionSection={!dropdown}
             tooltipText={t('add_comment')}
             icon={MdComment}
+            disablePreventNavigation
           >
             {t('add_comment')}
           </EntityActionElement>

diff --git a/src/pages/purchase-orders/common/hooks.tsx b/src/pages/purchase-orders/common/hooks.tsx
@@ -557,6 +557,7 @@ export function useActions(params: ActionsParams = {}) {
             isCommonActionSection={!dropdown}
             tooltipText={t('add_comment')}
             icon={MdComment}
+            disablePreventNavigation
           >
             {t('add_comment')}
           </EntityActionElement>

diff --git a/src/pages/quotes/common/hooks.tsx b/src/pages/quotes/common/hooks.tsx
@@ -507,6 +507,7 @@ export function useActions(params?: Params) {
             isCommonActionSection={!dropdown}
             tooltipText={t('add_comment')}
             icon={MdComment}
+            disablePreventNavigation
           >
             {t('add_comment')}
           </EntityActionElement>