Fix Jest mock not working

Signed-off-by: Taylor Smock <[email protected]>

frontend/src/views/tests/fallback.test.js

@@ -6,6 +6,18 @@ import { FallbackComponent } from '../fallback';
 import { SERVICE_DESK } from '../../config';
 import messages from '../messages';
 
+/*
+ * This was in "should trigger navigate on return button click". There are
+ * references to some things being hoisted to different locations in Jest
+ * documentation. For whatever reason, we have to mock it here, instead of later
+ * in the test where we actually need to mock it.
+ */
+const mockedUsedNavigate = jest.fn();
+jest.mock('react-router-dom', () => ({
+  ...jest.requireActual('react-router-dom'),
+  useNavigate: () => mockedUsedNavigate,
+}));
+
 describe('Fallback component', () => {
   it('should render component details', () => {
     renderWithRouter(
@@ -49,13 +61,6 @@ describe('Fallback component', () => {
   });
 
   it('should trigger navigate on return button click', async () => {
-    const mockedUsedNavigate = jest.fn();
-
-    jest.mock('react-router-dom', () => ({
-      ...jest.requireActual('react-router-dom'),
-      useNavigate: () => mockedUsedNavigate,
-    }));
-
     const { user } = renderWithRouter(
       <IntlProviders>
         <FallbackComponent />