fix(app): remove remotedev option (#845)

extension/src/app/stores/windowStore.ts

@@ -66,16 +66,13 @@ export default function configureStore(
     );
   }
   const store = createStore(persistedReducer, enhancer);
-  const persistor = persistStore(store);
-
-  if (
-    store.getState().connection.options.hostname &&
-    store.getState().connection.options.port
-  ) {
+  const persistor = persistStore(store, null, () => {
+    if (store.getState().connection.type !== 'disabled') {
       store.dispatch({
         type: CONNECT_REQUEST,
       });
     }
+  });
 
   return { store, persistor };
 }

packages/redux-devtools-app/src/actions/index.ts

@@ -332,7 +332,7 @@ export function toggleDispatcher(): ToggleDispatcherAction {
   return { type: TOGGLE_DISPATCHER };
 }
 
-export type ConnectionType = 'disabled' | 'remotedev' | 'custom';
+export type ConnectionType = 'disabled' | 'custom';
 export interface ConnectionOptions {
   readonly type: ConnectionType;
   readonly hostname: string;

packages/redux-devtools-app/src/components/Settings/Connection.tsx

@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import { connect, ResolveThunks } from 'react-redux';
 import { Container, Form } from 'devui';
 import {
-  JSONSchema7,
   JSONSchema7Definition,
   JSONSchema7Type,
   JSONSchema7TypeName,
@@ -33,12 +32,8 @@ const defaultSchema: Schema = {
     type: {
       title: 'Connection settings (for getting reports and remote debugging)',
       type: 'string',
-      enum: ['disabled', 'remotedev', 'custom'],
-      enumNames: [
-        'no remote connection',
-        'connect via remotedev.io',
-        'use local (custom) server',
-      ],
+      enum: ['disabled', 'custom'],
+      enumNames: ['no remote connection', 'use local (custom) server'],
     },
     hostname: {
       type: 'string',

packages/redux-devtools-app/src/constants/socketOptions.ts

@@ -1,12 +0,0 @@
-const socketOptions = {
-  hostname: 'remotedev.io',
-  port: 443,
-  protocol: 'https',
-  autoReconnect: true,
-  secure: true,
-  autoReconnectOptions: {
-    randomness: 30000,
-  },
-};
-
-export default socketOptions;

packages/redux-devtools-app/src/index.tsx

@@ -14,13 +14,18 @@ class Root extends Component {
   persistor?: Persistor;
 
   UNSAFE_componentWillMount() {
-    const { store, persistor } = configureStore();
-    this.store = store;
-    this.persistor = persistor;
+    const { store, persistor } = configureStore(
+      (store: Store<StoreState, StoreAction>) => {
+        if (store.getState().connection.type !== 'disabled') {
           store.dispatch({
             type: CONNECT_REQUEST,
           });
         }
+      }
+    );
+    this.store = store;
+    this.persistor = persistor;
+  }
 
   render() {
     if (!this.store) return null;

packages/redux-devtools-app/src/middlewares/api.ts

@@ -1,7 +1,6 @@
 import socketCluster, { SCClientSocket } from 'socketcluster-client';
 import { stringify } from 'jsan';
 import { Dispatch, MiddlewareAPI } from 'redux';
-import socketOptions from '../constants/socketOptions';
 import * as actions from '../constants/socketActionTypes';
 import { getActiveInstance } from '../reducers/instances';
 import {
@@ -193,9 +192,7 @@ function connect() {
   if (process.env.NODE_ENV === 'test') return;
   const connection = store.getState().connection;
   try {
-    socket = socketCluster.create(
-      connection.type === 'remotedev' ? socketOptions : connection.options
-    );
+    socket = socketCluster.create(connection.options);
     handleConnection();
   } catch (error) {
     store.dispatch({ type: actions.CONNECT_ERROR, error });
@@ -204,8 +201,10 @@ function connect() {
 }
 
 function disconnect() {
+  if (socket) {
     socket.disconnect();
     socket.off();
+  }
 }
 
 function login() {

packages/redux-devtools-app/src/reducers/connection.ts

@@ -14,7 +14,7 @@ export interface ConnectionState {
 export default function connection(
   state: ConnectionState = {
     options: { hostname: 'localhost', port: 8000, secure: false },
-    type: 'remotedev',
+    type: 'disabled',
   },
   action: StoreAction
 ) {

packages/redux-devtools-app/src/store/configureStore.ts

@@ -1,4 +1,4 @@
-import { createStore, compose, applyMiddleware, Reducer } from 'redux';
+import { createStore, compose, applyMiddleware, Reducer, Store } from 'redux';
 import localForage from 'localforage';
 import { persistReducer, persistStore } from 'redux-persist';
 import api from '../middlewares/api';
@@ -17,7 +17,9 @@ const persistedReducer: Reducer<StoreState, StoreAction> = persistReducer(
   rootReducer
 ) as any;
 
-export default function configureStore() {
+export default function configureStore(
+  callback: (store: Store<StoreState, StoreAction>) => void
+) {
   let composeEnhancers = compose;
   if (process.env.NODE_ENV !== 'production') {
     if (
@@ -47,6 +49,8 @@ export default function configureStore() {
     persistedReducer,
     composeEnhancers(applyMiddleware(exportState, api))
   );
-  const persistor = persistStore(store);
+  const persistor = persistStore(store, null, () => {
+    callback(store);
+  });
   return { store, persistor };
 }