ENG-1867 Import cross-app relations into Roam as tentative relations

apps/roam/src/components/DiscoverSharedNodesDialog.tsx

@@ -21,6 +21,7 @@ import {
   isFailedSharedNodeImport,
   type SharedNodeImportItem,
 } from "~/utils/importSharedNodes";
+import { importSharedRelations } from "~/utils/importSharedRelations";
 import internalError from "~/utils/internalError";
 import { getLoggedInClient, getSupabaseContext } from "~/utils/supabaseContext";
 
@@ -146,6 +147,7 @@ const DiscoverSharedNodesDialog = ({ onClose }: { onClose: () => void }) => {
   const [error, setError] = useState("");
   const [searchTerm, setSearchTerm] = useState("");
   const [selectedRids, setSelectedRids] = useState<Set<string>>(new Set());
+  const [spaceId, setSpaceId] = useState<number>(0);
   const [importProgress, setImportProgress] = useState<{
     current: number;
     total: number;
@@ -163,6 +165,7 @@ const DiscoverSharedNodesDialog = ({ onClose }: { onClose: () => void }) => {
     try {
       const context = await getSupabaseContext();
       if (!context) throw new Error("Could not connect to shared persistence.");
+      setSpaceId(context.spaceId);
       const client = await getLoggedInClient();
       if (!client) throw new Error("Could not connect to shared persistence.");
       const { sharedNodes, importedSourceRids } = await discoverSharedNodes({
@@ -242,7 +245,6 @@ const DiscoverSharedNodesDialog = ({ onClose }: { onClose: () => void }) => {
         sharedNodes: selectedNodes,
         onProgress: (current, total) => setImportProgress({ current, total }),
       });
-      setImportResults(results);
       const newlyImportedRids = results
         .filter((item) => item.status !== "failed")
         .map((item) => item.sharedNode.rid);
@@ -251,6 +253,8 @@ const DiscoverSharedNodesDialog = ({ onClose }: { onClose: () => void }) => {
         newlyImportedRids.forEach((rid) => next.add(rid));
         return next;
       });
+      await importSharedRelations(client, spaceId);
+      setImportResults(results);
       const failedImports = results.filter(isFailedSharedNodeImport);
       setSelectedRids(
         new Set(failedImports.map((item) => item.sharedNode.rid)),

apps/roam/src/components/settings/DiscourseNodeConfigPanel.tsx

@@ -10,19 +10,17 @@ import {
 import React, { useState } from "react";
 import getDiscourseNodes from "~/utils/getDiscourseNodes";
 import refreshConfigTree from "~/utils/refreshConfigTree";
-import createPage from "roamjs-components/writes/createPage";
 import type { CustomField } from "roamjs-components/components/ConfigPanels/types";
 import posthog from "posthog-js";
 import getDiscourseRelations, {
   type DiscourseRelation,
 } from "~/utils/getDiscourseRelations";
 import { deleteBlock } from "roamjs-components/writes";
 import { formatHexColor } from "./DiscourseNodeCanvasSettings";
-import setBlockProps from "~/utils/setBlockProps";
-import { DiscourseNodeSchema } from "./utils/zodSchema";
 import { getGlobalSettings, setGlobalSetting } from "./utils/accessors";
 import { GLOBAL_KEYS } from "./utils/settingKeys";
 import { invalidateDiscourseNodeTypeCaches } from "~/utils/discourseNodeTypeCache";
+import { createDiscourseNodeSchema } from "~/utils/createDiscourseNodeSchema";
 
 type DiscourseNodeConfigPanelProps = React.ComponentProps<
   CustomField["options"]["component"]
@@ -82,44 +80,8 @@ const DiscourseNodeConfigPanel: React.FC<DiscourseNodeConfigPanelProps> = ({
           className="select-none"
           disabled={!label}
           onClick={() => {
-            const candidateShortcut = label.slice(0, 1).toUpperCase();
-            const existingShortcuts = new Set(
-              getDiscourseNodes()
-                .map((n) => n.shortcut.toUpperCase())
-                .filter(Boolean),
-            );
-            const shortcut = existingShortcuts.has(candidateShortcut)
-              ? ""
-              : candidateShortcut;
-            const format = `[[${label.slice(0, 3).toUpperCase()}]] - {content}`;
             posthog.capture("Discourse Node: Type Created", { label: label });
-            void createPage({
-              title: `discourse-graph/nodes/${label}`,
-              tree: [
-                {
-                  text: "Shortcut",
-                  children: [{ text: shortcut }],
-                },
-                {
-                  text: "Tag",
-                  children: [{ text: "" }],
-                },
-                {
-                  text: "Format",
-                  children: [{ text: format }],
-                },
-              ],
-            }).then((valueUid) => {
-              setBlockProps(
-                valueUid,
-                DiscourseNodeSchema.parse({
-                  text: label,
-                  type: valueUid,
-                  shortcut,
-                  format,
-                }),
-              );
-              invalidateDiscourseNodeTypeCaches();
+            void createDiscourseNodeSchema(label).then((valueUid) => {
               setNodes([
                 ...nodes,
                 {

apps/roam/src/utils/createDiscourseNodeSchema.ts

@@ -0,0 +1,65 @@
+import createPage from "roamjs-components/writes/createPage";
+import setBlockProps from "~/utils/setBlockProps";
+import { DiscourseNodeSchema } from "~/components/settings/utils/zodSchema";
+import { invalidateDiscourseNodeTypeCaches } from "~/utils/discourseNodeTypeCache";
+import getDiscourseNodes from "./getDiscourseNodes";
+
+export const createDiscourseNodeSchema = async (
+  label: string,
+  options?: {
+    shortcut?: string;
+    format?: string;
+    template?: string;
+  },
+): Promise<string> => {
+  let { shortcut, format } = options ?? {};
+  const { template } = options ?? {};
+  if (shortcut === undefined) {
+    const candidateShortcut = label.slice(0, 1).toUpperCase();
+    const existingShortcuts = new Set(
+      getDiscourseNodes()
+        .map((n) => n.shortcut.toUpperCase())
+        .filter(Boolean),
+    );
+    shortcut = existingShortcuts.has(candidateShortcut)
+      ? ""
+      : candidateShortcut;
+  }
+  format = format ?? `[[${label.slice(0, 3).toUpperCase()}]] - {content}`;
+  const tree = [
+    {
+      text: "Shortcut",
+      children: [{ text: shortcut }],
+    },
+    {
+      text: "Tag",
+      children: [{ text: "" }],
+    },
+    {
+      text: "Format",
+      children: [{ text: format }],
+    },
+  ];
+  if (template != undefined) {
+    // TODO: Make into a tree
+    tree.push({
+      text: "Template",
+      children: [{ text: template ?? "" }],
+    });
+  }
+  const valueUid = await createPage({
+    title: `discourse-graph/nodes/${label}`,
+    tree,
+  });
+  setBlockProps(
+    valueUid,
+    DiscourseNodeSchema.parse({
+      text: label,
+      type: valueUid,
+      shortcut,
+      format,
+    }),
+  );
+  invalidateDiscourseNodeTypeCaches();
+  return valueUid;
+};

apps/roam/src/utils/createReifiedBlock.ts

@@ -140,7 +140,7 @@ export const createReifiedRelation = async ({
   sourceUid: string;
   relationBlockUid: string;
   destinationUid: string;
-}): Promise<string | undefined> => {
+}): Promise<string> => {
   return await createReifiedBlock({
     destinationBlockUid: await getOrCreateRelationPageUid(),
     schemaUid: relationBlockUid,

apps/roam/src/utils/createRelationSchema.ts

@@ -0,0 +1,43 @@
+import discourseConfigRef from "~/utils/discourseConfigRef";
+import createBlock from "roamjs-components/writes/createBlock";
+
+export const createRelationSchema = async ({
+  label,
+  complement,
+  source,
+  destination,
+}: {
+  label: string;
+  complement: string;
+  source: string;
+  destination: string;
+}) => {
+  const grammarNode = discourseConfigRef.tree.find(
+    (node) => node.text === "grammar",
+  );
+  const relationsNode = grammarNode?.children.find(
+    (node) => node.text === "relations",
+  );
+  if (!relationsNode) throw new Error("Cannot find the relation grammar");
+  return await createBlock({
+    parentUid: relationsNode.uid,
+    order: "last",
+    node: {
+      text: label,
+      children: [
+        {
+          text: "source",
+          children: [{ text: source }],
+        },
+        {
+          text: "destination",
+          children: [{ text: destination }],
+        },
+        {
+          text: "complement",
+          children: [{ text: complement }],
+        },
+      ],
+    },
+  });
+};