DiscourseGraphs
diff --git a/‎apps/roam/src/components/Export.tsx‎
Lines changed: 8 additions & 8 deletions b/‎apps/roam/src/components/Export.tsx‎
Lines changed: 8 additions & 8 deletions
diff --git a/‎apps/roam/src/components/ExportGithub.tsx‎
Lines changed: 6 additions & 8 deletions b/‎apps/roam/src/components/ExportGithub.tsx‎
Lines changed: 6 additions & 8 deletions
diff --git a/‎apps/roam/src/components/GitHubSync.tsx‎
Lines changed: 42 additions & 115 deletions b/‎apps/roam/src/components/GitHubSync.tsx‎
Lines changed: 42 additions & 115 deletions
@@ -119,7 +119,7 @@ const ExportDialog: ExportDialogComponent = ({
   initialExportDestination,
 }) => {
   const [selectedRepo, setSelectedRepo] = useState<string>(
-    getSetting<string>("selected-repo", ""),
+    getSetting("selected-repo"),
   );
   const exportId = useMemo(() => nanoid(), []);
   useEffect(() => {
@@ -171,7 +171,7 @@ const ExportDialog: ExportDialogComponent = ({
   }, [initialPanel]);
   const [includeDiscourseContext, setIncludeDiscourseContext] = useState(false);
   const [gitHubAccessToken, setGitHubAccessToken] = useState<string | null>(
-    getSetting<string | null>("oauth-github", null),
+    getSetting<string>("oauth-github"),
   );
 
   const [canSendToGitHub, setCanSendToGitHub] = useState(false);
@@ -185,8 +185,8 @@ const ExportDialog: ExportDialogComponent = ({
     content: string;
     setError: (error: string) => void;
   }): Promise<{ status: number }> => {
-    const gitHubAccessToken = localStorageGet("github-oauth");
-    const selectedRepo = localStorageGet("github-repo");
+    const gitHubAccessToken = getSetting("github-oauth");
+    const selectedRepo = getSetting("github-repo");
 
     const encoder = new TextEncoder();
     const uint8Array = encoder.encode(content);
@@ -233,8 +233,8 @@ const ExportDialog: ExportDialogComponent = ({
     setError: (error: string) => void;
     pageUid: string;
   }): Promise<{ status: number }> => {
-    const gitHubAccessToken = localStorageGet("github-oauth");
-    const selectedRepo = localStorageGet("github-repo");
+    const gitHubAccessToken = getSetting("github-oauth");
+    const selectedRepo = getSetting("github-repo");
     try {
       // https://docs.github.com/en/rest/issues/issues?apiVersion=2022-11-28#create-an-issue
       const response = await apiPost({
@@ -253,7 +253,7 @@ const ExportDialog: ExportDialogComponent = ({
       });
       if (response.status === 401) {
         setError("Authentication failed. Please log in again.");
-        localStorageSet("github-oauth", "");
+        setSetting("github-oauth", "");
         return { status: 401 };
       }
 
@@ -699,7 +699,7 @@ const ExportDialog: ExportDialogComponent = ({
                     if (activeExportDestination === "github") {
                       const { title, content } = files[0];
                       const githubDestination =
-                        localStorageGet("github-destination");
+                        getSetting("github-destination");
                       try {
                         let status;
                         if (githubDestination === "File") {
 
@@ -12,7 +12,7 @@ import apiGet from "roamjs-components/util/apiGet";
 import apiPost from "roamjs-components/util/apiPost";
 import { getNodeEnv } from "roamjs-components/util/env";
 import getExtensionApi from "roamjs-components/util/extensionApiContext";
-import { setSetting } from "~/utils/extensionSettings";
+import { getSetting, setSetting } from "~/utils/extensionSettings";
 
 export type UserReposResponse = {
   data: [
@@ -45,7 +45,7 @@ export const fetchInstallationStatus = async () => {
       domain: "https://api.github.com",
       path: "user/installations",
       headers: {
-        Authorization: `token ${localStorageGet("github-oauth")}`,
+        Authorization: `token ${getSetting("github-oauth")}`,
       },
     });
     const installations = res.installations;
@@ -75,14 +75,12 @@ export const ExportGithub = ({
   const [repos, setRepos] = useState<UserRepos>(initialRepos);
   const [state, setState] = useState("");
   const [gitHubAccessToken, _setGitHubAccessToken] = useState<string>(
-    localStorageGet("github-oauth"),
+    getSetting("github-oauth"),
   );
   const [githubDestination, _setGithubDestination] =
-    useState<GitHubDestination>(
-      (localStorageGet("github-destination") as GitHubDestination) || "File",
-    );
-  const [selectedRepo, _setSelectedRepo] = useState(
-    localStorageGet("github-repo"),
+    useState<GitHubDestination>(getSetting("github-destination") || "File");
+  const [selectedRepo, _setSelectedRepo] = useState<string>(
+    getSetting("github-repo"),
   );
   const showGitHubLogin = isGitHubAppInstalled && !gitHubAccessToken;
   const repoAndDestinationSelectEnabled =
 
@@ -5,18 +5,16 @@ import React, {
   useRef,
   useState,
 } from "react";
-import getDiscourseNodes from "~/utils/getDiscourseNodes";
+import getDiscourseNodes, { DiscourseNode } from "~/utils/getDiscourseNodes";
 import matchDiscourseNode from "~/utils/matchDiscourseNode";
-import { OnloadArgs, PullBlock, RoamBasicNode } from "roamjs-components/types";
+import { OnloadArgs, RoamBasicNode } from "roamjs-components/types";
 import { Button, Card, Classes, Dialog, Tag } from "@blueprintjs/core";
 import getBasicTreeByParentUid from "roamjs-components/queries/getBasicTreeByParentUid";
 import getPageTitleByPageUid from "roamjs-components/queries/getPageTitleByPageUid";
 import getPageUidByPageTitle from "roamjs-components/queries/getPageUidByPageTitle";
 import createBlock from "roamjs-components/writes/createBlock";
 import runQuery from "~/utils/runQuery";
 import { render as renderToast } from "roamjs-components/components/Toast";
-import { createConfigObserver } from "roamjs-components/components/ConfigPage";
-import SelectPanel from "roamjs-components/components/ConfigPanels/SelectPanel";
 import { render as exportRender } from "~/components/Export";
 import getBlockProps from "~/utils/getBlockProps";
 import localStorageGet from "roamjs-components/util/localStorageGet";
@@ -40,17 +38,10 @@ import {
   fetchInstallationStatus,
 } from "~/components/ExportGithub";
 import localStorageSet from "roamjs-components/util/localStorageSet";
-import { getNodeEnv } from "roamjs-components/util/env";
 import nanoid from "nanoid";
-import {
-  CustomField,
-  Field,
-} from "roamjs-components/components/ConfigPanels/types";
-import CustomPanel from "roamjs-components/components/ConfigPanels/CustomPanel";
 import getShallowTreeByParentUid from "roamjs-components/queries/getShallowTreeByParentUid";
-import CommentsQuery from "./GitHubSyncCommentsQuery";
-import getSubTree from "roamjs-components/util/getSubTree";
 import isFlagEnabled from "~/utils/isFlagEnabled";
+import getPageTitleByBlockUid from "roamjs-components/queries/getPageTitleByBlockUid";
 
 const CommentUidCache = new Set<string>();
 const CommentContainerUidCache = new Set<string>();
@@ -105,27 +96,21 @@ const getPageGitHubPropsDetails = (pageUid: string) => {
 const getRoamCommentsContainerUid = async ({
   pageUid,
   extensionAPI,
+  matchingNode,
 }: {
   pageUid: string;
   extensionAPI: OnloadArgs["extensionAPI"];
+  matchingNode?: DiscourseNode;
 }) => {
   const pageTitle = getPageTitleByPageUid(pageUid);
-  const configUid = getPageUidByPageTitle(CONFIG_PAGE);
-  const configTree = getBasicTreeByParentUid(configUid);
-  const queryNode = getSubTree({
-    tree: configTree,
-    key: "Comments Block",
-  });
-  if (!queryNode) {
-    renderToast({
-      id: "github-issue-comments",
-      content: `Comments Block query not set. Set it in ${CONFIG_PAGE}`,
-    });
+
+  if (!matchingNode?.githubSync?.commentsQueryUid || !matchingNode) {
     return;
   }
+
   const results = await runQuery({
     extensionAPI,
-    parentUid: queryNode.uid,
+    parentUid: matchingNode.githubSync?.commentsQueryUid,
     inputs: { NODETEXT: pageTitle, NODEUID: pageUid },
   });
 
@@ -134,9 +119,11 @@ const getRoamCommentsContainerUid = async ({
 export const insertNewCommentsFromGitHub = async ({
   pageUid,
   extensionAPI,
+  matchingNode,
 }: {
   pageUid: string;
   extensionAPI: OnloadArgs["extensionAPI"];
+  matchingNode: DiscourseNode;
 }) => {
   const getCommentsOnPage = (pageUid: string) => {
     const query = `[:find
@@ -171,6 +158,7 @@ export const insertNewCommentsFromGitHub = async ({
   const commentsContainerUid = await getRoamCommentsContainerUid({
     pageUid,
     extensionAPI,
+    matchingNode,
   });
 
   const gitHubAccessToken = localStorageGet("github-oauth");
@@ -250,47 +238,41 @@ export const insertNewCommentsFromGitHub = async ({
     });
   }
 };
+
 export const isGitHubSyncPage = (pageTitle: string) => {
-  if (!enabled) return;
-  const gitHubNodeResult = window.roamAlphaAPI.data.fast.q(`[:find
-    (pull ?node [:block/string])
-    :where
-      [?roamjsgithub-sync :node/title "roam/js/github-sync"]
-      [?node :block/page ?roamjsgithub-sync]
-      [?p :block/children ?node]
-    (or     [?p :block/string ?p-String]
-      [?p :node/title ?p-String])
-    [(clojure.string/includes? ?p-String "Node Select")]
-    ]`) as [PullBlock][];
-  const nodeText = gitHubNodeResult[0]?.[0]?.[":block/string"] || "";
-  if (!nodeText) return;
+  if (!enabled) return null;
 
   const discourseNodes = getDiscourseNodes();
-  const selectedNode = discourseNodes.find((node) => node.text === nodeText);
-  const isPageTypeOfNode = matchDiscourseNode({
-    format: selectedNode?.format || "",
-    specification: selectedNode?.specification || [],
-    text: selectedNode?.text || "",
-    title: pageTitle,
-  });
-  return isPageTypeOfNode;
+  return discourseNodes.find(
+    (node) =>
+      node.githubSync?.enabled &&
+      matchDiscourseNode({
+        format: node.format || "",
+        specification: node.specification || [],
+        text: node.text || "",
+        title: pageTitle,
+      }),
+  );
 };
 
 export const renderGitHubSyncPage = async ({
   title,
   h1,
   onloadArgs,
+  matchingNode,
 }: {
   title: string;
   h1: HTMLHeadingElement;
   onloadArgs: OnloadArgs;
+  matchingNode: DiscourseNode;
 }) => {
   const extensionAPI = onloadArgs.extensionAPI;
   const pageUid = getPageUidByPageTitle(title);
 
   const commentsContainerUid = await getRoamCommentsContainerUid({
     pageUid,
     extensionAPI,
+    matchingNode,
   });
   const commentHeaderEl = document.querySelector(
     `.rm-block__input[id$="${commentsContainerUid}"]`,
@@ -325,6 +307,7 @@ export const renderGitHubSyncPage = async ({
         <CommentsContainerComponent
           commentsContainerUid={commentsContainerUid}
           extensionAPI={extensionAPI}
+          matchingNode={matchingNode}
         />,
         containerDiv,
       );
@@ -477,9 +460,11 @@ const CommentsComponent = ({ blockUid }: { blockUid: string }) => {
 const CommentsContainerComponent = ({
   commentsContainerUid,
   extensionAPI,
+  matchingNode,
 }: {
   commentsContainerUid: string;
   extensionAPI: OnloadArgs["extensionAPI"];
+  matchingNode: DiscourseNode;
 }) => {
   const [loadingComments, setLoadingComments] = useState(false);
   return (
@@ -534,7 +519,11 @@ const CommentsContainerComponent = ({
         onClick={async () => {
           setLoadingComments(true);
           const pageUid = getPageUidByBlockUid(commentsContainerUid);
-          await insertNewCommentsFromGitHub({ pageUid, extensionAPI });
+          await insertNewCommentsFromGitHub({
+            pageUid,
+            extensionAPI,
+            matchingNode,
+          });
           setLoadingComments(false);
         }}
       />
@@ -913,78 +902,17 @@ const initializeGitHubSync = async (onloadArgs: OnloadArgs) => {
   const unloads = new Set<() => void>();
   const toggle = async (flag: boolean) => {
     if (flag && !enabled) {
-      const { observer: configObserver } = await createConfigObserver({
-        title: "roam/js/github-sync",
-        config: {
-          tabs: [
-            {
-              id: "home",
-              fields: [
-                // @ts-ignore
-                {
-                  title: "Docs",
-                  description: `More information about the GitHub Sync Feature.`,
-                  Panel: CustomPanel,
-                  options: {
-                    component: () => {
-                      return (
-                        <div>
-                          <p>
-                            For more information about the GitHub Sync feature,
-                            visit the GitHub page:
-                          </p>
-                          <a
-                            href="https://github.com/RoamJS/query-builder/blob/main/docs/github-sync.md"
-                            target="_blank"
-                          >
-                            GitHub Sync Documentation
-                          </a>
-                        </div>
-                      );
-                    },
-                  },
-                } as Field<CustomField>,
-                {
-                  // @ts-ignore
-                  Panel: SelectPanel,
-                  title: "Node Select",
-                  description:
-                    "Select the node type to sync with GitHub Issues",
-                  options: {
-                    items: [
-                      "None",
-                      ...getDiscourseNodes()
-                        .map((node) => node.text)
-                        .filter((text) => text !== "Block"),
-                    ],
-                  },
-                  defaultValue: "None",
-                },
-                // @ts-ignore
-                {
-                  Panel: CustomPanel,
-                  title: "Comments Block",
-                  description:
-                    "Where comments are synced to. This will fire when the node is loaded. You have access to ':in NODETEXT' and ':in NODEUID' as variables for the current node.",
-                  options: {
-                    component: ({ uid }) =>
-                      React.createElement(CommentsQuery, {
-                        parentUid: uid,
-                        onloadArgs,
-                      }),
-                  },
-                } as Field<CustomField>,
-              ],
-            },
-          ],
-        },
-      });
-
       const commentObserver = createBlockObserver({
         onBlockLoad: (b) => {
           const { blockUid } = getUids(b);
           if (CommentContainerUidCache.has(blockUid)) {
             if (b.hasAttribute("github-sync-comment-container")) return;
+
+            // TODO: move this to renderGitHubSyncPage so we can pass in the matching node
+            const title = getPageTitleByBlockUid(blockUid);
+            const matchingNode = isGitHubSyncPage(title);
+            if (!matchingNode) return;
+
             b.setAttribute("github-sync-comment-container", "true");
             const containerDiv = document.createElement("div");
             containerDiv.className = "inline-block ml-2";
@@ -994,6 +922,7 @@ const initializeGitHubSync = async (onloadArgs: OnloadArgs) => {
               <CommentsContainerComponent
                 commentsContainerUid={blockUid}
                 extensionAPI={onloadArgs.extensionAPI}
+                matchingNode={matchingNode}
               />,
               containerDiv,
             );
@@ -1013,7 +942,6 @@ const initializeGitHubSync = async (onloadArgs: OnloadArgs) => {
         },
       });
 
-      unloads.add(() => configObserver?.disconnect());
       unloads.add(() => commentObserver.forEach((o) => o.disconnect()));
       unloads.add(() => CommentUidCache.clear());
       unloads.add(() => CommentContainerUidCache.clear());
@@ -1026,7 +954,6 @@ const initializeGitHubSync = async (onloadArgs: OnloadArgs) => {
   await toggle(isFlagEnabled(SETTING));
   return toggle;
 };
-
 export const toggleGitHubSync = async (
   flag: boolean,
   onloadArgs: OnloadArgs,