@player-tools/devtools-client 0.2.1-next.4 → 0.2.2--canary.17.363

package/README.md

@@ -1,3 +1,3 @@
 # devtools-client
 
-Package responsible for providing the common constructs (TODO: maybe even including redux) responsible for managing state and consuming events and RPCs.
+Package responsible for providing the common constructs responsible for managing state and consuming events and async actions from a devtools client, i.e. flipper plugin or web extension.

package/dist/index.cjs.js

@@ -2,32 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var devtoolsCommon = require('@player-tools/devtools-common');
 var toolkit = require('@reduxjs/toolkit');
-
-const GET_INFO_DETAILS = "GET_INFO_DETAILS";
-const GET_CONFIG_DETAILS = "GET_CONFIG_DETAILS";
-const GET_VIEW_DETAILS = "GET_VIEW_DETAILS";
-const GET_DATA_BINDING_DETAILS = "GET_DATA_BINDING_DETAILS";
-const GET_CONSOLE_EVAL = "GET_CONSOLE_EVAL";
-const START_PROFILER = "START_PROFILER";
-const STOP_PROFILER = "STOP_PROFILER";
-const _alias = (aliases) => () => (next) => (action) => {
-  const alias = aliases[action.type];
-  if (alias) {
-    return next(alias(action));
-  }
-  return next(action);
-};
-const buildAliases = (actions) => _alias({
-  GET_INFO_DETAILS: (action) => actions["player-runtime-info-request"](action.payload),
-  GET_CONFIG_DETAILS: (action) => actions["player-config-request"](action.payload),
-  GET_VIEW_DETAILS: (action) => actions["player-view-details-request"](action.payload),
-  GET_DATA_BINDING_DETAILS: (action) => actions["player-data-binding-details"](action.payload),
-  GET_CONSOLE_EVAL: (action) => actions["player-execute-expression"](action.payload),
-  START_PROFILER: (action) => actions["player-start-profiler-request"](action.payload),
-  STOP_PROFILER: (action) => actions["player-stop-profiler-request"](action.payload)
-});
+var devtoolsCommon = require('@player-tools/devtools-common');
 
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
@@ -50,18 +26,85 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 const logger = devtoolsCommon.createLogger(devtoolsCommon.BACKGROUND_SOURCE);
-const buildRPCActions = (handlers) => devtoolsCommon.Runtime.RuntimeRPCTypes.reduce((acc, rpcType) => {
-  acc[rpcType] = toolkit.createAsyncThunk(rpcType, (params) => __async(undefined, null, function* () {
-    logger.log(`Requesting ${rpcType}`, params);
-    const data = yield handlers[rpcType].call(params);
-    logger.log(`Response from ${rpcType}`, data);
+exports.Methods = void 0;
+(function(Methods2) {
+  Methods2.buildAsyncThunks = (onMethodRequest) => Object.fromEntries(devtoolsCommon.Methods.MethodTypes.map((method) => [method, toolkit.createAsyncThunk(method, (method2) => __async(this, null, function* () {
+    logger.log(`Requesting ${method2.type}`, method2.params);
+    const data = yield onMethodRequest(method2);
+    logger.log(`Response from ${method2.type}`, data);
     return data;
-  }));
-  return acc;
-}, {});
+  }))]));
+})(exports.Methods || (exports.Methods = {}));
+exports.Events = void 0;
+(function(Events2) {
+  Events2.actions = Object.fromEntries(devtoolsCommon.Events.EventTypes.map((event) => [event, toolkit.createAction(event)]));
+})(exports.Events || (exports.Events = {}));
+const Actions = {
+  "selected-player": toolkit.createAction("selected-player"),
+  "player-timeline-event": toolkit.createAction("player-timeline-event"),
+  "clear-selected-data-details": toolkit.createAction("clear-selected-data-details"),
+  "clear-console": toolkit.createAction("clear-console"),
+  "clear-logs": toolkit.createAction("clear-logs"),
+  "clear-store": toolkit.createAction("clear-store")
+};
+
+const GET_INFO_DETAILS = "GET_INFO_DETAILS";
+const GET_CONFIG_DETAILS = "GET_CONFIG_DETAILS";
+const GET_VIEW_DETAILS = "GET_VIEW_DETAILS";
+const GET_DATA_BINDING_DETAILS = "GET_DATA_BINDING_DETAILS";
+const GET_CONSOLE_EVAL = "GET_CONSOLE_EVAL";
+const START_PROFILER = "START_PROFILER";
+const STOP_PROFILER = "STOP_PROFILER";
+const _alias = (aliases) => () => (next) => (action) => {
+  const alias2 = aliases[action.type];
+  if (alias2) {
+    return next(alias2(action));
+  }
+  return next(action);
+};
+const alias = (alias2, methods) => (action) => methods[alias2](action.payload);
+const buildAliases = (methods) => _alias({
+  GET_INFO_DETAILS: alias("player-runtime-info-request", methods),
+  GET_CONFIG_DETAILS: alias("player-config-request", methods),
+  GET_VIEW_DETAILS: alias("player-view-details-request", methods),
+  GET_DATA_BINDING_DETAILS: alias("player-data-binding-details", methods),
+  GET_CONSOLE_EVAL: alias("player-execute-expression", methods),
+  START_PROFILER: alias("player-start-profiler-request", methods),
+  STOP_PROFILER: alias("player-stop-profiler-request", methods)
+});
 
-const buildPlayerReducerCallback = (actions) => (builder) => {
-  builder.addCase(actions["player-runtime-info-request"].fulfilled, (state, action) => {
+function handleMessage(message) {
+  const { type } = message;
+  if (type in devtoolsCommon.Events.EventTypes) {
+    exports.Events.actions[type](message);
+  }
+}
+
+var __defProp$1 = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const initialState = {
+  selectedPlayerId: null,
+  activePlayers: {}
+};
+const methodsReducer = (methods) => (builder) => {
+  builder.addCase(methods["player-runtime-info-request"].fulfilled, (state, action) => {
     const { activePlayers, selectedPlayerId } = state;
     if (!selectedPlayerId) {
       return;
@@ -69,14 +112,14 @@ const buildPlayerReducerCallback = (actions) => (builder) => {
     const data = action.payload && Object.keys(action.payload).length > 0 ? action.payload : null;
     activePlayers[selectedPlayerId].flowInfo = data;
   });
-  builder.addCase(actions["player-config-request"].fulfilled, (state, action) => {
+  builder.addCase(methods["player-config-request"].fulfilled, (state, action) => {
     const { activePlayers, selectedPlayerId } = state;
     if (!selectedPlayerId) {
       return;
     }
     activePlayers[selectedPlayerId].configState = action.payload;
   });
-  builder.addCase(actions["player-view-details-request"].fulfilled, (state, action) => {
+  builder.addCase(methods["player-view-details-request"].fulfilled, (state, action) => {
     var _a;
     const { activePlayers, selectedPlayerId } = state;
     if (!selectedPlayerId) {
@@ -84,10 +127,10 @@ const buildPlayerReducerCallback = (actions) => (builder) => {
     }
     activePlayers[selectedPlayerId].view = (_a = action.payload) == null ? void 0 : _a.lastViewUpdate;
   });
-  builder.addCase(actions["player-data-binding-details"].fulfilled, (state, action) => {
+  builder.addCase(methods["player-data-binding-details"].fulfilled, (state, action) => {
     const {
       meta: {
-        arg: { binding, playerID }
+        arg: { params: { binding, playerID } }
       },
       payload
     } = action;
@@ -101,7 +144,7 @@ const buildPlayerReducerCallback = (actions) => (builder) => {
     }
     activePlayers[playerID].dataState.selectedBinding = payload;
   });
-  builder.addCase(actions["player-execute-expression"].fulfilled, (state, action) => {
+  builder.addCase(methods["player-execute-expression"].fulfilled, (state, action) => {
     var _a, _b, _c, _d;
     const { activePlayers, selectedPlayerId } = state;
     if (!selectedPlayerId) {
@@ -113,14 +156,14 @@ const buildPlayerReducerCallback = (actions) => (builder) => {
       expression: (_c = (_b = action.payload) == null ? void 0 : _b.exp) != null ? _c : ""
     });
   });
-  builder.addCase(actions["player-start-profiler-request"].fulfilled, (state, action) => {
+  builder.addCase(methods["player-start-profiler-request"].fulfilled, (state, action) => {
     var _a;
     const { activePlayers, selectedPlayerId } = state;
     if (!selectedPlayerId)
       return;
     activePlayers[selectedPlayerId].profilerInfo = (_a = action.payload) == null ? void 0 : _a.data;
   });
-  builder.addCase(actions["player-stop-profiler-request"].fulfilled, (state, action) => {
+  builder.addCase(methods["player-stop-profiler-request"].fulfilled, (state, action) => {
     var _a;
     const { activePlayers, selectedPlayerId } = state;
     if (!selectedPlayerId)
@@ -128,60 +171,238 @@ const buildPlayerReducerCallback = (actions) => (builder) => {
     activePlayers[selectedPlayerId].profilerInfo = (_a = action.payload) == null ? void 0 : _a.data;
   });
 };
+const eventsReducer = (builder) => {
+  builder.addCase(exports.Events.actions["player-init"], (state, action) => {
+    const {
+      payload: { version, playerID }
+    } = action;
+    state.activePlayers[playerID] = {
+      timelineEvents: [],
+      dataState: {},
+      consoleState: { history: [] }
+    };
+    state.version = version;
+  });
+  builder.addCase(exports.Events.actions["player-removed"], (state, action) => {
+    delete state.activePlayers[action.payload.playerID];
+  });
+  builder.addCase(exports.Events.actions["player-flow-start"], (state, action) => {
+    const {
+      payload: { flow, playerID }
+    } = action;
+    if (!state.activePlayers[playerID]) {
+      state.activePlayers[playerID] = {
+        flowInfo: { currentFlow: flow },
+        timelineEvents: [],
+        dataState: {},
+        consoleState: { history: [] }
+      };
+      state.selectedPlayerId = playerID;
+      return;
+    }
+    state.activePlayers[playerID].flowInfo = __spreadProps(__spreadValues$1({}, state.activePlayers[playerID].flowInfo), {
+      currentFlow: flow
+    });
+  });
+  builder.addCase(exports.Events.actions["player-view-update-event"], (state, action) => {
+    const {
+      payload: { playerID, update }
+    } = action;
+    if (!state.activePlayers[playerID]) {
+      state.activePlayers[playerID] = {
+        view: update,
+        timelineEvents: [],
+        dataState: {},
+        consoleState: { history: [] }
+      };
+      state.selectedPlayerId = playerID;
+      return;
+    }
+    state.activePlayers[playerID].view = update;
+  });
+};
+const actionsReducer = (builder) => {
+  builder.addCase(Actions["selected-player"], (state, action) => {
+    if (action.payload) {
+      state.selectedPlayerId = action.payload;
+      return;
+    }
+    state.selectedPlayerId = Object.keys(state.activePlayers)[0] || null;
+  });
+  builder.addCase(Actions["player-timeline-event"], (state, action) => {
+    const {
+      payload: { playerID }
+    } = action;
+    if (!state.activePlayers[playerID]) {
+      state.activePlayers[playerID] = {
+        timelineEvents: [action.payload],
+        dataState: {},
+        consoleState: { history: [] }
+      };
+      state.selectedPlayerId = playerID;
+      return;
+    }
+    state.activePlayers[playerID].timelineEvents.push(action.payload);
+  });
+  builder.addCase(Actions["clear-selected-data-details"], (state) => {
+    const { activePlayers, selectedPlayerId } = state;
+    if (!selectedPlayerId || !activePlayers[selectedPlayerId]) {
+      return;
+    }
+    activePlayers[selectedPlayerId].dataState.selectedBinding = void 0;
+  });
+  builder.addCase(Actions["clear-console"], (state) => {
+    const { activePlayers, selectedPlayerId } = state;
+    if (!selectedPlayerId) {
+      return;
+    }
+    activePlayers[selectedPlayerId].consoleState = {
+      history: []
+    };
+  });
+  builder.addCase(Actions["clear-logs"], (state) => {
+    const { activePlayers, selectedPlayerId } = state;
+    if (!selectedPlayerId) {
+      return;
+    }
+    activePlayers[selectedPlayerId].timelineEvents = [];
+  });
+  builder.addCase(Actions["clear-store"], () => {
+    return initialState;
+  });
+};
+const playersReducer = (methods) => toolkit.createReducer(initialState, (builder) => {
+  actionsReducer(builder);
+  eventsReducer(builder);
+  methodsReducer(methods)(builder);
+});
 
-function handleMessage(store, message) {
-  switch (message.type) {
-    case "runtime-init":
-      store.dispatch(devtoolsCommon.clearStore());
-      break;
-    case "player-init":
-      store.dispatch(devtoolsCommon.playerInitAction(message));
-      store.dispatch(devtoolsCommon.selectedPlayerAction());
-      break;
-    case "player-removed":
-      store.dispatch(devtoolsCommon.playerRemoveAction(message.playerID));
-      store.dispatch(devtoolsCommon.selectedPlayerAction());
-      break;
-    case "player-flow-start":
-      store.dispatch(devtoolsCommon.playerFlowStartAction(message));
-      store.dispatch(devtoolsCommon.playerTimelineAction(message));
-      store.dispatch({
-        type: GET_DATA_BINDING_DETAILS,
-        payload: { playerID: message.playerID, binding: "" }
-      });
-      break;
-    case "player-log-event":
-      store.dispatch(devtoolsCommon.playerTimelineAction(message));
-      break;
-    case "player-view-update-event":
-      store.dispatch(devtoolsCommon.playerViewUpdateAction(message));
-      break;
-    case "player-data-change-event": {
-      const { players } = store.getState();
-      if (players.activePlayers[message.playerID] && players.activePlayers[message.playerID].dataState.selectedBinding) {
-        store.dispatch({
-          type: GET_DATA_BINDING_DETAILS,
-          payload: message
-        });
-      }
-      store.dispatch({
+const selectPlayers = (state) => {
+  return state.players;
+};
+const selectActivePlayers = toolkit.createSelector(selectPlayers, (players) => players.activePlayers);
+const selectPlayerVersion = toolkit.createSelector(selectPlayers, (players) => players.version);
+const selectPlayerIds = toolkit.createSelector(selectActivePlayers, (activePlayers) => Object.keys(activePlayers) || []);
+const selectSelectedPlayerId = toolkit.createSelector(selectPlayers, (players) => players.selectedPlayerId);
+const selectCurrentPlayer = toolkit.createSelector(selectActivePlayers, selectSelectedPlayerId, (activePlayers, selectedPlayerId) => {
+  if (!selectedPlayerId) {
+    return null;
+  }
+  return activePlayers[selectedPlayerId];
+});
+const selectConfig = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  var _a;
+  return (_a = currentPlayer == null ? void 0 : currentPlayer.configState) != null ? _a : null;
+});
+const selectData = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  return currentPlayer == null ? void 0 : currentPlayer.dataState;
+});
+const selectFlowInfo = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  if (!currentPlayer) {
+    return null;
+  }
+  return currentPlayer == null ? void 0 : currentPlayer.flowInfo;
+});
+const selectCurrentFlow = toolkit.createSelector(selectFlowInfo, (flowInfo) => {
+  return flowInfo == null ? void 0 : flowInfo.currentFlow;
+});
+const selectCurrentTopic = toolkit.createSelector(selectCurrentFlow, (currentFlow) => {
+  return currentFlow == null ? void 0 : currentFlow.topic;
+});
+const selectEvents = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  if (!currentPlayer) {
+    return [];
+  }
+  return currentPlayer == null ? void 0 : currentPlayer.timelineEvents;
+});
+const selectView = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  if (!currentPlayer) {
+    return null;
+  }
+  return currentPlayer == null ? void 0 : currentPlayer.view;
+});
+const selectAllBindings = toolkit.createSelector(selectData, (data) => {
+  return data == null ? void 0 : data.allBindings;
+});
+const selectSelectedBinding = toolkit.createSelector(selectData, (data) => {
+  return data == null ? void 0 : data.selectedBinding;
+});
+const selectConsole = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  if (!currentPlayer) {
+    return { history: [] };
+  }
+  return currentPlayer.consoleState;
+});
+const selectProfiler = toolkit.createSelector(selectCurrentPlayer, (currentPlayer) => {
+  return currentPlayer == null ? void 0 : currentPlayer.profilerInfo;
+});
+
+const listenerMiddleware = toolkit.createListenerMiddleware();
+listenerMiddleware.startListening({
+  matcher: toolkit.isAnyOf(exports.Events.actions["player-data-change-event"], exports.Events.actions["player-log-event"], exports.Events.actions["player-flow-start"], exports.Events.actions["player-view-update-event"]),
+  effect: (action, api) => {
+    api.dispatch(Actions["player-timeline-event"](action.payload));
+  }
+});
+listenerMiddleware.startListening({
+  actionCreator: exports.Events.actions["runtime-init"],
+  effect: (_, api) => {
+    api.dispatch(Actions["clear-store"]());
+  }
+});
+listenerMiddleware.startListening({
+  matcher: toolkit.isAnyOf(exports.Events.actions["player-init"], exports.Events.actions["player-removed"]),
+  effect: (_, api) => {
+    api.dispatch(Actions["selected-player"]());
+  }
+});
+listenerMiddleware.startListening({
+  matcher: toolkit.isAnyOf(exports.Events.actions["player-flow-start"], exports.Events.actions["player-data-change-event"]),
+  effect: (action, api) => {
+    const { players } = api.getState();
+    const { playerID } = action.payload;
+    if (players.activePlayers[playerID] && players.activePlayers[playerID].dataState.selectedBinding) {
+      api.dispatch({
         type: GET_DATA_BINDING_DETAILS,
-        payload: { playerID: message.playerID, binding: "" }
+        payload: { playerID, binding: players.activePlayers[playerID].dataState.selectedBinding }
       });
-      store.dispatch(devtoolsCommon.playerTimelineAction(message));
-      break;
     }
-    default:
-      console.warn(`Unhandled event: ${JSON.stringify(message)}`);
-      break;
+    api.dispatch({
+      type: GET_DATA_BINDING_DETAILS,
+      payload: { playerID, binding: "" }
+    });
   }
-}
+});
 
-const buildRPCRequests = (onRequestMessage) => devtoolsCommon.Runtime.RuntimeRPCTypes.reduce((acc, rpcType) => {
-  acc[rpcType] = devtoolsCommon.createRPCRequest(rpcType, devtoolsCommon.PANEL_SOURCE, onRequestMessage);
-  return acc;
-}, {});
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+const createDevtoolsStore = (onMethodRequest, middleware, additionalReducers) => toolkit.configureStore({
+  reducer: __spreadValues({
+    players: playersReducer(exports.Methods.buildAsyncThunks(onMethodRequest))
+  }, additionalReducers),
+  middleware: (getDefaultMiddleware) => {
+    const m = getDefaultMiddleware().concat(listenerMiddleware.middleware);
+    if (middleware)
+      m.prepend(middleware);
+    return m;
+  }
+});
 
+exports.Actions = Actions;
 exports.GET_CONFIG_DETAILS = GET_CONFIG_DETAILS;
 exports.GET_CONSOLE_EVAL = GET_CONSOLE_EVAL;
 exports.GET_DATA_BINDING_DETAILS = GET_DATA_BINDING_DETAILS;
@@ -189,15 +410,25 @@ exports.GET_INFO_DETAILS = GET_INFO_DETAILS;
 exports.GET_VIEW_DETAILS = GET_VIEW_DETAILS;
 exports.START_PROFILER = START_PROFILER;
 exports.STOP_PROFILER = STOP_PROFILER;
+exports.actionsReducer = actionsReducer;
 exports.buildAliases = buildAliases;
-exports.buildPlayerReducerCallback = buildPlayerReducerCallback;
-exports.buildRPCActions = buildRPCActions;
-exports.buildRPCRequests = buildRPCRequests;
+exports.createDevtoolsStore = createDevtoolsStore;
+exports.eventsReducer = eventsReducer;
 exports.handleMessage = handleMessage;
-Object.keys(devtoolsCommon).forEach(function (k) {
-  if (k !== 'default' && !exports.hasOwnProperty(k)) Object.defineProperty(exports, k, {
-    enumerable: true,
-    get: function () { return devtoolsCommon[k]; }
-  });
-});
+exports.methodsReducer = methodsReducer;
+exports.playersReducer = playersReducer;
+exports.selectAllBindings = selectAllBindings;
+exports.selectConfig = selectConfig;
+exports.selectConsole = selectConsole;
+exports.selectCurrentFlow = selectCurrentFlow;
+exports.selectCurrentPlayer = selectCurrentPlayer;
+exports.selectCurrentTopic = selectCurrentTopic;
+exports.selectEvents = selectEvents;
+exports.selectFlowInfo = selectFlowInfo;
+exports.selectPlayerIds = selectPlayerIds;
+exports.selectPlayerVersion = selectPlayerVersion;
+exports.selectProfiler = selectProfiler;
+exports.selectSelectedBinding = selectSelectedBinding;
+exports.selectSelectedPlayerId = selectSelectedPlayerId;
+exports.selectView = selectView;
 //# sourceMappingURL=index.cjs.js.map