@player-tools/devtools-desktop-plugins-common 0.8.2--canary.174.3739 → 0.9.0-next.0

package/dist/cjs/index.cjs

@@ -145,11 +145,15 @@ var reducer = (state, transaction) => {
       return (0, import_immer.produce)(state, (draft) => {
         const { payload } = transaction;
         if (!payload.data) return state;
-        (0, import_merge.dset)(
-          draft.plugins,
-          [transaction.payload.pluginID, "flow", "data"],
-          transaction.payload.data
-        );
+        try {
+          (0, import_merge.dset)(
+            draft,
+            ["plugins", transaction.payload.pluginID, "flow", "data"],
+            transaction.payload.data
+          );
+        } catch {
+          console.error("error setting data:", transaction.payload.data);
+        }
         const message = {
           type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
           payload

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/index.ts","../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/communication-layer/index.ts","../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/reducer.ts","../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/usePluginState.ts"],"sourcesContent":["export * from \"./communication-layer\";\nexport * from \"./state\";\n","import type {\n  ExtensionSupportedEvents,\n  MessengerEvent,\n  MessengerOptions,\n  TransactionMetadata,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useState } from \"react\";\nimport { type FlipperPluginConnection, flipperClient } from \"js-flipper\";\n\ntype IntoArrays<T> = {\n  [P in keyof T]: T[P][];\n};\n\ntype CommunicationLayerMethods = Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n>;\n\ntype Callbacks = IntoArrays<CommunicationLayerMethods>;\n\n// keep track of the Flipper connection between React renders\nlet flipperConnection: FlipperPluginConnection | null = null;\n\n/** Adds a Flipper client and starts the connection */\nexport const startFlipperConnection = (\n  setLayerCallbacks: (\n    value: React.SetStateAction<IntoArrays<CommunicationLayerMethods>>\n  ) => void\n) => {\n  const listeners: Array<\n    (\n      message: TransactionMetadata & MessengerEvent<ExtensionSupportedEvents>\n    ) => void\n  > = [];\n\n  if (!flipperConnection) {\n    flipperClient\n      .start(\"player-ui-devtools\")\n      .then(() => {\n        flipperClient.addPlugin({\n          getId() {\n            return \"player-ui-devtools\";\n          },\n          onConnect(conn) {\n            flipperConnection = conn;\n\n            conn.receive(\"message::flipper\", (message) => {\n              listeners.forEach((listener) => listener(message));\n            });\n          },\n          onDisconnect() {\n            console.log(\"Flipper client disconnected\");\n            flipperConnection = null;\n          },\n        });\n      })\n      .catch((error) => {\n        console.error(\"Failed to start Flipper client\", error);\n      });\n  }\n\n  const sendMessage: CommunicationLayerMethods[\"sendMessage\"] = async (\n    message\n  ) => {\n    flipperConnection?.send(\"message::plugin\", message);\n  };\n\n  const addListener: CommunicationLayerMethods[\"addListener\"] = (listener) => {\n    listeners.push(listener);\n  };\n\n  setLayerCallbacks((current) => ({\n    sendMessage: [...current.sendMessage, sendMessage],\n    addListener: [...current.addListener, addListener],\n    removeListener: current.removeListener,\n  }));\n};\n\n/** Web extension communication layer leverage by the @player-tools/devtools-messenger */\nexport const useCommunicationLayer = (): Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n> => {\n  const flipperConnectionIsActive = localStorage.getItem(\n    \"player-ui-devtools-flipper-active\"\n  );\n\n  const [layerCallbacks, setLayerCallbacks] = useState<Callbacks>({\n    sendMessage: [],\n    addListener: [],\n    removeListener: [],\n  });\n\n  useEffect(() => {\n    if (flipperConnectionIsActive === \"true\") {\n      startFlipperConnection(setLayerCallbacks);\n    } else {\n      console.warn(\n        \"The Flipper connection is disabled. If you want to enable it, use the Player UI extension popup.\"\n      );\n    }\n\n    let windowListener: null | ((event: MessageEvent) => void) = null;\n\n    setLayerCallbacks((current) => ({\n      sendMessage: [\n        ...current.sendMessage,\n        async (message) => {\n          window.postMessage(message, \"*\");\n        },\n      ],\n      addListener: [\n        ...current.addListener,\n        (listener) => {\n          windowListener = (event: MessageEvent) => listener(event.data);\n          window.addEventListener(\"message\", windowListener);\n        },\n      ],\n      removeListener: [\n        ...current.removeListener,\n        () => {\n          if (windowListener) {\n            window.removeEventListener(\"message\", windowListener);\n          }\n        },\n      ],\n    }));\n  }, []);\n\n  const layer: Pick<\n    MessengerOptions<ExtensionSupportedEvents>,\n    \"sendMessage\" | \"addListener\" | \"removeListener\"\n  > = {\n    sendMessage: async (message) => {\n      layerCallbacks.sendMessage.forEach((callback) => callback(message));\n    },\n    addListener: (listener) => {\n      layerCallbacks.addListener.forEach((callback) => callback(listener));\n    },\n    removeListener: (listener) => {\n      layerCallbacks.removeListener.forEach((callback) => callback(listener));\n    },\n  };\n\n  return layer;\n};\n","import { produce } from \"immer\";\nimport { dequal } from \"dequal\";\nimport type {\n  DevtoolsDataChangeEvent,\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  PlayerInitEvent,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { dset } from \"dset/merge\";\n\nconst containsInteraction = (\n  interactions: DevtoolsPluginsStore[\"interactions\"],\n  interaction: DevtoolsPluginsStore[\"interactions\"][number]\n) => {\n  return interactions.filter((i) => dequal(i, interaction)).length > 0;\n};\n\n/** devtools plugin state reducer */\nexport const reducer = (\n  state: DevtoolsPluginsStore,\n  transaction: Transaction<ExtensionSupportedEvents>\n): DevtoolsPluginsStore => {\n  switch (transaction.type) {\n    case \"PLAYER_DEVTOOLS_PLAYER_INIT\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n        dset(draft, \"plugins\", payload.plugins);\n\n        const message: PlayerInitEvent = {\n          type: \"PLAYER_DEVTOOLS_PLAYER_INIT\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n\n        if (!payload.data) return state;\n\n        dset(\n          draft.plugins,\n          [transaction.payload.pluginID, \"flow\", \"data\"],\n          transaction.payload.data\n        );\n\n        const message: DevtoolsDataChangeEvent = {\n          type: \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_INTERACTION\":\n      return produce(state, (draft) => {\n        if (containsInteraction(draft.interactions, transaction)) return state;\n\n        dset(draft, [\"interactions\"], [...draft.interactions, transaction]);\n      });\n    case \"PLAYER_DEVTOOLS_SELECTED_PLAYER_CHANGE\":\n      const { playerID } = transaction.payload;\n\n      if (!playerID) return state;\n      return produce(state, (draft) => {\n        dset(draft, \"currentPlayer\", playerID);\n      });\n    default:\n      return state;\n  }\n};\n","import { Messenger } from \"@player-tools/devtools-messenger\";\nimport type {\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  MessengerOptions,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useMemo, useReducer, useRef } from \"react\";\nimport { useCommunicationLayer } from \"../communication-layer\";\nimport { reducer } from \"./reducer\";\n\nconst INITIAL_STATE: DevtoolsPluginsStore = {\n  messages: [],\n  plugins: {},\n  interactions: [],\n  currentPlayer: \"\",\n};\n\n/** devtools plugin state */\nexport const usePluginState = ({\n  playerID,\n}: {\n  playerID: string;\n}): [\n  DevtoolsPluginsStore,\n  React.Dispatch<Transaction<ExtensionSupportedEvents>>\n] => {\n  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);\n  const lastMessageIndex = useRef<number>(-1);\n  const { sendMessage, addListener, removeListener } = useCommunicationLayer();\n\n  const messenger = useMemo(() => {\n    const options: MessengerOptions<ExtensionSupportedEvents> = {\n      id: playerID,\n      context: \"player\",\n      messageCallback: (message) =>\n        dispatch(message as Parameters<typeof dispatch>[0]),\n      sendMessage,\n      addListener,\n      removeListener,\n      logger: console,\n    };\n\n    return new Messenger(options);\n  }, [addListener, removeListener, sendMessage]);\n\n  useEffect(() => {\n    if (state.messages.length > lastMessageIndex.current + 1) {\n      const messages = state.messages.slice(\n        lastMessageIndex.current + 1,\n        state.messages.length\n      );\n      lastMessageIndex.current = state.messages.length - 1;\n      messages.forEach((message) => {\n        messenger.sendMessage(message);\n      });\n    }\n  }, [state.messages, messenger]);\n\n  return [state, dispatch];\n};\n"],"mappings":"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","names":["import_react"]}
+{"version":3,"sources":["../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/index.ts","../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/communication-layer/index.ts","../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/reducer.ts","../../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/usePluginState.ts"],"sourcesContent":["export * from \"./communication-layer\";\nexport * from \"./state\";\n","import type {\n  ExtensionSupportedEvents,\n  MessengerEvent,\n  MessengerOptions,\n  TransactionMetadata,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useState } from \"react\";\nimport { type FlipperPluginConnection, flipperClient } from \"js-flipper\";\n\ntype IntoArrays<T> = {\n  [P in keyof T]: T[P][];\n};\n\ntype CommunicationLayerMethods = Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n>;\n\ntype Callbacks = IntoArrays<CommunicationLayerMethods>;\n\n// keep track of the Flipper connection between React renders\nlet flipperConnection: FlipperPluginConnection | null = null;\n\n/** Adds a Flipper client and starts the connection */\nexport const startFlipperConnection = (\n  setLayerCallbacks: (\n    value: React.SetStateAction<IntoArrays<CommunicationLayerMethods>>\n  ) => void\n) => {\n  const listeners: Array<\n    (\n      message: TransactionMetadata & MessengerEvent<ExtensionSupportedEvents>\n    ) => void\n  > = [];\n\n  if (!flipperConnection) {\n    flipperClient\n      .start(\"player-ui-devtools\")\n      .then(() => {\n        flipperClient.addPlugin({\n          getId() {\n            return \"player-ui-devtools\";\n          },\n          onConnect(conn) {\n            flipperConnection = conn;\n\n            conn.receive(\"message::flipper\", (message) => {\n              listeners.forEach((listener) => listener(message));\n            });\n          },\n          onDisconnect() {\n            console.log(\"Flipper client disconnected\");\n            flipperConnection = null;\n          },\n        });\n      })\n      .catch((error) => {\n        console.error(\"Failed to start Flipper client\", error);\n      });\n  }\n\n  const sendMessage: CommunicationLayerMethods[\"sendMessage\"] = async (\n    message\n  ) => {\n    flipperConnection?.send(\"message::plugin\", message);\n  };\n\n  const addListener: CommunicationLayerMethods[\"addListener\"] = (listener) => {\n    listeners.push(listener);\n  };\n\n  setLayerCallbacks((current) => ({\n    sendMessage: [...current.sendMessage, sendMessage],\n    addListener: [...current.addListener, addListener],\n    removeListener: current.removeListener,\n  }));\n};\n\n/** Web extension communication layer leverage by the @player-tools/devtools-messenger */\nexport const useCommunicationLayer = (): Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n> => {\n  const flipperConnectionIsActive = localStorage.getItem(\n    \"player-ui-devtools-flipper-active\"\n  );\n\n  const [layerCallbacks, setLayerCallbacks] = useState<Callbacks>({\n    sendMessage: [],\n    addListener: [],\n    removeListener: [],\n  });\n\n  useEffect(() => {\n    if (flipperConnectionIsActive === \"true\") {\n      startFlipperConnection(setLayerCallbacks);\n    } else {\n      console.warn(\n        \"The Flipper connection is disabled. If you want to enable it, use the Player UI extension popup.\"\n      );\n    }\n\n    let windowListener: null | ((event: MessageEvent) => void) = null;\n\n    setLayerCallbacks((current) => ({\n      sendMessage: [\n        ...current.sendMessage,\n        async (message) => {\n          window.postMessage(message, \"*\");\n        },\n      ],\n      addListener: [\n        ...current.addListener,\n        (listener) => {\n          windowListener = (event: MessageEvent) => listener(event.data);\n          window.addEventListener(\"message\", windowListener);\n        },\n      ],\n      removeListener: [\n        ...current.removeListener,\n        () => {\n          if (windowListener) {\n            window.removeEventListener(\"message\", windowListener);\n          }\n        },\n      ],\n    }));\n  }, []);\n\n  const layer: Pick<\n    MessengerOptions<ExtensionSupportedEvents>,\n    \"sendMessage\" | \"addListener\" | \"removeListener\"\n  > = {\n    sendMessage: async (message) => {\n      layerCallbacks.sendMessage.forEach((callback) => callback(message));\n    },\n    addListener: (listener) => {\n      layerCallbacks.addListener.forEach((callback) => callback(listener));\n    },\n    removeListener: (listener) => {\n      layerCallbacks.removeListener.forEach((callback) => callback(listener));\n    },\n  };\n\n  return layer;\n};\n","import { produce } from \"immer\";\nimport { dequal } from \"dequal\";\nimport type {\n  DevtoolsDataChangeEvent,\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  PlayerInitEvent,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { dset } from \"dset/merge\";\n\nconst containsInteraction = (\n  interactions: DevtoolsPluginsStore[\"interactions\"],\n  interaction: DevtoolsPluginsStore[\"interactions\"][number]\n) => {\n  return interactions.filter((i) => dequal(i, interaction)).length > 0;\n};\n\n/** devtools plugin state reducer */\nexport const reducer = (\n  state: DevtoolsPluginsStore,\n  transaction: Transaction<ExtensionSupportedEvents>\n): DevtoolsPluginsStore => {\n  switch (transaction.type) {\n    case \"PLAYER_DEVTOOLS_PLAYER_INIT\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n        dset(draft, \"plugins\", payload.plugins);\n\n        const message: PlayerInitEvent = {\n          type: \"PLAYER_DEVTOOLS_PLAYER_INIT\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n\n        if (!payload.data) return state;\n\n        try {\n          dset(\n            draft,\n            [\"plugins\", transaction.payload.pluginID, \"flow\", \"data\"],\n            transaction.payload.data\n          );\n        } catch {\n          console.error(\"error setting data:\", transaction.payload.data);\n        }\n        const message: DevtoolsDataChangeEvent = {\n          type: \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_INTERACTION\":\n      return produce(state, (draft) => {\n        if (containsInteraction(draft.interactions, transaction)) return state;\n\n        dset(draft, [\"interactions\"], [...draft.interactions, transaction]);\n      });\n    case \"PLAYER_DEVTOOLS_SELECTED_PLAYER_CHANGE\":\n      const { playerID } = transaction.payload;\n\n      if (!playerID) return state;\n      return produce(state, (draft) => {\n        dset(draft, \"currentPlayer\", playerID);\n      });\n    default:\n      return state;\n  }\n};\n","import { Messenger } from \"@player-tools/devtools-messenger\";\nimport type {\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  MessengerOptions,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useMemo, useReducer, useRef } from \"react\";\nimport { useCommunicationLayer } from \"../communication-layer\";\nimport { reducer } from \"./reducer\";\n\nconst INITIAL_STATE: DevtoolsPluginsStore = {\n  messages: [],\n  plugins: {},\n  interactions: [],\n  currentPlayer: \"\",\n};\n\n/** devtools plugin state */\nexport const usePluginState = ({\n  playerID,\n}: {\n  playerID: string;\n}): [\n  DevtoolsPluginsStore,\n  React.Dispatch<Transaction<ExtensionSupportedEvents>>\n] => {\n  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);\n  const lastMessageIndex = useRef<number>(-1);\n  const { sendMessage, addListener, removeListener } = useCommunicationLayer();\n\n  const messenger = useMemo(() => {\n    const options: MessengerOptions<ExtensionSupportedEvents> = {\n      id: playerID,\n      context: \"player\",\n      messageCallback: (message) =>\n        dispatch(message as Parameters<typeof dispatch>[0]),\n      sendMessage,\n      addListener,\n      removeListener,\n      logger: console,\n    };\n\n    return new Messenger(options);\n  }, [addListener, removeListener, sendMessage]);\n\n  useEffect(() => {\n    if (state.messages.length > lastMessageIndex.current + 1) {\n      const messages = state.messages.slice(\n        lastMessageIndex.current + 1,\n        state.messages.length\n      );\n      lastMessageIndex.current = state.messages.length - 1;\n      messages.forEach((message) => {\n        messenger.sendMessage(message);\n      });\n    }\n  }, [state.messages, messenger]);\n\n  return [state, dispatch];\n};\n"],"mappings":"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","names":["import_react"]}

package/dist/index.legacy-esm.js

@@ -116,11 +116,15 @@ var reducer = (state, transaction) => {
       return produce(state, (draft) => {
         const { payload } = transaction;
         if (!payload.data) return state;
-        dset(
-          draft.plugins,
-          [transaction.payload.pluginID, "flow", "data"],
-          transaction.payload.data
-        );
+        try {
+          dset(
+            draft,
+            ["plugins", transaction.payload.pluginID, "flow", "data"],
+            transaction.payload.data
+          );
+        } catch {
+          console.error("error setting data:", transaction.payload.data);
+        }
         const message = {
           type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
           payload

package/dist/index.mjs

@@ -116,11 +116,15 @@ var reducer = (state, transaction) => {
       return produce(state, (draft) => {
         const { payload } = transaction;
         if (!payload.data) return state;
-        dset(
-          draft.plugins,
-          [transaction.payload.pluginID, "flow", "data"],
-          transaction.payload.data
-        );
+        try {
+          dset(
+            draft,
+            ["plugins", transaction.payload.pluginID, "flow", "data"],
+            transaction.payload.data
+          );
+        } catch {
+          console.error("error setting data:", transaction.payload.data);
+        }
         const message = {
           type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
           payload

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/communication-layer/index.ts","../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/reducer.ts","../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/usePluginState.ts"],"sourcesContent":["import type {\n  ExtensionSupportedEvents,\n  MessengerEvent,\n  MessengerOptions,\n  TransactionMetadata,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useState } from \"react\";\nimport { type FlipperPluginConnection, flipperClient } from \"js-flipper\";\n\ntype IntoArrays<T> = {\n  [P in keyof T]: T[P][];\n};\n\ntype CommunicationLayerMethods = Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n>;\n\ntype Callbacks = IntoArrays<CommunicationLayerMethods>;\n\n// keep track of the Flipper connection between React renders\nlet flipperConnection: FlipperPluginConnection | null = null;\n\n/** Adds a Flipper client and starts the connection */\nexport const startFlipperConnection = (\n  setLayerCallbacks: (\n    value: React.SetStateAction<IntoArrays<CommunicationLayerMethods>>\n  ) => void\n) => {\n  const listeners: Array<\n    (\n      message: TransactionMetadata & MessengerEvent<ExtensionSupportedEvents>\n    ) => void\n  > = [];\n\n  if (!flipperConnection) {\n    flipperClient\n      .start(\"player-ui-devtools\")\n      .then(() => {\n        flipperClient.addPlugin({\n          getId() {\n            return \"player-ui-devtools\";\n          },\n          onConnect(conn) {\n            flipperConnection = conn;\n\n            conn.receive(\"message::flipper\", (message) => {\n              listeners.forEach((listener) => listener(message));\n            });\n          },\n          onDisconnect() {\n            console.log(\"Flipper client disconnected\");\n            flipperConnection = null;\n          },\n        });\n      })\n      .catch((error) => {\n        console.error(\"Failed to start Flipper client\", error);\n      });\n  }\n\n  const sendMessage: CommunicationLayerMethods[\"sendMessage\"] = async (\n    message\n  ) => {\n    flipperConnection?.send(\"message::plugin\", message);\n  };\n\n  const addListener: CommunicationLayerMethods[\"addListener\"] = (listener) => {\n    listeners.push(listener);\n  };\n\n  setLayerCallbacks((current) => ({\n    sendMessage: [...current.sendMessage, sendMessage],\n    addListener: [...current.addListener, addListener],\n    removeListener: current.removeListener,\n  }));\n};\n\n/** Web extension communication layer leverage by the @player-tools/devtools-messenger */\nexport const useCommunicationLayer = (): Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n> => {\n  const flipperConnectionIsActive = localStorage.getItem(\n    \"player-ui-devtools-flipper-active\"\n  );\n\n  const [layerCallbacks, setLayerCallbacks] = useState<Callbacks>({\n    sendMessage: [],\n    addListener: [],\n    removeListener: [],\n  });\n\n  useEffect(() => {\n    if (flipperConnectionIsActive === \"true\") {\n      startFlipperConnection(setLayerCallbacks);\n    } else {\n      console.warn(\n        \"The Flipper connection is disabled. If you want to enable it, use the Player UI extension popup.\"\n      );\n    }\n\n    let windowListener: null | ((event: MessageEvent) => void) = null;\n\n    setLayerCallbacks((current) => ({\n      sendMessage: [\n        ...current.sendMessage,\n        async (message) => {\n          window.postMessage(message, \"*\");\n        },\n      ],\n      addListener: [\n        ...current.addListener,\n        (listener) => {\n          windowListener = (event: MessageEvent) => listener(event.data);\n          window.addEventListener(\"message\", windowListener);\n        },\n      ],\n      removeListener: [\n        ...current.removeListener,\n        () => {\n          if (windowListener) {\n            window.removeEventListener(\"message\", windowListener);\n          }\n        },\n      ],\n    }));\n  }, []);\n\n  const layer: Pick<\n    MessengerOptions<ExtensionSupportedEvents>,\n    \"sendMessage\" | \"addListener\" | \"removeListener\"\n  > = {\n    sendMessage: async (message) => {\n      layerCallbacks.sendMessage.forEach((callback) => callback(message));\n    },\n    addListener: (listener) => {\n      layerCallbacks.addListener.forEach((callback) => callback(listener));\n    },\n    removeListener: (listener) => {\n      layerCallbacks.removeListener.forEach((callback) => callback(listener));\n    },\n  };\n\n  return layer;\n};\n","import { produce } from \"immer\";\nimport { dequal } from \"dequal\";\nimport type {\n  DevtoolsDataChangeEvent,\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  PlayerInitEvent,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { dset } from \"dset/merge\";\n\nconst containsInteraction = (\n  interactions: DevtoolsPluginsStore[\"interactions\"],\n  interaction: DevtoolsPluginsStore[\"interactions\"][number]\n) => {\n  return interactions.filter((i) => dequal(i, interaction)).length > 0;\n};\n\n/** devtools plugin state reducer */\nexport const reducer = (\n  state: DevtoolsPluginsStore,\n  transaction: Transaction<ExtensionSupportedEvents>\n): DevtoolsPluginsStore => {\n  switch (transaction.type) {\n    case \"PLAYER_DEVTOOLS_PLAYER_INIT\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n        dset(draft, \"plugins\", payload.plugins);\n\n        const message: PlayerInitEvent = {\n          type: \"PLAYER_DEVTOOLS_PLAYER_INIT\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n\n        if (!payload.data) return state;\n\n        dset(\n          draft.plugins,\n          [transaction.payload.pluginID, \"flow\", \"data\"],\n          transaction.payload.data\n        );\n\n        const message: DevtoolsDataChangeEvent = {\n          type: \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_INTERACTION\":\n      return produce(state, (draft) => {\n        if (containsInteraction(draft.interactions, transaction)) return state;\n\n        dset(draft, [\"interactions\"], [...draft.interactions, transaction]);\n      });\n    case \"PLAYER_DEVTOOLS_SELECTED_PLAYER_CHANGE\":\n      const { playerID } = transaction.payload;\n\n      if (!playerID) return state;\n      return produce(state, (draft) => {\n        dset(draft, \"currentPlayer\", playerID);\n      });\n    default:\n      return state;\n  }\n};\n","import { Messenger } from \"@player-tools/devtools-messenger\";\nimport type {\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  MessengerOptions,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useMemo, useReducer, useRef } from \"react\";\nimport { useCommunicationLayer } from \"../communication-layer\";\nimport { reducer } from \"./reducer\";\n\nconst INITIAL_STATE: DevtoolsPluginsStore = {\n  messages: [],\n  plugins: {},\n  interactions: [],\n  currentPlayer: \"\",\n};\n\n/** devtools plugin state */\nexport const usePluginState = ({\n  playerID,\n}: {\n  playerID: string;\n}): [\n  DevtoolsPluginsStore,\n  React.Dispatch<Transaction<ExtensionSupportedEvents>>\n] => {\n  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);\n  const lastMessageIndex = useRef<number>(-1);\n  const { sendMessage, addListener, removeListener } = useCommunicationLayer();\n\n  const messenger = useMemo(() => {\n    const options: MessengerOptions<ExtensionSupportedEvents> = {\n      id: playerID,\n      context: \"player\",\n      messageCallback: (message) =>\n        dispatch(message as Parameters<typeof dispatch>[0]),\n      sendMessage,\n      addListener,\n      removeListener,\n      logger: console,\n    };\n\n    return new Messenger(options);\n  }, [addListener, removeListener, sendMessage]);\n\n  useEffect(() => {\n    if (state.messages.length > lastMessageIndex.current + 1) {\n      const messages = state.messages.slice(\n        lastMessageIndex.current + 1,\n        state.messages.length\n      );\n      lastMessageIndex.current = state.messages.length - 1;\n      messages.forEach((message) => {\n        messenger.sendMessage(message);\n      });\n    }\n  }, [state.messages, messenger]);\n\n  return [state, dispatch];\n};\n"],"mappings":"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","names":["useEffect","useEffect"]}
+{"version":3,"sources":["../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/communication-layer/index.ts","../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/reducer.ts","../../../../../../../../../../../../../execroot/_main/bazel-out/k8-fastbuild/bin/devtools/plugins/desktop/common/src/state/usePluginState.ts"],"sourcesContent":["import type {\n  ExtensionSupportedEvents,\n  MessengerEvent,\n  MessengerOptions,\n  TransactionMetadata,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useState } from \"react\";\nimport { type FlipperPluginConnection, flipperClient } from \"js-flipper\";\n\ntype IntoArrays<T> = {\n  [P in keyof T]: T[P][];\n};\n\ntype CommunicationLayerMethods = Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n>;\n\ntype Callbacks = IntoArrays<CommunicationLayerMethods>;\n\n// keep track of the Flipper connection between React renders\nlet flipperConnection: FlipperPluginConnection | null = null;\n\n/** Adds a Flipper client and starts the connection */\nexport const startFlipperConnection = (\n  setLayerCallbacks: (\n    value: React.SetStateAction<IntoArrays<CommunicationLayerMethods>>\n  ) => void\n) => {\n  const listeners: Array<\n    (\n      message: TransactionMetadata & MessengerEvent<ExtensionSupportedEvents>\n    ) => void\n  > = [];\n\n  if (!flipperConnection) {\n    flipperClient\n      .start(\"player-ui-devtools\")\n      .then(() => {\n        flipperClient.addPlugin({\n          getId() {\n            return \"player-ui-devtools\";\n          },\n          onConnect(conn) {\n            flipperConnection = conn;\n\n            conn.receive(\"message::flipper\", (message) => {\n              listeners.forEach((listener) => listener(message));\n            });\n          },\n          onDisconnect() {\n            console.log(\"Flipper client disconnected\");\n            flipperConnection = null;\n          },\n        });\n      })\n      .catch((error) => {\n        console.error(\"Failed to start Flipper client\", error);\n      });\n  }\n\n  const sendMessage: CommunicationLayerMethods[\"sendMessage\"] = async (\n    message\n  ) => {\n    flipperConnection?.send(\"message::plugin\", message);\n  };\n\n  const addListener: CommunicationLayerMethods[\"addListener\"] = (listener) => {\n    listeners.push(listener);\n  };\n\n  setLayerCallbacks((current) => ({\n    sendMessage: [...current.sendMessage, sendMessage],\n    addListener: [...current.addListener, addListener],\n    removeListener: current.removeListener,\n  }));\n};\n\n/** Web extension communication layer leverage by the @player-tools/devtools-messenger */\nexport const useCommunicationLayer = (): Pick<\n  MessengerOptions<ExtensionSupportedEvents>,\n  \"sendMessage\" | \"addListener\" | \"removeListener\"\n> => {\n  const flipperConnectionIsActive = localStorage.getItem(\n    \"player-ui-devtools-flipper-active\"\n  );\n\n  const [layerCallbacks, setLayerCallbacks] = useState<Callbacks>({\n    sendMessage: [],\n    addListener: [],\n    removeListener: [],\n  });\n\n  useEffect(() => {\n    if (flipperConnectionIsActive === \"true\") {\n      startFlipperConnection(setLayerCallbacks);\n    } else {\n      console.warn(\n        \"The Flipper connection is disabled. If you want to enable it, use the Player UI extension popup.\"\n      );\n    }\n\n    let windowListener: null | ((event: MessageEvent) => void) = null;\n\n    setLayerCallbacks((current) => ({\n      sendMessage: [\n        ...current.sendMessage,\n        async (message) => {\n          window.postMessage(message, \"*\");\n        },\n      ],\n      addListener: [\n        ...current.addListener,\n        (listener) => {\n          windowListener = (event: MessageEvent) => listener(event.data);\n          window.addEventListener(\"message\", windowListener);\n        },\n      ],\n      removeListener: [\n        ...current.removeListener,\n        () => {\n          if (windowListener) {\n            window.removeEventListener(\"message\", windowListener);\n          }\n        },\n      ],\n    }));\n  }, []);\n\n  const layer: Pick<\n    MessengerOptions<ExtensionSupportedEvents>,\n    \"sendMessage\" | \"addListener\" | \"removeListener\"\n  > = {\n    sendMessage: async (message) => {\n      layerCallbacks.sendMessage.forEach((callback) => callback(message));\n    },\n    addListener: (listener) => {\n      layerCallbacks.addListener.forEach((callback) => callback(listener));\n    },\n    removeListener: (listener) => {\n      layerCallbacks.removeListener.forEach((callback) => callback(listener));\n    },\n  };\n\n  return layer;\n};\n","import { produce } from \"immer\";\nimport { dequal } from \"dequal\";\nimport type {\n  DevtoolsDataChangeEvent,\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  PlayerInitEvent,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { dset } from \"dset/merge\";\n\nconst containsInteraction = (\n  interactions: DevtoolsPluginsStore[\"interactions\"],\n  interaction: DevtoolsPluginsStore[\"interactions\"][number]\n) => {\n  return interactions.filter((i) => dequal(i, interaction)).length > 0;\n};\n\n/** devtools plugin state reducer */\nexport const reducer = (\n  state: DevtoolsPluginsStore,\n  transaction: Transaction<ExtensionSupportedEvents>\n): DevtoolsPluginsStore => {\n  switch (transaction.type) {\n    case \"PLAYER_DEVTOOLS_PLAYER_INIT\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n        dset(draft, \"plugins\", payload.plugins);\n\n        const message: PlayerInitEvent = {\n          type: \"PLAYER_DEVTOOLS_PLAYER_INIT\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\":\n      return produce(state, (draft) => {\n        const { payload } = transaction;\n\n        if (!payload.data) return state;\n\n        try {\n          dset(\n            draft,\n            [\"plugins\", transaction.payload.pluginID, \"flow\", \"data\"],\n            transaction.payload.data\n          );\n        } catch {\n          console.error(\"error setting data:\", transaction.payload.data);\n        }\n        const message: DevtoolsDataChangeEvent = {\n          type: \"PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE\",\n          payload,\n        };\n\n        draft.messages.push(message);\n      });\n    case \"PLAYER_DEVTOOLS_PLUGIN_INTERACTION\":\n      return produce(state, (draft) => {\n        if (containsInteraction(draft.interactions, transaction)) return state;\n\n        dset(draft, [\"interactions\"], [...draft.interactions, transaction]);\n      });\n    case \"PLAYER_DEVTOOLS_SELECTED_PLAYER_CHANGE\":\n      const { playerID } = transaction.payload;\n\n      if (!playerID) return state;\n      return produce(state, (draft) => {\n        dset(draft, \"currentPlayer\", playerID);\n      });\n    default:\n      return state;\n  }\n};\n","import { Messenger } from \"@player-tools/devtools-messenger\";\nimport type {\n  DevtoolsPluginsStore,\n  ExtensionSupportedEvents,\n  MessengerOptions,\n  Transaction,\n} from \"@player-tools/devtools-types\";\nimport { useEffect, useMemo, useReducer, useRef } from \"react\";\nimport { useCommunicationLayer } from \"../communication-layer\";\nimport { reducer } from \"./reducer\";\n\nconst INITIAL_STATE: DevtoolsPluginsStore = {\n  messages: [],\n  plugins: {},\n  interactions: [],\n  currentPlayer: \"\",\n};\n\n/** devtools plugin state */\nexport const usePluginState = ({\n  playerID,\n}: {\n  playerID: string;\n}): [\n  DevtoolsPluginsStore,\n  React.Dispatch<Transaction<ExtensionSupportedEvents>>\n] => {\n  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);\n  const lastMessageIndex = useRef<number>(-1);\n  const { sendMessage, addListener, removeListener } = useCommunicationLayer();\n\n  const messenger = useMemo(() => {\n    const options: MessengerOptions<ExtensionSupportedEvents> = {\n      id: playerID,\n      context: \"player\",\n      messageCallback: (message) =>\n        dispatch(message as Parameters<typeof dispatch>[0]),\n      sendMessage,\n      addListener,\n      removeListener,\n      logger: console,\n    };\n\n    return new Messenger(options);\n  }, [addListener, removeListener, sendMessage]);\n\n  useEffect(() => {\n    if (state.messages.length > lastMessageIndex.current + 1) {\n      const messages = state.messages.slice(\n        lastMessageIndex.current + 1,\n        state.messages.length\n      );\n      lastMessageIndex.current = state.messages.length - 1;\n      messages.forEach((message) => {\n        messenger.sendMessage(message);\n      });\n    }\n  }, [state.messages, messenger]);\n\n  return [state, dispatch];\n};\n"],"mappings":"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","names":["useEffect","useEffect"]}

package/package.json

@@ -6,11 +6,11 @@
     "types"
   ],
   "name": "@player-tools/devtools-desktop-plugins-common",
-  "version": "0.8.2--canary.174.3739",
+  "version": "0.9.0-next.0",
   "main": "dist/cjs/index.cjs",
   "dependencies": {
-    "@player-tools/devtools-messenger": "0.8.2--canary.174.3739",
-    "@player-tools/devtools-types": "0.8.2--canary.174.3739",
+    "@player-tools/devtools-messenger": "0.9.0-next.0",
+    "@player-tools/devtools-types": "0.9.0-next.0",
     "dequal": "^2.0.2",
     "immer": "^10.0.3",
     "dset": "^3.1.3",

package/src/state/__tests__/reducer.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, test } from "vitest";
+import { describe, expect, test, vi, beforeEach, afterEach } from "vitest";
 import { reducer } from "../reducer";
 import {
   DevtoolsPluginsStore,
@@ -58,6 +58,28 @@ const mockPluginDataChangeTransaction: Transaction<DevtoolsDataChangeEvent> = {
   },
 };
 
+const mockPluginDataChangeTransactionWithNull: Transaction<DevtoolsDataChangeEvent> =
+  {
+    ...mockTransactionMetadata,
+    type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
+    id: mockTransactionID++,
+    payload: {
+      data: { hello: null },
+      pluginID: "test",
+    },
+  };
+
+const mockPluginDataChangeTransactionWithUndefined: Transaction<DevtoolsDataChangeEvent> =
+  {
+    ...mockTransactionMetadata,
+    type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
+    id: mockTransactionID++,
+    payload: {
+      data: { hello: null },
+      pluginID: "test",
+    },
+  };
+
 const mockPluginInteractionTransaction: Transaction<DevtoolsPluginInteractionEvent> =
   {
     ...mockTransactionMetadata,
@@ -164,7 +186,7 @@ describe("reducer", () => {
           {
             "_messenger_": true,
             "context": "devtools",
-            "id": 3,
+            "id": 5,
             "payload": {
               "payload": "{"expression": "{{foo.bar}}"}",
               "type": "evaluate-expression",
@@ -194,4 +216,70 @@ describe("reducer", () => {
       }
     `);
   });
+
+  test("should handle PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE action with valid data", () => {
+    const result = reducer(INITIAL_STATE, mockPluginDataChangeTransaction);
+    expect(result.plugins.test).toBeDefined();
+    expect(result.plugins.test.flow.data).toEqual({ foo: "bar" });
+    expect(result.messages).toHaveLength(1);
+    expect(result.messages[0].type).toEqual(
+      "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE"
+    );
+  });
+
+  test("should handle PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE action when data is null", () => {
+    const transaction = {
+      type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
+      plugins: [],
+      messages: [],
+    };
+    const result = reducer(
+      transaction,
+      mockPluginDataChangeTransactionWithNull
+    );
+
+    expect(result.messages).toHaveLength(1);
+    expect(result.plugins.test).toBeUndefined();
+  });
+
+  test("should handle PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE action when data is undefined", () => {
+    const transaction = {
+      type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
+      plugins: [],
+      messages: [],
+    };
+    const result = reducer(
+      transaction,
+      mockPluginDataChangeTransactionWithUndefined
+    );
+
+    expect(result.messages).toHaveLength(1);
+    expect(result.plugins.test).toBeUndefined();
+  });
+
+  test("should not overwrite when there are two plugins", () => {
+    const transaction = {
+      ...INITIAL_STATE,
+      messages: [],
+      plugins: {
+        multiple: {
+          flow: {
+            data: {
+              hello: "world",
+            },
+          },
+        },
+      },
+      interactions: [],
+      currentPlayer: "",
+      type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
+      payload: {
+        pluginID: "plugin-1",
+        data: undefined,
+      },
+    };
+
+    const newState = reducer(transaction, mockPluginDataChangeTransaction);
+    expect(Object.keys(newState.plugins).length).toEqual(2);
+  });
 });

package/src/state/reducer.ts

@@ -40,12 +40,15 @@ export const reducer = (
 
         if (!payload.data) return state;
 
-        dset(
-          draft.plugins,
-          [transaction.payload.pluginID, "flow", "data"],
-          transaction.payload.data
-        );
-
+        try {
+          dset(
+            draft,
+            ["plugins", transaction.payload.pluginID, "flow", "data"],
+            transaction.payload.data
+          );
+        } catch {
+          console.error("error setting data:", transaction.payload.data);
+        }
         const message: DevtoolsDataChangeEvent = {
           type: "PLAYER_DEVTOOLS_PLUGIN_DATA_CHANGE",
           payload,