Merge branch 'master' into apollo

Author: jhen0409

README.md

@@ -14,14 +14,16 @@ This is a standalone app for debugging React Native apps:
 
 ## Installation
 
-The prebuilt binaries can be found on the [releases](https://github.com/jhen0409/react-native-debugger/releases) page.
+To install the app, you can download a prebuilt binary from the [release page](https://github.com/jhen0409/react-native-debugger/releases).
 
 For **macOS**, you can use [Homebrew Cask](https://caskroom.github.io) to install:
 
 ```bash
 $ brew update && brew cask install react-native-debugger
 ```
 
+This puts `React Native Debugger.app` in your `/applications/` folder.
+
 ## Documentation
 
 * [Getting Started](docs/getting-started.md)

app/middlewares/delta/DeltaPatcher.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @format
- */
+*/
 
 import { checkFetchExists, patchFetchPolyfill } from './patchFetchPolyfill';
 
@@ -29,10 +29,10 @@ import { checkFetchExists, patchFetchPolyfill } from './patchFetchPolyfill';
 export default class DeltaPatcher {
   constructor() {
     this._lastBundle = {
+      id: undefined,
       pre: new Map(),
       post: new Map(),
       modules: new Map(),
-      id: undefined,
     };
     this._initialized = false;
     this._lastNumModifiedFiles = 0;
@@ -54,35 +54,65 @@ export default class DeltaPatcher {
    * Applies a Delta Bundle to the current bundle.
    */
   applyDelta(deltaBundle) {
+    const isOld = deltaBundle.id;
     // Make sure that the first received delta is a fresh one.
-    if (!this._initialized && !deltaBundle.reset) {
+    if (isOld ? !this._initialized && !deltaBundle.reset :
+      !this._initialized && !deltaBundle.base) {
       throw new Error('DeltaPatcher should receive a fresh Delta when being initialized');
     }
 
     this._initialized = true;
 
     // Reset the current delta when we receive a fresh delta.
-    if (deltaBundle.reset) {
+    if (deltaBundle.reset && isOld) {
       this._lastBundle = {
         pre: new Map(),
         post: new Map(),
         modules: new Map(),
         id: undefined,
       };
+    } else if (deltaBundle.base) {
+      this._lastBundle = {
+        id: deltaBundle.revisionId,
+        pre: deltaBundle.pre,
+        post: deltaBundle.post,
+        modules: new Map(deltaBundle.modules),
+      };
+    }
+
+    this._lastNumModifiedFiles = isOld ?
+      deltaBundle.pre.size + deltaBundle.post.size + deltaBundle.delta.size :
+      deltaBundle.modules.length;
+
+    if (deltaBundle.deleted) {
+      this._lastNumModifiedFiles += deltaBundle.deleted.length;
     }
 
-    this._lastNumModifiedFiles =
-      deltaBundle.pre.size + deltaBundle.post.size + deltaBundle.delta.size;
+    this._lastBundle.id = isOld ? deltaBundle.id : deltaBundle.revisionId;
 
     if (this._lastNumModifiedFiles > 0) {
       this._lastModifiedDate = new Date();
     }
 
-    this._patchMap(this._lastBundle.pre, deltaBundle.pre);
-    this._patchMap(this._lastBundle.post, deltaBundle.post);
-    this._patchMap(this._lastBundle.modules, deltaBundle.delta);
+    if (isOld) {
+      this._patchMap(this._lastBundle.pre, deltaBundle.pre);
+      this._patchMap(this._lastBundle.post, deltaBundle.post);
+      this._patchMap(this._lastBundle.modules, deltaBundle.delta);
+
+      this._lastBundle.id = deltaBundle.id;
+    } else {
+      for (const [key, value] of deltaBundle.modules) {
+        this._lastBundle.modules.set(key, value);
+      }
 
-    this._lastBundle.id = deltaBundle.id;
+      if (deltaBundle.deleted) {
+        for (const id of deltaBundle.deleted) {
+          this._lastBundle.modules.delete(id);
+        }
+      }
+
+      this._lastBundle.id = deltaBundle.revisionId;
+    }
 
     return this;
   }
@@ -105,11 +135,15 @@ export default class DeltaPatcher {
     return this._lastModifiedDate;
   }
 
-  getAllModules() {
-    return [].concat(
+  getAllModules(isOld) {
+    return isOld ? [].concat(
       Array.from(this._lastBundle.pre.values()),
       Array.from(this._lastBundle.modules.values()),
       Array.from(this._lastBundle.post.values())
+    ) : [].concat(
+      [this._lastBundle.pre],
+      Array.from(this._lastBundle.modules.values()),
+      [this._lastBundle.post]
     );
   }
 

app/middlewares/delta/deltaUrlToBlobUrl.js

@@ -26,13 +26,15 @@ export default async function deltaUrlToBlobUrl(deltaUrl) {
   const data = await fetch(deltaUrl + deltaBundleId);
   const bundle = await data.json();
 
-  const deltaPatcher = client.applyDelta({
+  const isOld = bundle.id;
+
+  const deltaPatcher = client.applyDelta(isOld ? {
     id: bundle.id,
     pre: new Map(bundle.pre),
     post: new Map(bundle.post),
     delta: new Map(bundle.delta),
     reset: bundle.reset,
-  });
+  } : bundle);
 
   const cachedBundle = cachedBundleUrls.get(deltaUrl);
 
@@ -49,7 +51,7 @@ export default async function deltaUrlToBlobUrl(deltaUrl) {
 
   // To make Source Maps work correctly, we need to add a newline between
   // modules.
-  const blobContent = deltaPatcher.getAllModules().map(module => `${module}\n`);
+  const blobContent = deltaPatcher.getAllModules(isOld).map(module => `${module}\n`);
 
   // Build the blob with the whole JS bundle.
   const blob = new Blob(blobContent, {

app/worker/reduxAPI.js

@@ -7,20 +7,22 @@ import {
   generateId,
   stringify,
   getSeralizeParameter,
-} from 'remotedev-utils';
-import importState from 'remotedev-utils/lib/importState';
+} from 'redux-devtools-core/lib/utils';
+import importState from 'redux-devtools-core/lib/utils/importState';
 import {
   getLocalFilter,
   isFiltered,
   filterStagedActions,
   filterState,
-} from 'remotedev-utils/lib/filters';
+} from 'redux-devtools-core/lib/utils/filters';
 
 function configureStore(next, subscriber, options) {
   return instrument(subscriber, options)(next);
 }
 
-const instances = { /* [id]: { name, store, ... } */ };
+const instances = {
+  /* [id]: { name, store, ... } */
+};
 
 let lastAction;
 let isExcess;
@@ -34,9 +36,12 @@ function getLiftedState(store, filters) {
 
 function relay(type, state, instance, action, nextActionId) {
   const {
-    filters, predicate,
-    stateSanitizer, actionSanitizer,
-    serializeState, serializeAction,
+    filters,
+    predicate,
+    stateSanitizer,
+    actionSanitizer,
+    serializeState,
+    serializeAction,
   } = instance;
 
   const message = {
@@ -45,12 +50,21 @@ function relay(type, state, instance, action, nextActionId) {
     name: instance.name,
   };
   if (state) {
-    message.payload = type === 'ERROR' ?
-      state :
-      stringify(
-        filterState(state, type, filters, stateSanitizer, actionSanitizer, nextActionId, predicate),
-        serializeState
-      );
+    message.payload =
+      type === 'ERROR'
+        ? state
+        : stringify(
+          filterState(
+            state,
+            type,
+            filters,
+            stateSanitizer,
+            actionSanitizer,
+            nextActionId,
+            predicate
+          ),
+          serializeState
+        );
   }
   if (type === 'ACTION') {
     message.action = stringify(
@@ -103,9 +117,9 @@ function exportState({ id: instanceId, store, serializeState }) {
       type: 'EXPORT',
       payload: stringify(payload, serializeState),
       committedState:
-        typeof liftedState.committedState !== 'undefined' ?
-          stringify(liftedState.committedState, serializeState) :
-          undefined,
+        typeof liftedState.committedState !== 'undefined'
+          ? stringify(liftedState.committedState, serializeState)
+          : undefined,
       instanceId,
     },
   });
@@ -228,16 +242,14 @@ export default function devToolsEnhancer(options = {}) {
   const serializeAction = getSeralizeParameter(options, 'serializeAction');
 
   return next => (reducer, initialState) => {
-    const store = configureStore(
-      next, monitorReducer, {
-        maxAge,
-        shouldCatchErrors,
-        shouldHotReload,
-        shouldRecordChanges,
-        shouldStartLocked,
-        pauseActionType,
-      }
-    )(reducer, initialState);
+    const store = configureStore(next, monitorReducer, {
+      maxAge,
+      shouldCatchErrors,
+      shouldHotReload,
+      shouldRecordChanges,
+      shouldStartLocked,
+      pauseActionType,
+    })(reducer, initialState);
 
     instances[id] = {
       name: name || id,
@@ -266,20 +278,17 @@ export default function devToolsEnhancer(options = {}) {
   };
 }
 
-const preEnhancer = instanceId => next =>
-  (reducer, initialState, enhancer) => {
-    const store = next(reducer, initialState, enhancer);
+const preEnhancer = instanceId => next => (reducer, initialState, enhancer) => {
+  const store = next(reducer, initialState, enhancer);
 
-    if (instances[instanceId]) {
-      instances[instanceId].store = store;
-    }
-    return {
-      ...store,
-      dispatch: (action) => (
-        locked ? action : store.dispatch(action)
-      ),
-    };
+  if (instances[instanceId]) {
+    instances[instanceId].store = store;
+  }
+  return {
+    ...store,
+    dispatch: action => (locked ? action : store.dispatch(action)),
   };
+};
 
 devToolsEnhancer.updateStore = (newStore, instanceId) => {
   console.warn(
@@ -309,7 +318,8 @@ devToolsEnhancer.updateStore = (newStore, instanceId) => {
 const compose = options => (...funcs) => (...args) => {
   const instanceId = generateId(options.instanceId);
   return [preEnhancer(instanceId), ...funcs].reduceRight(
-    (composed, f) => f(composed), devToolsEnhancer({ ...options, instanceId })(...args)
+    (composed, f) => f(composed),
+    devToolsEnhancer({ ...options, instanceId })(...args)
   );
 };
 

app/worker/remotedev.js

@@ -1,7 +1,7 @@
 // Edit from https://github.com/zalmoxisus/remotedev/blob/master/src/devTools.js
 
 import { stringify, parse } from 'jsan';
-import { generateId, getActionsArray } from 'remotedev-utils';
+import { generateId, getActionsArray } from 'redux-devtools-core/lib/utils';
 
 let listenerAdded;
 const listeners = {};

auto_updater.json

@@ -1,5 +1,5 @@
 {
-  "url": "https://github.com/jhen0409/react-native-debugger/releases/download/v0.8.1/rn-debugger-macos-x64.zip",
-  "name": "v0.8.1",
-  "notes": "1. Do notify before autoUpdater.checkForUpdates\n2. Rename defaultRNPackagerPorts as correct config field name"
+  "url": "https://github.com/jhen0409/react-native-debugger/releases/download/v0.8.3/rn-debugger-macos-x64.zip",
+  "name": "v0.8.3",
+  "notes": "1. Support dark mode title bar for macOS\n2. Fixed to work with RN 0.58+"
 }

dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-debugger",
-  "version": "0.8.1",
+  "version": "0.8.3",
   "productName": "React Native Debugger",
   "description": "The standalone app for React Native Debugger, with React DevTools / Redux DevTools",
   "main": "main.js",
@@ -14,7 +14,7 @@
     "adbkit": "^2.11.0",
     "apollo-client-devtools": "2.1.7-alpha.2",
     "electron-store": "^1.2.0",
-    "react-devtools-core": "^3.4.0"
+    "react-devtools-core": "^3.4.3"
   },
   "optionalDependencies": {
     "electron-named-image": "^1.0.4"