Fix extension build

extension/src/background/store/apiMiddleware.ts

@@ -18,7 +18,7 @@ import syncOptions, {
 } from '../../options/syncOptions';
 import openDevToolsWindow, { DevToolsPosition } from '../openWindow';
 import { getReport } from '../logging';
-import { Action, Dispatch, MiddlewareAPI } from 'redux';
+import { Action, Dispatch, Middleware } from 'redux';
 import type {
   ContentScriptToBackgroundMessage,
   SplitMessage,
@@ -670,10 +670,10 @@ declare global {
 
 window.syncOptions = syncOptions(toAllTabs); // Expose to the options page
 
-export default function api(
+const api: Middleware<{}, BackgroundState, Dispatch<BackgroundAction>> =
-  store: MiddlewareAPI<Dispatch<BackgroundAction>, BackgroundState>,
+  (store) => (next) => (untypedAction) => {
-) {
+    const action = untypedAction as BackgroundAction;
-  return (next: Dispatch<BackgroundAction>) => (action: BackgroundAction) => {
+
     if (action.type === LIFTED_ACTION) toContentScript(action);
     else if (action.type === TOGGLE_PERSIST) {
       togglePersist();
@@ -684,4 +684,5 @@ export default function api(
     }
     return next(action);
   };
-}
+
+export default api;

extension/src/background/store/backgroundReducer.ts

@@ -1,14 +1,17 @@
 import { combineReducers, Reducer } from 'redux';
 import { instances, InstancesState } from '@redux-devtools/app';
-import type { BackgroundAction } from './backgroundStore';
+import { BackgroundAction } from './backgroundStore';
 
 export interface BackgroundState {
   readonly instances: InstancesState;
 }
 
-const rootReducer: Reducer<BackgroundState, BackgroundAction> =
+const rootReducer: Reducer<
-  combineReducers<BackgroundState>({
+  BackgroundState,
+  BackgroundAction,
+  Partial<BackgroundState>
+> = combineReducers({
   instances,
-  });
+}) as any;
 
 export default rootReducer;

extension/src/background/store/backgroundStore.ts

@@ -1,4 +1,4 @@
-import { createStore, applyMiddleware, PreloadedState } from 'redux';
+import { createStore, applyMiddleware } from 'redux';
 import {
   CustomAction,
   DispatchAction,
@@ -60,7 +60,7 @@ export type BackgroundAction =
   | DisconnectedAction;
 
 export default function configureStore(
-  preloadedState?: PreloadedState<BackgroundState>,
+  preloadedState?: Partial<BackgroundState>,
 ) {
   return createStore(rootReducer, preloadedState, applyMiddleware(api));
   /*

extension/src/devpanel/store/panelReducer.ts

@@ -30,8 +30,11 @@ export interface StoreStateWithoutSocket {
   readonly stateTreeSettings: StateTreeSettings;
 }
 
-const rootReducer: Reducer<StoreStateWithoutSocket, StoreAction> =
+const rootReducer: Reducer<
-  combineReducers<StoreStateWithoutSocket>({
+  StoreStateWithoutSocket,
+  StoreAction,
+  Partial<StoreStateWithoutSocket>
+> = combineReducers({
   instances,
   monitor,
   reports,
@@ -40,6 +43,6 @@ const rootReducer: Reducer<StoreStateWithoutSocket, StoreAction> =
   theme,
   connection,
   stateTreeSettings,
-  });
+}) as any;
 
 export default rootReducer;

extension/src/devpanel/store/panelStore.ts

@@ -1,4 +1,4 @@
-import { createStore, applyMiddleware, Reducer } from 'redux';
+import { createStore, applyMiddleware, Reducer, Store } from 'redux';
 import localForage from 'localforage';
 import { persistReducer, persistStore } from 'redux-persist';
 import { exportStateMiddleware, StoreAction } from '@redux-devtools/app';
@@ -23,6 +23,6 @@ export default function configureStore(
     panelDispatcher(bgConnection),
   );
   const store = createStore(persistedReducer, enhancer);
-  const persistor = persistStore(store);
+  const persistor = persistStore(store as Store);
   return { store, persistor };
 }

extension/src/devpanel/store/panelSyncMiddleware.ts

@@ -7,15 +7,17 @@ import {
   TOGGLE_PERSIST,
   UPDATE_STATE,
 } from '@redux-devtools/app';
-import { Dispatch, MiddlewareAPI } from 'redux';
+import { Dispatch, Middleware } from 'redux';
 
-function panelDispatcher(bgConnection: chrome.runtime.Port) {
+function panelDispatcher(
+  bgConnection: chrome.runtime.Port,
+): Middleware<{}, StoreState, Dispatch<StoreAction>> {
   let autoselected = false;
   const tabId = chrome.devtools.inspectedWindow.tabId;
 
-  return (store: MiddlewareAPI<Dispatch<StoreAction>, StoreState>) =>
+  return (store) => (next) => (untypedAction) => {
-    (next: Dispatch<StoreAction>) =>
+    const action = untypedAction as StoreAction;
-    (action: StoreAction) => {
+
     const result = next(action);
     if (!autoselected && action.type === UPDATE_STATE && tabId) {
       autoselected = true;

extension/src/pageScript/index.ts

@@ -9,7 +9,6 @@ import {
   Action,
   ActionCreator,
   Dispatch,
-  PreloadedState,
   Reducer,
   StoreEnhancer,
   StoreEnhancerStoreCreator,
@@ -526,32 +525,26 @@ function __REDUX_DEVTOOLS_EXTENSION__<S, A extends Action<string>>(
     relayState(liftedState);
   }
 
-  const enhance =
+  const enhance = (): StoreEnhancer => (next) => {
-    (): StoreEnhancer =>
+    return <S2, A2 extends Action<string>, PreloadedState>(
-    <NextExt, NextStateExt>(
+      reducer_: Reducer<S2, A2, PreloadedState>,
-      next: StoreEnhancerStoreCreator<NextExt, NextStateExt>,
+      initialState_?: PreloadedState | undefined,
-    ): any => {
-      return <S2 extends S, A2 extends A>(
-        reducer_: Reducer<S2, A2>,
-        initialState_?: PreloadedState<S2>,
     ) => {
       if (!isAllowed(window.devToolsOptions)) {
         return next(reducer_, initialState_);
       }
 
-        store = stores[instanceId] = configureStore(
+      store = stores[instanceId] = (
-          next as StoreEnhancerStoreCreator,
+        configureStore(next, monitor.reducer, {
-          monitor.reducer,
-          {
           ...config,
           maxAge: getMaxAge as any,
-          },
+        }) as any
       )(reducer_, initialState_) as any;
 
       if (isInIframe()) setTimeout(init, 3000);
       else init();
 
-        return store;
+      return store as any;
     };
   };
 
@@ -598,11 +591,11 @@ export type InferComposedStoreExt<StoreEnhancers> = StoreEnhancers extends [
   ? HeadStoreEnhancer extends StoreEnhancer<infer StoreExt>
     ? StoreExt & InferComposedStoreExt<RestStoreEnhancers>
     : never
-  : unknown;
+  : {};
 
 const extensionCompose =
   (config: Config) =>
-  <StoreEnhancers extends readonly StoreEnhancer<unknown>[]>(
+  <StoreEnhancers extends readonly StoreEnhancer[]>(
     ...funcs: StoreEnhancers
   ): StoreEnhancer<InferComposedStoreExt<StoreEnhancers>> => {
     // @ts-ignore FIXME
@@ -619,10 +612,10 @@ const extensionCompose =
 interface ReduxDevtoolsExtensionCompose {
   (
     config: Config,
-  ): <StoreEnhancers extends readonly StoreEnhancer<unknown>[]>(
+  ): <StoreEnhancers extends readonly StoreEnhancer[]>(
     ...funcs: StoreEnhancers
   ) => StoreEnhancer<InferComposedStoreExt<StoreEnhancers>>;
-  <StoreEnhancers extends readonly StoreEnhancer<unknown>[]>(
+  <StoreEnhancers extends readonly StoreEnhancer[]>(
     ...funcs: StoreEnhancers
   ): StoreEnhancer<InferComposedStoreExt<StoreEnhancers>>;
 }
@@ -635,24 +628,22 @@ declare global {
 
 function reduxDevtoolsExtensionCompose(
   config: Config,
-): <StoreEnhancers extends readonly StoreEnhancer<unknown>[]>(
+): <StoreEnhancers extends readonly StoreEnhancer[]>(
   ...funcs: StoreEnhancers
 ) => StoreEnhancer<InferComposedStoreExt<StoreEnhancers>>;
 function reduxDevtoolsExtensionCompose<
-  StoreEnhancers extends readonly StoreEnhancer<unknown>[],
+  StoreEnhancers extends readonly StoreEnhancer[],
 >(
   ...funcs: StoreEnhancers
 ): StoreEnhancer<InferComposedStoreExt<StoreEnhancers>>;
-function reduxDevtoolsExtensionCompose(
+function reduxDevtoolsExtensionCompose(...funcs: [Config] | StoreEnhancer[]) {
-  ...funcs: [Config] | StoreEnhancer<unknown>[]
-) {
   if (funcs.length === 0) {
     return __REDUX_DEVTOOLS_EXTENSION__();
   }
   if (funcs.length === 1 && typeof funcs[0] === 'object') {
     return extensionCompose(funcs[0]);
   }
-  return extensionCompose({})(...(funcs as StoreEnhancer<unknown>[]));
+  return extensionCompose({})(...(funcs as StoreEnhancer[]));
 }
 
 window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ = reduxDevtoolsExtensionCompose;

extension/src/window/store/instanceSelectorMiddleware.ts

@@ -1,4 +1,4 @@
-import { Dispatch, MiddlewareAPI } from 'redux';
+import { Dispatch, Middleware, MiddlewareAPI } from 'redux';
 import {
   SELECT_INSTANCE,
   StoreAction,
@@ -9,7 +9,7 @@ import {
 function selectInstance(
   tabId: number,
   store: MiddlewareAPI<Dispatch<StoreAction>, StoreState>,
-  next: Dispatch<StoreAction>,
+  next: (action: unknown) => unknown,
 ) {
   const instances = store.getState().instances;
   if (instances.current === 'default') return;
@@ -33,10 +33,10 @@ function getCurrentTabId(next: (tabId: number) => void) {
   );
 }
 
-export default function popupSelector(
+const popupSelector: Middleware<{}, StoreState, Dispatch<StoreAction>> =
-  store: MiddlewareAPI<Dispatch<StoreAction>, StoreState>,
+  (store) => (next) => (untypedAction) => {
-) {
+    const action = untypedAction as StoreAction;
-  return (next: Dispatch<StoreAction>) => (action: StoreAction) => {
+
     const result = next(action);
     if (action.type === UPDATE_STATE) {
       if (chrome.devtools && chrome.devtools.inspectedWindow) {
@@ -47,4 +47,5 @@ export default function popupSelector(
     }
     return result;
   };
-}
+
+export default popupSelector;

extension/src/window/store/windowReducer.ts

@@ -13,8 +13,11 @@ import {
 import instances from './instancesReducer';
 import type { WindowStoreAction } from './windowStore';
 
-const rootReducer: Reducer<StoreState, WindowStoreAction> =
+const rootReducer: Reducer<
-  combineReducers<StoreState>({
+  StoreState,
+  WindowStoreAction,
+  Partial<StoreState>
+> = combineReducers({
   instances,
   monitor,
   socket,
@@ -24,6 +27,6 @@ const rootReducer: Reducer<StoreState, WindowStoreAction> =
   theme,
   connection,
   stateTreeSettings,
-  });
+}) as any;
 
 export default rootReducer;

extension/src/window/store/windowStore.ts

@@ -69,7 +69,7 @@ export default function configureStore(
     );
   }
   const store = createStore(persistedReducer, enhancer);
-  const persistor = persistStore(store, null, () => {
+  const persistor = persistStore(store as Store, null, () => {
     if (store.getState().connection.type !== 'disabled') {
       store.dispatch({
         type: CONNECT_REQUEST,

extension/src/window/store/windowSyncMiddleware.ts

@@ -6,16 +6,19 @@ import {
   TOGGLE_PERSIST,
   UPDATE_STATE,
 } from '@redux-devtools/app';
-import { Dispatch, MiddlewareAPI, Store } from 'redux';
+import { Dispatch, Middleware, Store } from 'redux';
 import type { BackgroundState } from '../../background/store/backgroundReducer';
-import type { WindowStoreAction } from './windowStore';
 import type { BackgroundAction } from '../../background/store/backgroundStore';
 
 const syncStores =
-  (baseStore: Store<BackgroundState, BackgroundAction>) =>
+  (
-  (store: MiddlewareAPI<Dispatch<StoreAction>, StoreState>) =>
+    baseStore: Store<BackgroundState, BackgroundAction>,
-  (next: Dispatch<WindowStoreAction>) =>
+  ): Middleware<{}, StoreState, Dispatch<StoreAction>> =>
-  (action: StoreAction) => {
+  (store) =>
+  (next) =>
+  (untypedAction) => {
+    const action = untypedAction as StoreAction;
+
     if (action.type === UPDATE_STATE) {
       return next({
         ...action,