diff --git a/frontend/packages/shared/src/hooks/useConfirmationDialogOnPageLeave.test.tsx b/frontend/packages/shared/src/hooks/useConfirmationDialogOnPageLeave.test.tsx
deleted file mode 100644
index cd92fdbe68e..00000000000
--- a/frontend/packages/shared/src/hooks/useConfirmationDialogOnPageLeave.test.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-import React from 'react';
-import { render as rtlRender, waitFor } from '@testing-library/react';
-import { useConfirmationDialogOnPageLeave } from './useConfirmationDialogOnPageLeave';
-import { RouterProvider, createMemoryRouter, useBeforeUnload } from 'react-router-dom';
-
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- useBeforeUnload: jest.fn(),
-}));
-
-const confirmationMessage = 'test';
-
-const Component = ({ showConfirmationDialog }: { showConfirmationDialog: boolean }) => {
- useConfirmationDialogOnPageLeave(showConfirmationDialog, confirmationMessage);
- return null;
-};
-
-const render = (showConfirmationDialog: boolean) => {
- const router = createMemoryRouter([
- {
- path: '/',
- element: ,
- },
- {
- path: '/test',
- element: null,
- },
- ]);
-
- const { rerender } = rtlRender();
- return {
- rerender,
- router,
- };
-};
-
-describe('useConfirmationDialogOnPageLeave', () => {
- beforeEach(() => {
- jest.clearAllMocks();
- });
-
- it('should call useBeforeUnload with the expected arguments', () => {
- const showConfirmationDialog = true;
- render(showConfirmationDialog);
-
- expect(useBeforeUnload).toHaveBeenCalledWith(expect.any(Function), {
- capture: true,
- });
- });
-
- it('should prevent navigation if showConfirmationDialog is true', () => {
- const event = {
- type: 'beforeunload',
- returnValue: confirmationMessage,
- } as BeforeUnloadEvent;
- event.preventDefault = jest.fn();
-
- const showConfirmationDialog = true;
- render(showConfirmationDialog);
-
- const callbackFn = (useBeforeUnload as jest.MockedFunction).mock
- .calls[0][0];
- callbackFn(event);
-
- expect(event.preventDefault).toHaveBeenCalled();
- expect(event.returnValue).toBe(confirmationMessage);
- });
-
- it('should not prevent navigation if showConfirmationDialog is false', () => {
- const event = {
- type: 'beforeunload',
- returnValue: '',
- } as BeforeUnloadEvent;
- event.preventDefault = jest.fn();
-
- const showConfirmationDialog = false;
- render(showConfirmationDialog);
-
- const callbackFn = (useBeforeUnload as jest.MockedFunction).mock
- .calls[0][0];
- callbackFn(event);
-
- expect(event.preventDefault).not.toHaveBeenCalled();
- expect(event.returnValue).toBe('');
- });
-
- it('doesnt show confirmation dialog when there are no unsaved changes', async () => {
- window.confirm = jest.fn();
-
- const showConfirmationDialog = false;
- const { router } = render(showConfirmationDialog);
-
- await waitFor(() => router.navigate('/test'));
-
- expect(window.confirm).toHaveBeenCalledTimes(0);
- expect(router.state.location.pathname).toBe('/test');
- });
-
- it('show confirmation dialog when there are unsaved changes', async () => {
- window.confirm = jest.fn();
-
- const showConfirmationDialog = true;
- const { router } = render(showConfirmationDialog);
-
- await waitFor(() => router.navigate('/test'));
-
- expect(window.confirm).toHaveBeenCalledTimes(1);
- expect(router.state.location.pathname).toBe('/');
- });
-
- it('cancel redirection when clicking cancel', async () => {
- window.confirm = jest.fn(() => false);
-
- const showConfirmationDialog = true;
- const { router } = render(showConfirmationDialog);
-
- await waitFor(() => router.navigate('/test'));
-
- expect(window.confirm).toHaveBeenCalledTimes(1);
- expect(router.state.location.pathname).toBe('/');
- });
-
- it('redirect when clicking OK', async () => {
- window.confirm = jest.fn(() => true);
-
- const showConfirmationDialog = true;
- const { router } = render(showConfirmationDialog);
-
- await waitFor(() => router.navigate('/test'));
-
- expect(window.confirm).toHaveBeenCalledTimes(1);
- expect(router.state.location.pathname).toBe('/test');
- });
-});
diff --git a/frontend/packages/shared/src/hooks/useConfirmationDialogOnPageLeave.ts b/frontend/packages/shared/src/hooks/useConfirmationDialogOnPageLeave.ts
deleted file mode 100644
index 24b7a993d0c..00000000000
--- a/frontend/packages/shared/src/hooks/useConfirmationDialogOnPageLeave.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { useCallback, useEffect } from 'react';
-import { useBeforeUnload, useBlocker } from 'react-router-dom';
-
-export const useConfirmationDialogOnPageLeave = (
- showConfirmationDialog: boolean,
- confirmationMessage: string,
-) => {
- useBeforeUnload(
- useCallback(
- (event: BeforeUnloadEvent) => {
- if (showConfirmationDialog) {
- event.preventDefault();
- event.returnValue = confirmationMessage;
- }
- },
- [showConfirmationDialog, confirmationMessage],
- ),
- { capture: true },
- );
-
- const blocker = useBlocker(({ currentLocation, nextLocation }) => {
- return showConfirmationDialog && currentLocation.pathname !== nextLocation.pathname;
- });
-
- useEffect(() => {
- if (blocker.state === 'blocked') {
- if (window.confirm(confirmationMessage)) {
- blocker.proceed();
- } else {
- blocker.reset();
- }
- }
- }, [blocker, confirmationMessage]);
-};