Remove WillExit component and useWillExit hook

These will no longer be needed when we switch to the ViewTransition API
for view transitions. It feels unnecessary to merge a suboptimal
solution in the meanwhile.

3 files changed, 5 insertions, 36 deletions

diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/Modal.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/Modal.tsx
index 3409ddac14..c8e3770bbd 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/Modal.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/Modal.tsx
@@ -7,7 +7,6 @@ import { Icon, IconProps, Spinner } from '../lib/components';
 import { Colors } from '../lib/foundations';
 import { IconBadge } from '../lib/icon-badge';
 import { useEffectEvent } from '../lib/utility-hooks';
-import { useWillExit } from '../lib/will-exit';
 import * as AppButton from './AppButton';
 import { measurements, normalText, tinyText } from './common-styles';
 import CustomScrollbars from './CustomScrollbars';
@@ -185,20 +184,16 @@ export function ModalAlert(props: IModalAlertProps & { isOpen: boolean }) {
   const activeModalContext = useContext(ActiveModalContext);
   const [openState, setOpenState] = useState<OpenState>({ isClosing: false, wasOpen: isOpen });
 
-  const willExit = useWillExit();
-
   // Modal shouldn't prepare for being opened again while view is disappearing.
   const onTransitionEnd = useCallback(() => {
-    if (!willExit) {
-      setOpenState({ isClosing: false, wasOpen: isOpen });
-    }
-  }, [willExit, isOpen]);
+    setOpenState({ isClosing: false, wasOpen: isOpen });
+  }, [isOpen]);
 
   const onOpenStateChange = useEffectEvent((isOpen: boolean) => {
     setOpenState(({ isClosing, wasOpen }) => ({
       isClosing: isClosing || (wasOpen && !isOpen),
       // Unmounting the Modal during view transitions result in a visual glitch.
-      wasOpen: willExit ? wasOpen : isOpen,
+      wasOpen: isOpen,
     }));
   });
 
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/will-exit.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/will-exit.tsx
deleted file mode 100644
index 67ce4c5549..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/will-exit.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import React, { useContext } from 'react';
-
-// This context tells its subtree if it should stop rendering or not. This is useful during
-// transitions, e.g. on log out, since data might be updated which makes the disappearing view
-// update a lot during the transition. There's currently no support for unpausing, which can be
-// added later if needed.
-const willExitContext = React.createContext<boolean>(false);
-
-export const WillExit = willExitContext.Provider;
-
-export function useWillExit() {
-  return useContext(willExitContext);
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/redux/store.ts b/desktop/packages/mullvad-vpn/src/renderer/redux/store.ts
index 073fe67d30..a691c7d01f 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/redux/store.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/redux/store.ts
@@ -1,8 +1,6 @@
-import { useRef } from 'react';
 import { useSelector as useReduxSelector } from 'react-redux';
 import { combineReducers, compose, createStore, Dispatch, StoreEnhancer } from 'redux';
 
-import { useWillExit } from '../lib/will-exit';
 import accountActions, { AccountAction } from './account/actions';
 import accountReducer, { IAccountReduxState } from './account/reducers';
 import connectionActions, { ConnectionAction } from './connection/actions';
@@ -76,18 +74,7 @@ function composeEnhancers(): StoreEnhancer {
   return compose();
 }
 
-// This hook adds type to state to make use simpler. It also prevents the state from update if the
-// WillExit context value is true.
+// This hook adds type to state to make use simpler.
 export function useSelector<R>(fn: (state: IReduxState) => R): R {
-  const value = useReduxSelector(fn);
-  const valueBeforeExit = useRef(value);
-  const willExit = useWillExit();
-
-  if (!willExit) {
-    // eslint-disable-next-line react-compiler/react-compiler
-    valueBeforeExit.current = value;
-  }
-
-  // eslint-disable-next-line react-compiler/react-compiler
-  return valueBeforeExit.current;
+  return useReduxSelector(fn);
 }