refactor: tie redux store to react router

package.json

@@ -105,7 +105,9 @@
     "@types/react-canvas-draw": "^1.1.1",
     "byte-data": "^19.0.1",
     "classnames": "^2.2.6",
+    "connected-react-router": "^6.9.2",
     "geolib": "^3.3.3",
+    "history": "^4.10.1",
     "immer": "^9.0.3",
     "lodash": "^4.17.20",
     "msfs-geo": "^0.1.0-alpha3",

src/instruments/src/EFB/Dashboard/Widgets/Reminders/MaintenanceReminder.tsx

@@ -23,7 +23,7 @@ const ActiveFailureCard: FC<ActiveFailureCardProps> = ({ ata, name }) => {
             onClick={() => {
                 dispatch(setSearchQuery(name.toUpperCase()));
 
-                const lastFailurePath = findLatestSeenPathname(history, '/failures');
+                const lastFailurePath = findLatestSeenPathname('/failures');
 
                 if (!ata) {
                     history.push('/failures/compact');

src/instruments/src/EFB/Efb.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 
-import { Redirect, Route, Switch } from 'react-router-dom';
+import { Redirect, Route, Switch, useHistory } from 'react-router-dom';
 import { useSimVar } from '@instruments/common/simVars';
 import { useInteractionEvent } from '@instruments/common/hooks';
 import { Battery, BatteryCharging } from 'react-bootstrap-icons';
@@ -77,7 +77,21 @@ interface BatteryStatus {
 
 export const usePower = () => React.useContext(PowerContext);
 
+type HistoryEntry = {pathname: string, search: string, hash: string, state: any, key: string};
+export const historyEntries: HistoryEntry[] = [];
+
 const Efb = () => {
+    const history = useHistory();
+
+    useEffect(() => {
+        history.push('/');
+        history.listen((route) => {
+            historyEntries.push(route as HistoryEntry);
+        });
+
+        document.documentElement.classList.add(`theme-${theme}`);
+    }, []);
+
     // TODO: CHANGE ME
     const [powerState, setPowerState] = useState<PowerStates>(PowerStates.LOADED);
     const [currentLocalTime] = useSimVar('E:LOCAL TIME', 'seconds', 3000);
@@ -107,10 +121,6 @@ const Efb = () => {
 
     const { showModal } = useModals();
 
-    useEffect(() => {
-        document.documentElement.classList.add(`theme-${theme}`);
-    }, []);
-
     useEffect(() => {
         const remainingDistance = distanceTo(
             { lat, long },

src/instruments/src/EFB/Store/reducers.ts

@@ -0,0 +1,29 @@
+import { combineReducers } from 'redux';
+import { connectRouter } from 'connected-react-router';
+
+import todCalculatorReducer from './features/todCalculator';
+import buttonsReducer from './features/buttons';
+import simbriefReducer from './features/simBrief';
+import performanceReducer from './features/performance';
+import flightProgressReducer from './features/flightProgress';
+import navigationTabReducer from './features/navigationPage';
+import dashboardReducer from './features/dashboard';
+import checklistsReducer from './features/checklists';
+import keyboardReducer from './features/keyboard';
+import dispatchPageReducer from './features/dispatchPage';
+import failuresPageReducer from './features/failuresPage';
+
+export const createRootReducer = (history) => combineReducers({
+    router: connectRouter(history),
+    todCalculator: todCalculatorReducer,
+    buttons: buttonsReducer,
+    simbrief: simbriefReducer,
+    performance: performanceReducer,
+    flightProgress: flightProgressReducer,
+    navigationTab: navigationTabReducer,
+    dashboard: dashboardReducer,
+    trackingChecklists: checklistsReducer,
+    keyboard: keyboardReducer,
+    dispatchPage: dispatchPageReducer,
+    failuresPage: failuresPageReducer,
+});