Update roamjs-components to version 0.86.4 and adjust TypeScript dependencies in pnpm-lock.yaml. Refactor useRoamStore to utilize the updated API for page updates. (#701)

Author: mdroidian

apps/roam/package.json

@@ -68,7 +68,7 @@
     "react-draggable": "4.4.5",
     "react-in-viewport": "1.0.0-alpha.20",
     "react-vertical-timeline-component": "3.5.2",
-    "roamjs-components": "0.86.3",
+    "roamjs-components": "0.86.4",
     "tldraw": "2.3.0",
     "use-sync-external-store": "1.5.0",
     "xregexp": "^5.0.0",

apps/roam/src/components/canvas/useRoamStore.ts

@@ -223,8 +223,8 @@ export const useRoamStore = ({
         const newstateId = nanoid();
         localStateIds.current.push(newstateId);
         localStateIds.current.splice(0, localStateIds.current.length - 25);
-        void window.roamAlphaAPI.updateBlock({
-          block: {
+        void window.roamAlphaAPI.data.page.update({
+          page: {
             uid: pageUid,
             props: {
               ...props,
@@ -278,8 +278,8 @@ export const useRoamStore = ({
         typeof props["roamjs-query-builder"] === "object"
           ? (props["roamjs-query-builder"] as Record<string, unknown>)
           : {};
-      void window.roamAlphaAPI.updateBlock({
-        block: {
+      void window.roamAlphaAPI.data.page.update({
+        page: {
           uid: pageUid,
           props: {
             ...props,