From 8aa942c2e2dbcfa3f19c633257ca07384599ccd8 Mon Sep 17 00:00:00 2001
From: Ethan McElroy <emcelroy@concord.org>
Date: Mon, 16 Dec 2024 21:38:17 -0500
Subject: [PATCH] WIP: describe graph by text

---
 src/app-config.json                  |  2 +-
 src/components/developer-options.tsx | 35 ++++++++++++++++++++++++++++
 2 files changed, 36 insertions(+), 1 deletion(-)

diff --git a/src/app-config.json b/src/app-config.json
index 2c22176..becd1c0 100644
--- a/src/app-config.json
+++ b/src/app-config.json
@@ -12,6 +12,6 @@
     "height": 680,
     "width": 380
   },
-  "mockAssistant": false,
+  "mockAssistant": true,
   "mode": "production"
 }
diff --git a/src/components/developer-options.tsx b/src/components/developer-options.tsx
index 67c4fe6..5607a2f 100644
--- a/src/components/developer-options.tsx
+++ b/src/components/developer-options.tsx
@@ -1,5 +1,6 @@
 import React from "react";
 import { observer } from "mobx-react-lite";
+import { codapInterface } from "@concord-consortium/codap-plugin-api";
 import { AssistantModelType } from "../models/assistant-model";
 import { useAppConfigContext } from "../hooks/use-app-config-context";
 
@@ -14,6 +15,39 @@ interface IProps {
 
 export const DeveloperOptionsComponent = observer(function DeveloperOptions({assistantStore, onCreateThread, onDeleteThread, onMockAssistant}: IProps) {
   const appConfig = useAppConfigContext();
+
+  const handleGetGraphData = async () => {
+    const reqGetComponents = {
+      action: "get",
+      resource: "componentList",
+      values: {
+        request: {
+          constraints: {
+            orderBy: "id"
+          }
+        }
+      }
+    };
+    const resGetComponents = await codapInterface.sendRequest(reqGetComponents) as any;
+
+    const graphId = resGetComponents.values.find((item: any) => item.type === "graph").id;
+
+    const reqGetGraph = {
+      action: "get",
+      resource: `component[${graphId}]`,
+      values: {}
+    };
+    const resGetGraph = await codapInterface.sendRequest(reqGetGraph) as any;
+    console.log("Graph Data:", resGetGraph.values);
+
+    const devOptionsContainer = document.querySelector(".developer-options");
+    if (devOptionsContainer) {
+      const img = document.createElement("img");
+      img.src = resGetGraph.values.exportDataUri;
+      devOptionsContainer.appendChild(img);
+    }
+  };
+
   return (
     <div className="developer-options" data-testid="developer-options">
       <label htmlFor="mock-assistant-checkbox" data-testid="mock-assistant-checkbox-label">
@@ -40,6 +74,7 @@ export const DeveloperOptionsComponent = observer(function DeveloperOptions({ass
       >
         New Thread
       </button>
+      <button onClick={handleGetGraphData}>Get Graph Data</button>
     </div>
   );
 });