Merge pull request #112 from ClayPulse/improve-ui

Improve UI loading states & add useWorkspace hook in react-api lib

Author: Shellishack

.changeset/afraid-moments-punch.md

@@ -0,0 +1,6 @@
+---
+"@pulse-editor/shared-utils": patch
+"@pulse-editor/react-api": patch
+---
+
+Add useWorkspace hook

.changeset/pre.json

@@ -9,6 +9,7 @@
     "@pulse-editor/web": "0.1.1-alpha.13"
   },
   "changesets": [
+    "afraid-moments-punch",
     "angry-llamas-smash",
     "beige-pandas-rhyme",
     "bumpy-parents-pull",

npm-packages/react-api/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @pulse-editor/react-api
 
+## 0.1.1-beta.56
+
+### Patch Changes
+
+- Add useWorkspace hook
+- Updated dependencies
+  - @pulse-editor/shared-utils@0.1.1-beta.56
+
 ## 0.1.1-beta.55
 
 ### Patch Changes

npm-packages/react-api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pulse-editor/react-api",
-  "version": "0.1.1-beta.55",
+  "version": "0.1.1-beta.56",
   "main": "dist/main.js",
   "files": [
     "dist"
@@ -37,7 +37,7 @@
     "typescript-eslint": "^8.30.1"
   },
   "peerDependencies": {
-    "@pulse-editor/shared-utils": "0.1.1-beta.55",
+    "@pulse-editor/shared-utils": "0.1.1-beta.56",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   }

npm-packages/react-api/src/hooks/editor/use-toolbar.ts

@@ -0,0 +1,30 @@
+import { IMCMessage, IMCMessageTypeEnum } from "@pulse-editor/shared-utils";
+import { useEffect, useState } from "react";
+import useIMC from "../imc/use-imc";
+
+export default function useWorkspace() {
+  const [workspaceId, setWorkspaceId] = useState<string | undefined>(undefined);
+
+  const receiverHandlerMap = new Map<
+    IMCMessageTypeEnum,
+    (senderWindow: Window, message: IMCMessage) => Promise<void>
+  >();
+
+  const { imc, isReady } = useIMC(receiverHandlerMap, "theme");
+
+  // Upon initial load, request theme from main app
+  useEffect(() => {
+    if (isReady) {
+      imc
+        ?.sendMessage(IMCMessageTypeEnum.EditorAppRequestWorkspace)
+        .then((result) => {
+          const { id }: { id: string } = result;
+          setWorkspaceId((prev) => id);
+        });
+    }
+  }, [isReady]);
+
+  return {
+    workspaceId,
+  };
+}

npm-packages/react-api/src/hooks/editor/use-workspace.ts

@@ -5,7 +5,6 @@ import useLoading from "./hooks/editor/use-loading";
 import useNotification from "./hooks/editor/use-notification";
 import useRegisterAction from "./hooks/editor/use-register-action";
 import useTheme from "./hooks/editor/use-theme";
-import useToolbar from "./hooks/editor/use-toolbar";
 
 import useImageGen from "./hooks/ai-modality/use-image-gen";
 import useLLM from "./hooks/ai-modality/use-llm";
@@ -17,6 +16,7 @@ import usePulseEnv from "./hooks/editor/use-env";
 import useOwnedAppView from "./hooks/editor/use-owned-app-view";
 import useReceiveFile from "./hooks/editor/use-receive-file";
 import useSnapshotState from "./hooks/editor/use-snapshot-state";
+import useWorkspace from "./hooks/editor/use-workspace";
 import useTerminal from "./hooks/terminal/use-terminal";
 import ReceiveFileProvider from "./providers/receive-file-provider";
 import SnapshotProvider from "./providers/snapshot-provider";
@@ -41,6 +41,6 @@ export {
   useTTS,
   useTerminal,
   useTheme,
-  useToolbar,
   useVideoGen,
+  useWorkspace,
 };

npm-packages/react-api/src/main.ts

@@ -1,5 +1,11 @@
 # @pulse-editor/shared-utils
 
+## 0.1.1-beta.56
+
+### Patch Changes
+
+- Add useWorkspace hook
+
 ## 0.1.1-beta.55
 
 ### Patch Changes

npm-packages/shared-utils/CHANGELOG.md

@@ -1,6 +1,6 @@
 {
     "name": "@pulse-editor/shared-utils",
-    "version": "0.1.1-beta.55",
+    "version": "0.1.1-beta.56",
     "main": "dist/main.js",
     "files": [
         "dist"

npm-packages/shared-utils/package.json

@@ -44,6 +44,8 @@ export enum IMCMessageTypeEnum {
   EditorAppReceiveFileUri = "editor-app-receive-file-uri",
   // App uses owned app
   EditorAppUseOwnedApp = "editor-app-use-owned-app",
+  // App requests workspace info
+  EditorAppRequestWorkspace = "editor-app-request-workspace",
   // #endregion
 
   // #region Platform API interaction messages (require OS-like environment)