@teambit/workspace 1.0.719 → 1.0.721

package/dist/{preview-1755809539883.js → preview-1755881160050.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.719/dist/workspace.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.719/dist/workspace.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.721/dist/workspace.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.721/dist/workspace.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/dist/ui/workspace/workspace.js

@@ -146,7 +146,14 @@ function Workspace({
   const {
     isMinimal
   } = (0, _workspaceUi2().useWorkspaceMode)();
-  const reactions = useComponentNotifications();
+  const reactionsRef = (0, _react().useRef)({
+    onComponentAdded: () => {},
+    onComponentRemoved: () => {}
+  });
+  const reactions = (0, _react().useMemo)(() => ({
+    onComponentAdded: comps => reactionsRef.current.onComponentAdded(comps),
+    onComponentRemoved: ids => reactionsRef.current.onComponentRemoved(ids)
+  }), []);
   const {
     workspace
   } = (0, _useWorkspace().useWorkspace)(reactions);
@@ -176,7 +183,9 @@ function Workspace({
   workspaceUI.setComponents(workspace.components);
   return /*#__PURE__*/_react().default.createElement(_workspaceProvider().WorkspaceProvider, {
     workspace: workspace
-  }, /*#__PURE__*/_react().default.createElement(_workspaceUi().PreserveWorkspaceMode, null, /*#__PURE__*/_react().default.createElement("div", {
+  }, !isMinimal && /*#__PURE__*/_react().default.createElement(NotificationsBinder, {
+    reactionsRef: reactionsRef
+  }), /*#__PURE__*/_react().default.createElement(_workspaceUi().PreserveWorkspaceMode, null, /*#__PURE__*/_react().default.createElement("div", {
     className: _workspaceModule().default.workspaceWrapper
   }, /*#__PURE__*/_react().default.createElement(_uiFoundationUi2().TopBar, {
     className: (0, _classnames().default)(_workspaceModule().default.topbar, _workspaceModule().default[themeName]),
@@ -209,20 +218,32 @@ function Workspace({
     element: /*#__PURE__*/_react().default.createElement(_workspaceOverview().WorkspaceOverview, null)
   })))))));
 }
-function useComponentNotifications() {
+function NotificationsBinder({
+  reactionsRef
+}) {
   const notifications = (0, _uiFoundationUiNotifications().useNotifications)();
-
-  // memo not really needed, but for peace of mind
-  return (0, _react().useMemo)(() => ({
-    onComponentAdded: comps => {
-      const notificationId = notifications.log(`added ${(0, _pluralize().default)('component', comps.length)}: ${comps.map(comp => comp.id.toString()).join(', ')}`);
-      setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
-    },
-    onComponentRemoved: ids => {
-      const notificationId = notifications.log(`removed ${(0, _pluralize().default)('component', ids.length)} ${ids.map(id => id.toString()).join(', ')}`);
-      setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
-    }
-  }), [notifications]);
+  const notificationsMapped = (0, _react().useMemo)(() => {
+    return {
+      onComponentAdded: comps => {
+        const notificationId = notifications.log(`added ${(0, _pluralize().default)('component', comps.length)}: ${comps.map(comp => comp.id.toString()).join(', ')}`);
+        setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
+      },
+      onComponentRemoved: ids => {
+        const notificationId = notifications.log(`removed ${(0, _pluralize().default)('component', ids.length)} ${ids.map(id => id.toString()).join(', ')}`);
+        setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
+      }
+    };
+  }, [notifications]);
+  (0, _react().useEffect)(() => {
+    reactionsRef.current = notificationsMapped;
+    return () => {
+      reactionsRef.current = {
+        onComponentAdded: () => {},
+        onComponentRemoved: () => {}
+      };
+    };
+  }, [notificationsMapped, reactionsRef]);
+  return null;
 }
 
 //# sourceMappingURL=workspace.js.map

package/dist/ui/workspace/workspace.js.map

@@ -1 +1 @@
-{"version":3,"names":["require","_pluralize","data","_interopRequireDefault","_react","_interopRequireWildcard","_reactRouterDom","_uiFoundationUiNotifications","_uiFoundationUiReactRouter","_uiFoundationUi","_uiFoundationUiButtons","_baseUiSurfacesSplitPane","_baseReactThemes","_baseUiSurfacesSplitPane2","_uiFoundationUi2","_workspaceUi","_classnames","_workspaceUi2","_useWorkspace","_workspaceOverview","_workspaceProvider","_workspaceModule","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Workspace","routeSlot","menuSlot","sidebar","workspaceUI","onSidebarTogglerChange","isMinimal","useWorkspaceMode","reactions","useComponentNotifications","workspace","useWorkspace","theme","useThemePicker","currentTheme","current","isSidebarOpen","setSidebarOpen","useState","handleSidebarToggle","useCallback","prev","sidebarOpenness","Layout","row","right","themeName","useEffect","window","innerWidth","useLayoutEffect","createElement","className","styles","emptyContainer","setComponents","components","WorkspaceProvider","PreserveWorkspaceMode","workspaceWrapper","TopBar","classNames","topbar","Corner","minimalCorner","corner","name","icon","menu","SplitPane","main","size","layout","Pane","closed","HoverSplitter","splitter","Collapser","isOpen","Boolean","onMouseDown","stopPropagation","onClick","tooltipContent","SlotRouter","slot","Route","index","element","WorkspaceOverview","notifications","useNotifications","useMemo","onComponentAdded","comps","notificationId","log","pluralize","length","map","comp","id","toString","join","setTimeout","dismiss","onComponentRemoved","ids"],"sources":["workspace.tsx"],"sourcesContent":["import 'reset-css';\nimport pluralize from 'pluralize';\nimport React, { useState, useMemo, useEffect, useCallback, useLayoutEffect } from 'react';\nimport { Route } from 'react-router-dom';\nimport type { ComponentModel } from '@teambit/component';\nimport type { ComponentID } from '@teambit/component-id';\nimport { useNotifications } from '@teambit/ui-foundation.ui.notifications.notification-context';\nimport { SlotRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport type { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { Corner } from '@teambit/ui-foundation.ui.corner';\nimport { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';\nimport { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';\nimport { useThemePicker } from '@teambit/base-react.themes.theme-switcher';\nimport { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';\nimport { TopBar } from '@teambit/ui-foundation.ui.top-bar';\nimport { PreserveWorkspaceMode } from '@teambit/workspace.ui.preserve-workspace-mode';\nimport classNames from 'classnames';\nimport { useWorkspaceMode } from '@teambit/workspace.ui.use-workspace-mode';\n\nimport { useWorkspace } from './use-workspace';\nimport { WorkspaceOverview } from './workspace-overview';\nimport { WorkspaceProvider } from './workspace-provider';\nimport styles from './workspace.module.scss';\nimport type { WorkspaceUI } from '../../workspace.ui.runtime';\n\nexport type WorkspaceProps = {\n  routeSlot: RouteSlot;\n  menuSlot: RouteSlot;\n  sidebar: JSX.Element;\n  workspaceUI: WorkspaceUI;\n  onSidebarTogglerChange: (callback: () => void) => void;\n};\n\n/**\n * main workspace component.\n */\nexport function Workspace({ routeSlot, menuSlot, sidebar, workspaceUI, onSidebarTogglerChange }: WorkspaceProps) {\n  const { isMinimal } = useWorkspaceMode();\n  const reactions = useComponentNotifications();\n  const { workspace } = useWorkspace(reactions);\n  const theme = useThemePicker();\n  const currentTheme = theme?.current;\n  const [isSidebarOpen, setSidebarOpen] = useState<boolean | null>(null);\n  const handleSidebarToggle = useCallback(() => {\n    setSidebarOpen((prev) => !prev);\n  }, []);\n  const sidebarOpenness = isSidebarOpen ? Layout.row : Layout.right;\n  const themeName = currentTheme?.themeName || 'light';\n  onSidebarTogglerChange(handleSidebarToggle);\n\n  useEffect(() => {\n    if (!window) return;\n    if (window.innerWidth <= 1024) {\n      setSidebarOpen(false);\n    }\n  }, []);\n\n  useLayoutEffect(() => {\n    setSidebarOpen(!isMinimal);\n  }, [isMinimal]);\n\n  if (!workspace) {\n    return <div className={styles.emptyContainer}></div>;\n  }\n\n  workspaceUI.setComponents(workspace.components);\n\n  return (\n    <WorkspaceProvider workspace={workspace}>\n      <PreserveWorkspaceMode>\n        <div className={styles.workspaceWrapper}>\n          {\n            <TopBar\n              className={classNames(styles.topbar, styles[themeName])}\n              Corner={() => (\n                <Corner\n                  className={classNames((isMinimal && styles.minimalCorner) || styles.corner, styles[themeName])}\n                  name={isMinimal ? '' : workspace.name}\n                  icon={isMinimal ? 'https://static.bit.dev/bit-icons/house.svg' : workspace.icon}\n                />\n              )}\n              // @ts-ignore - getting an error of \"Types have separate declarations of a private property 'registerFn'.\" for some reason after upgrading teambit.harmony/harmony from 0.4.6 to 0.4.7\n              menu={menuSlot}\n            />\n          }\n          <SplitPane className={styles.main} size={246} layout={sidebarOpenness}>\n            <Pane className={classNames(styles.sidebar, styles[themeName], !isSidebarOpen && styles.closed)}>\n              {sidebar}\n            </Pane>\n            <HoverSplitter className={styles.splitter}>\n              <Collapser\n                isOpen={Boolean(isSidebarOpen)}\n                onMouseDown={(e) => e.stopPropagation()} // avoid split-pane drag\n                onClick={handleSidebarToggle}\n                tooltipContent={`${isSidebarOpen ? 'Hide' : 'Show'} side panel`}\n              />\n            </HoverSplitter>\n            <Pane>\n              <SlotRouter slot={routeSlot}>\n                <Route index element={<WorkspaceOverview />} />\n              </SlotRouter>\n            </Pane>\n          </SplitPane>\n        </div>\n      </PreserveWorkspaceMode>\n    </WorkspaceProvider>\n  );\n}\n\nfunction useComponentNotifications() {\n  const notifications = useNotifications();\n\n  // memo not really needed, but for peace of mind\n  return useMemo(\n    () => ({\n      onComponentAdded: (comps: ComponentModel[]) => {\n        const notificationId = notifications.log(\n          `added ${pluralize('component', comps.length)}: ${comps.map((comp) => comp.id.toString()).join(', ')}`\n        );\n        setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);\n      },\n      onComponentRemoved: (ids: ComponentID[]) => {\n        const notificationId = notifications.log(\n          `removed ${pluralize('component', ids.length)} ${ids.map((id) => id.toString()).join(', ')}`\n        );\n        setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);\n      },\n    }),\n    [notifications]\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["require","_pluralize","data","_interopRequireDefault","_react","_interopRequireWildcard","_reactRouterDom","_uiFoundationUiNotifications","_uiFoundationUiReactRouter","_uiFoundationUi","_uiFoundationUiButtons","_baseUiSurfacesSplitPane","_baseReactThemes","_baseUiSurfacesSplitPane2","_uiFoundationUi2","_workspaceUi","_classnames","_workspaceUi2","_useWorkspace","_workspaceOverview","_workspaceProvider","_workspaceModule","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Workspace","routeSlot","menuSlot","sidebar","workspaceUI","onSidebarTogglerChange","isMinimal","useWorkspaceMode","reactionsRef","useRef","onComponentAdded","onComponentRemoved","reactions","useMemo","comps","current","ids","workspace","useWorkspace","theme","useThemePicker","currentTheme","isSidebarOpen","setSidebarOpen","useState","handleSidebarToggle","useCallback","prev","sidebarOpenness","Layout","row","right","themeName","useEffect","window","innerWidth","useLayoutEffect","createElement","className","styles","emptyContainer","setComponents","components","WorkspaceProvider","NotificationsBinder","PreserveWorkspaceMode","workspaceWrapper","TopBar","classNames","topbar","Corner","minimalCorner","corner","name","icon","menu","SplitPane","main","size","layout","Pane","closed","HoverSplitter","splitter","Collapser","isOpen","Boolean","onMouseDown","stopPropagation","onClick","tooltipContent","SlotRouter","slot","Route","index","element","WorkspaceOverview","notifications","useNotifications","notificationsMapped","notificationId","log","pluralize","length","map","comp","id","toString","join","setTimeout","dismiss"],"sources":["workspace.tsx"],"sourcesContent":["import 'reset-css';\nimport pluralize from 'pluralize';\nimport React, { useState, useMemo, useEffect, useCallback, useLayoutEffect, useRef } from 'react';\nimport { Route } from 'react-router-dom';\nimport type { ComponentModel } from '@teambit/component';\nimport type { ComponentID } from '@teambit/component-id';\nimport { useNotifications } from '@teambit/ui-foundation.ui.notifications.notification-context';\nimport { SlotRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport type { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { Corner } from '@teambit/ui-foundation.ui.corner';\nimport { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';\nimport { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';\nimport { useThemePicker } from '@teambit/base-react.themes.theme-switcher';\nimport { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';\nimport { TopBar } from '@teambit/ui-foundation.ui.top-bar';\nimport { PreserveWorkspaceMode } from '@teambit/workspace.ui.preserve-workspace-mode';\nimport classNames from 'classnames';\nimport { useWorkspaceMode } from '@teambit/workspace.ui.use-workspace-mode';\n\nimport { useWorkspace } from './use-workspace';\nimport { WorkspaceOverview } from './workspace-overview';\nimport { WorkspaceProvider } from './workspace-provider';\nimport styles from './workspace.module.scss';\nimport type { WorkspaceUI } from '../../workspace.ui.runtime';\n\nexport type WorkspaceProps = {\n  routeSlot: RouteSlot;\n  menuSlot: RouteSlot;\n  sidebar: JSX.Element;\n  workspaceUI: WorkspaceUI;\n  onSidebarTogglerChange: (callback: () => void) => void;\n};\n\n/**\n * main workspace component.\n */\nexport function Workspace({ routeSlot, menuSlot, sidebar, workspaceUI, onSidebarTogglerChange }: WorkspaceProps) {\n  const { isMinimal } = useWorkspaceMode();\n\n  const reactionsRef = useRef<{\n    onComponentAdded: (comps: ComponentModel[]) => void;\n    onComponentRemoved: (ids: ComponentID[]) => void;\n  }>({\n    onComponentAdded: () => {},\n    onComponentRemoved: () => {},\n  });\n\n  const reactions = useMemo(\n    () => ({\n      onComponentAdded: (comps: ComponentModel[]) => reactionsRef.current.onComponentAdded(comps),\n      onComponentRemoved: (ids: ComponentID[]) => reactionsRef.current.onComponentRemoved(ids),\n    }),\n    []\n  );\n\n  const { workspace } = useWorkspace(reactions);\n  const theme = useThemePicker();\n  const currentTheme = theme?.current;\n  const [isSidebarOpen, setSidebarOpen] = useState<boolean | null>(null);\n  const handleSidebarToggle = useCallback(() => {\n    setSidebarOpen((prev) => !prev);\n  }, []);\n  const sidebarOpenness = isSidebarOpen ? Layout.row : Layout.right;\n  const themeName = currentTheme?.themeName || 'light';\n  onSidebarTogglerChange(handleSidebarToggle);\n\n  useEffect(() => {\n    if (!window) return;\n    if (window.innerWidth <= 1024) {\n      setSidebarOpen(false);\n    }\n  }, []);\n\n  useLayoutEffect(() => {\n    setSidebarOpen(!isMinimal);\n  }, [isMinimal]);\n\n  if (!workspace) {\n    return <div className={styles.emptyContainer}></div>;\n  }\n\n  workspaceUI.setComponents(workspace.components);\n\n  return (\n    <WorkspaceProvider workspace={workspace}>\n      {!isMinimal && <NotificationsBinder reactionsRef={reactionsRef} />}\n      <PreserveWorkspaceMode>\n        <div className={styles.workspaceWrapper}>\n          {\n            <TopBar\n              className={classNames(styles.topbar, styles[themeName])}\n              Corner={() => (\n                <Corner\n                  className={classNames((isMinimal && styles.minimalCorner) || styles.corner, styles[themeName])}\n                  name={isMinimal ? '' : workspace.name}\n                  icon={isMinimal ? 'https://static.bit.dev/bit-icons/house.svg' : workspace.icon}\n                />\n              )}\n              // @ts-ignore - getting an error of \"Types have separate declarations of a private property 'registerFn'.\" for some reason after upgrading teambit.harmony/harmony from 0.4.6 to 0.4.7\n              menu={menuSlot}\n            />\n          }\n          <SplitPane className={styles.main} size={246} layout={sidebarOpenness}>\n            <Pane className={classNames(styles.sidebar, styles[themeName], !isSidebarOpen && styles.closed)}>\n              {sidebar}\n            </Pane>\n            <HoverSplitter className={styles.splitter}>\n              <Collapser\n                isOpen={Boolean(isSidebarOpen)}\n                onMouseDown={(e) => e.stopPropagation()} // avoid split-pane drag\n                onClick={handleSidebarToggle}\n                tooltipContent={`${isSidebarOpen ? 'Hide' : 'Show'} side panel`}\n              />\n            </HoverSplitter>\n            <Pane>\n              <SlotRouter slot={routeSlot}>\n                <Route index element={<WorkspaceOverview />} />\n              </SlotRouter>\n            </Pane>\n          </SplitPane>\n        </div>\n      </PreserveWorkspaceMode>\n    </WorkspaceProvider>\n  );\n}\n\nfunction NotificationsBinder({\n  reactionsRef,\n}: {\n  reactionsRef: React.MutableRefObject<{\n    onComponentAdded: (comps: ComponentModel[]) => void;\n    onComponentRemoved: (ids: ComponentID[]) => void;\n  }>;\n}) {\n  const notifications = useNotifications();\n\n  const notificationsMapped = useMemo(() => {\n    return {\n      onComponentAdded: (comps: ComponentModel[]) => {\n        const notificationId = notifications.log(\n          `added ${pluralize('component', comps.length)}: ${comps.map((comp) => comp.id.toString()).join(', ')}`\n        );\n        setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);\n      },\n      onComponentRemoved: (ids: ComponentID[]) => {\n        const notificationId = notifications.log(\n          `removed ${pluralize('component', ids.length)} ${ids.map((id) => id.toString()).join(', ')}`\n        );\n        setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);\n      },\n    };\n  }, [notifications]);\n\n  useEffect(() => {\n    reactionsRef.current = notificationsMapped;\n    return () => {\n      reactionsRef.current = { onComponentAdded: () => {}, onComponentRemoved: () => {} };\n    };\n  }, [notificationsMapped, reactionsRef]);\n\n  return null;\n}\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/workspace",
-  "version": "1.0.719",
+  "version": "1.0.721",
   "homepage": "https://bit.cloud/teambit/workspace/workspace",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.workspace",
     "name": "workspace",
-    "version": "1.0.719"
+    "version": "1.0.721"
   },
   "dependencies": {
     "lodash": "4.17.21",
@@ -100,23 +100,23 @@
     "@teambit/scopes.scope-id": "0.0.9",
     "@teambit/workspace.ui.empty-workspace": "0.0.509",
     "@teambit/workspace.ui.workspace-component-card": "0.0.562",
-    "@teambit/component": "1.0.719",
-    "@teambit/dependency-resolver": "1.0.719",
-    "@teambit/envs": "1.0.719",
-    "@teambit/objects": "0.0.226",
-    "@teambit/scope": "1.0.719",
-    "@teambit/graph": "1.0.719",
-    "@teambit/isolator": "1.0.719",
-    "@teambit/component-tree": "1.0.719",
-    "@teambit/watcher": "1.0.719",
-    "@teambit/aspect-loader": "1.0.719",
-    "@teambit/graphql": "1.0.719",
-    "@teambit/bundler": "1.0.719",
-    "@teambit/ui": "1.0.719",
-    "@teambit/command-bar": "1.0.719",
-    "@teambit/sidebar": "1.0.719",
-    "@teambit/pubsub": "1.0.719",
-    "@teambit/deprecation": "1.0.719"
+    "@teambit/component": "1.0.721",
+    "@teambit/dependency-resolver": "1.0.721",
+    "@teambit/envs": "1.0.721",
+    "@teambit/objects": "0.0.228",
+    "@teambit/scope": "1.0.721",
+    "@teambit/graph": "1.0.721",
+    "@teambit/isolator": "1.0.721",
+    "@teambit/component-tree": "1.0.721",
+    "@teambit/watcher": "1.0.721",
+    "@teambit/aspect-loader": "1.0.721",
+    "@teambit/graphql": "1.0.721",
+    "@teambit/bundler": "1.0.721",
+    "@teambit/ui": "1.0.721",
+    "@teambit/command-bar": "1.0.721",
+    "@teambit/sidebar": "1.0.721",
+    "@teambit/pubsub": "1.0.721",
+    "@teambit/deprecation": "1.0.721"
   },
   "devDependencies": {
     "@types/lodash": "4.14.165",

package/ui/workspace/workspace.tsx

@@ -1,6 +1,6 @@
 import 'reset-css';
 import pluralize from 'pluralize';
-import React, { useState, useMemo, useEffect, useCallback, useLayoutEffect } from 'react';
+import React, { useState, useMemo, useEffect, useCallback, useLayoutEffect, useRef } from 'react';
 import { Route } from 'react-router-dom';
 import type { ComponentModel } from '@teambit/component';
 import type { ComponentID } from '@teambit/component-id';
@@ -36,7 +36,23 @@ export type WorkspaceProps = {
  */
 export function Workspace({ routeSlot, menuSlot, sidebar, workspaceUI, onSidebarTogglerChange }: WorkspaceProps) {
   const { isMinimal } = useWorkspaceMode();
-  const reactions = useComponentNotifications();
+
+  const reactionsRef = useRef<{
+    onComponentAdded: (comps: ComponentModel[]) => void;
+    onComponentRemoved: (ids: ComponentID[]) => void;
+  }>({
+    onComponentAdded: () => {},
+    onComponentRemoved: () => {},
+  });
+
+  const reactions = useMemo(
+    () => ({
+      onComponentAdded: (comps: ComponentModel[]) => reactionsRef.current.onComponentAdded(comps),
+      onComponentRemoved: (ids: ComponentID[]) => reactionsRef.current.onComponentRemoved(ids),
+    }),
+    []
+  );
+
   const { workspace } = useWorkspace(reactions);
   const theme = useThemePicker();
   const currentTheme = theme?.current;
@@ -67,6 +83,7 @@ export function Workspace({ routeSlot, menuSlot, sidebar, workspaceUI, onSidebar
 
   return (
     <WorkspaceProvider workspace={workspace}>
+      {!isMinimal && <NotificationsBinder reactionsRef={reactionsRef} />}
       <PreserveWorkspaceMode>
         <div className={styles.workspaceWrapper}>
           {
@@ -107,12 +124,18 @@ export function Workspace({ routeSlot, menuSlot, sidebar, workspaceUI, onSidebar
   );
 }
 
-function useComponentNotifications() {
+function NotificationsBinder({
+  reactionsRef,
+}: {
+  reactionsRef: React.MutableRefObject<{
+    onComponentAdded: (comps: ComponentModel[]) => void;
+    onComponentRemoved: (ids: ComponentID[]) => void;
+  }>;
+}) {
   const notifications = useNotifications();
 
-  // memo not really needed, but for peace of mind
-  return useMemo(
-    () => ({
+  const notificationsMapped = useMemo(() => {
+    return {
       onComponentAdded: (comps: ComponentModel[]) => {
         const notificationId = notifications.log(
           `added ${pluralize('component', comps.length)}: ${comps.map((comp) => comp.id.toString()).join(', ')}`
@@ -125,7 +148,15 @@ function useComponentNotifications() {
         );
         setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
       },
-    }),
-    [notifications]
-  );
+    };
+  }, [notifications]);
+
+  useEffect(() => {
+    reactionsRef.current = notificationsMapped;
+    return () => {
+      reactionsRef.current = { onComponentAdded: () => {}, onComponentRemoved: () => {} };
+    };
+  }, [notificationsMapped, reactionsRef]);
+
+  return null;
 }