Remove window

extension/build.mjs

@@ -22,7 +22,6 @@ await esbuild.build({
   entryPoints: [
     { out: 'background.bundle', in: 'src/background/index.ts' },
     { out: 'options.bundle', in: 'src/options/index.tsx' },
-    { out: 'window.bundle', in: 'src/window/index.tsx' },
     { out: 'remote.bundle', in: 'src/remote/index.tsx' },
     { out: 'devpanel.bundle', in: 'src/devpanel/index.tsx' },
     { out: 'devtools.bundle', in: 'src/devtools/index.ts' },
@@ -48,7 +47,7 @@ if (prod) {
 console.log();
 
 console.log('Creating HTML files...');
-const htmlFiles = ['devpanel', 'devtools', 'options', 'remote', 'window'];
+const htmlFiles = ['devpanel', 'devtools', 'options', 'remote'];
 for (const htmlFile of htmlFiles) {
   fs.writeFileSync(
     `dist/${htmlFile}.html`,

extension/src/background/openWindow.ts

@@ -58,7 +58,7 @@ export default function openDevToolsWindow(position: DevToolsPosition) {
     width: 380,
     height: window.screen.availHeight,
   };
-  let url = 'window.html';
+  let url = 'devpanel.html';
   switch (position) {
     case 'devtools-right':
       params.left =

extension/src/window/index.tsx

@@ -1,37 +0,0 @@
-import React from 'react';
-import { createRoot } from 'react-dom/client';
-import { Provider } from 'react-redux';
-import { PersistGate } from 'redux-persist/integration/react';
-import { UPDATE_STATE } from '@redux-devtools/app';
-import App from '../app/App';
-import configureStore from './store/windowStore';
-import type { MonitorMessage } from '../background/store/apiMiddleware';
-
-const position = location.hash;
-
-chrome.runtime.getBackgroundPage((window) => {
-  const { store } = window!;
-  const { store: localStore, persistor } = configureStore(store, position);
-  let name = 'monitor';
-  if (chrome && chrome.devtools && chrome.devtools.inspectedWindow) {
-    name += chrome.devtools.inspectedWindow.tabId;
-  }
-  const bg = chrome.runtime.connect({ name });
-  const update = (action?: MonitorMessage) => {
-    localStore.dispatch(action || { type: UPDATE_STATE });
-  };
-  bg.onMessage.addListener(update);
-  update();
-
-  const root = createRoot(document.getElementById('root')!);
-  root.render(
-    <Provider store={localStore}>
-      <PersistGate loading={null} persistor={persistor}>
-        <App position={position} />
-      </PersistGate>
-    </Provider>,
-  );
-});
-
-if (position === '#popup') document.body.style.minWidth = '760px';
-if (position !== '#popup') document.body.style.minHeight = '100%';

extension/src/window/store/instanceSelectorMiddleware.ts

@@ -1,51 +0,0 @@
-import { Dispatch, Middleware, MiddlewareAPI } from 'redux';
-import {
-  SELECT_INSTANCE,
-  StoreAction,
-  StoreState,
-  UPDATE_STATE,
-} from '@redux-devtools/app';
-
-function selectInstance(
-  tabId: number,
-  store: MiddlewareAPI<Dispatch<StoreAction>, StoreState>,
-  next: (action: unknown) => unknown,
-) {
-  const instances = store.getState().instances;
-  if (instances.current === 'default') return;
-  const connections = instances.connections[tabId];
-  if (connections && connections.length === 1) {
-    next({ type: SELECT_INSTANCE, selected: connections[0] });
-  }
-}
-
-function getCurrentTabId(next: (tabId: number) => void) {
-  chrome.tabs.query(
-    {
-      active: true,
-      lastFocusedWindow: true,
-    },
-    (tabs) => {
-      const tab = tabs[0];
-      if (!tab) return;
-      next(tab.id!);
-    },
-  );
-}
-
-const popupSelector: Middleware<{}, StoreState, Dispatch<StoreAction>> =
-  (store) => (next) => (untypedAction) => {
-    const action = untypedAction as StoreAction;
-
-    const result = next(action);
-    if (action.type === UPDATE_STATE) {
-      if (chrome.devtools && chrome.devtools.inspectedWindow) {
-        selectInstance(chrome.devtools.inspectedWindow.tabId, store, next);
-      } else {
-        getCurrentTabId((tabId) => selectInstance(tabId, store, next));
-      }
-    }
-    return result;
-  };
-
-export default popupSelector;

extension/src/window/store/instancesReducer.ts

@@ -1,34 +0,0 @@
-import {
-  instancesInitialState,
-  dispatchAction,
-  UPDATE_STATE,
-  SELECT_INSTANCE,
-  LIFTED_ACTION,
-  SET_PERSIST,
-} from '@redux-devtools/app';
-import type {
-  ExpandedUpdateStateAction,
-  WindowStoreAction,
-} from './windowStore';
-
-export default function instances(
-  state = instancesInitialState,
-  action: WindowStoreAction,
-) {
-  switch (action.type) {
-    case UPDATE_STATE:
-      return {
-        ...(action as ExpandedUpdateStateAction).instances,
-        selected: state.selected,
-      };
-    case LIFTED_ACTION:
-      if (action.message === 'DISPATCH') return dispatchAction(state, action);
-      return state;
-    case SELECT_INSTANCE:
-      return { ...state, selected: action.selected };
-    case SET_PERSIST:
-      return { ...state, persisted: action.payload };
-    default:
-      return state;
-  }
-}

extension/src/window/store/windowReducer.ts

@@ -1,32 +0,0 @@
-import { combineReducers, Reducer } from 'redux';
-import {
-  connection,
-  monitor,
-  notification,
-  reports,
-  section,
-  socket,
-  theme,
-  stateTreeSettings,
-  StoreState,
-} from '@redux-devtools/app';
-import instances from './instancesReducer';
-import type { WindowStoreAction } from './windowStore';
-
-const rootReducer: Reducer<
-  StoreState,
-  WindowStoreAction,
-  Partial<StoreState>
-> = combineReducers({
-  instances,
-  monitor,
-  socket,
-  reports,
-  notification,
-  section,
-  theme,
-  connection,
-  stateTreeSettings,
-}) as any;
-
-export default rootReducer;

extension/src/window/store/windowStore.ts

@@ -1,81 +0,0 @@
-import {
-  createStore,
-  compose,
-  applyMiddleware,
-  Store,
-  StoreEnhancer,
-  Reducer,
-} from 'redux';
-import localForage from 'localforage';
-import { persistReducer, persistStore } from 'redux-persist';
-import {
-  api,
-  CONNECT_REQUEST,
-  exportStateMiddleware,
-  InstancesState,
-  StoreActionWithoutUpdateState,
-  StoreState,
-  UpdateStateAction,
-} from '@redux-devtools/app';
-import syncStores from './windowSyncMiddleware';
-import instanceSelector from './instanceSelectorMiddleware';
-import rootReducer from './windowReducer';
-import type { BackgroundState } from '../../background/store/backgroundReducer';
-import type { BackgroundAction } from '../../background/store/backgroundStore';
-import type {
-  EmptyUpdateStateAction,
-  NAAction,
-} from '../../background/store/apiMiddleware';
-
-export interface ExpandedUpdateStateAction extends UpdateStateAction {
-  readonly instances: InstancesState;
-}
-
-export type WindowStoreAction =
-  | StoreActionWithoutUpdateState
-  | ExpandedUpdateStateAction
-  | NAAction
-  | EmptyUpdateStateAction;
-
-const persistConfig = {
-  key: 'redux-devtools',
-  blacklist: ['instances', 'socket'],
-  storage: localForage,
-};
-
-const persistedReducer: Reducer<StoreState, WindowStoreAction> = persistReducer(
-  persistConfig,
-  rootReducer,
-) as any;
-
-export default function configureStore(
-  baseStore: Store<BackgroundState, BackgroundAction>,
-  position: string,
-) {
-  let enhancer: StoreEnhancer;
-  const middlewares = [exportStateMiddleware, api, syncStores(baseStore)];
-  if (!position || position === '#popup') {
-    // select current tab instance for devPanel and pageAction
-    middlewares.push(instanceSelector);
-  }
-  if (process.env.NODE_ENV === 'production') {
-    enhancer = applyMiddleware(...middlewares);
-  } else {
-    enhancer = compose(
-      applyMiddleware(...middlewares),
-      window.__REDUX_DEVTOOLS_EXTENSION__
-        ? window.__REDUX_DEVTOOLS_EXTENSION__()
-        : (noop: unknown) => noop,
-    );
-  }
-  const store = createStore(persistedReducer, enhancer);
-  const persistor = persistStore(store as Store, null, () => {
-    if (store.getState().connection.type !== 'disabled') {
-      store.dispatch({
-        type: CONNECT_REQUEST,
-      });
-    }
-  });
-
-  return { store, persistor };
-}

extension/src/window/store/windowSyncMiddleware.ts

@@ -1,37 +0,0 @@
-import {
-  getActiveInstance,
-  LIFTED_ACTION,
-  StoreAction,
-  StoreState,
-  TOGGLE_PERSIST,
-  UPDATE_STATE,
-} from '@redux-devtools/app';
-import { Dispatch, Middleware, Store } from 'redux';
-import type { BackgroundState } from '../../background/store/backgroundReducer';
-import type { BackgroundAction } from '../../background/store/backgroundStore';
-
-const syncStores =
-  (
-    baseStore: Store<BackgroundState, BackgroundAction>,
-  ): Middleware<{}, StoreState, Dispatch<StoreAction>> =>
-  (store) =>
-  (next) =>
-  (untypedAction) => {
-    const action = untypedAction as StoreAction;
-
-    if (action.type === UPDATE_STATE) {
-      return next({
-        ...action,
-        instances: baseStore.getState().instances,
-      });
-    }
-    if (action.type === LIFTED_ACTION || action.type === TOGGLE_PERSIST) {
-      const instances = store.getState().instances;
-      const instanceId = getActiveInstance(instances);
-      const id = instances.options[instanceId].connectionId;
-      baseStore.dispatch({ ...action, instanceId, id } as any);
-    }
-    return next(action);
-  };
-
-export default syncStores;

extension/src/window/window.pug

@@ -1,18 +0,0 @@
-doctype html
-
-html
-  head
-    meta(charset='UTF-8')
-  title Redux DevTools
-  include ../style.pug
-
-  body
-    #root
-      div(style='position: relative')
-        img(
-          src='/img/loading.svg',
-          height=300, width=350,
-          style='position: absolute; top: 50%; left: 50%; margin-top: -150px; margin-left: -175px;'
-        )
-    link(href='/window.bundle.css', rel='stylesheet')
-    script(src='/window.bundle.js')