From 9df1bb6765226a8516bbbd2d027d53286c89ce15 Mon Sep 17 00:00:00 2001
From: arkml <6592213+arkml@users.noreply.github.com>
Date: Fri, 27 Feb 2026 15:52:19 +0530
Subject: [PATCH] Config graph model (#411)

* config to specify graph model
---
 .../src/components/onboarding-modal.tsx       | 121 +++++++++++------
 .../src/components/settings-dialog.tsx        | 123 ++++++++++++------
 apps/x/packages/core/src/agents/runtime.ts    |   7 +-
 apps/x/packages/shared/src/models.ts          |   1 +
 4 files changed, 166 insertions(+), 86 deletions(-)

diff --git a/apps/x/apps/renderer/src/components/onboarding-modal.tsx b/apps/x/apps/renderer/src/components/onboarding-modal.tsx
index 4855cab7..9398f2fe 100644
--- a/apps/x/apps/renderer/src/components/onboarding-modal.tsx
+++ b/apps/x/apps/renderer/src/components/onboarding-modal.tsx
@@ -57,14 +57,14 @@ export function OnboardingModal({ open, onComplete }: OnboardingModalProps) {
   const [modelsCatalog, setModelsCatalog] = useState<Record<string, LlmModelOption[]>>({})
   const [modelsLoading, setModelsLoading] = useState(false)
   const [modelsError, setModelsError] = useState<string | null>(null)
-  const [providerConfigs, setProviderConfigs] = useState<Record<LlmProviderFlavor, { apiKey: string; baseURL: string; model: string }>>({
-    openai: { apiKey: "", baseURL: "", model: "" },
-    anthropic: { apiKey: "", baseURL: "", model: "" },
-    google: { apiKey: "", baseURL: "", model: "" },
-    openrouter: { apiKey: "", baseURL: "", model: "" },
-    aigateway: { apiKey: "", baseURL: "", model: "" },
-    ollama: { apiKey: "", baseURL: "http://localhost:11434", model: "" },
-    "openai-compatible": { apiKey: "", baseURL: "http://localhost:1234/v1", model: "" },
+  const [providerConfigs, setProviderConfigs] = useState<Record<LlmProviderFlavor, { apiKey: string; baseURL: string; model: string; knowledgeGraphModel: string }>>({
+    openai: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    anthropic: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    google: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    openrouter: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    aigateway: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    ollama: { apiKey: "", baseURL: "http://localhost:11434", model: "", knowledgeGraphModel: "" },
+    "openai-compatible": { apiKey: "", baseURL: "http://localhost:1234/v1", model: "", knowledgeGraphModel: "" },
   })
   const [testState, setTestState] = useState<{ status: "idle" | "testing" | "success" | "error"; error?: string }>({
     status: "idle",
@@ -87,7 +87,7 @@ export function OnboardingModal({ open, onComplete }: OnboardingModalProps) {
   const [slackConnecting, setSlackConnecting] = useState(false)
 
   const updateProviderConfig = useCallback(
-    (provider: LlmProviderFlavor, updates: Partial<{ apiKey: string; baseURL: string; model: string }>) => {
+    (provider: LlmProviderFlavor, updates: Partial<{ apiKey: string; baseURL: string; model: string; knowledgeGraphModel: string }>) => {
       setProviderConfigs(prev => ({
         ...prev,
         [provider]: { ...prev[provider], ...updates },
@@ -287,6 +287,7 @@ export function OnboardingModal({ open, onComplete }: OnboardingModalProps) {
       const apiKey = activeConfig.apiKey.trim() || undefined
       const baseURL = activeConfig.baseURL.trim() || undefined
       const model = activeConfig.model.trim()
+      const knowledgeGraphModel = activeConfig.knowledgeGraphModel.trim() || undefined
       const providerConfig = {
         provider: {
           flavor: llmProvider,
@@ -294,6 +295,7 @@ export function OnboardingModal({ open, onComplete }: OnboardingModalProps) {
           baseURL,
         },
         model,
+        knowledgeGraphModel,
       }
       const result = await window.ipc.invoke("models:test", providerConfig)
       if (result.success) {
@@ -657,39 +659,74 @@ export function OnboardingModal({ open, onComplete }: OnboardingModalProps) {
             )}
           </div>
 
-          <div className="space-y-2">
-            <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Model</span>
-            {modelsLoading ? (
-              <div className="flex items-center gap-2 text-sm text-muted-foreground">
-                <Loader2 className="size-4 animate-spin" />
-                Loading models...
-              </div>
-            ) : showModelInput ? (
-              <Input
-                value={activeConfig.model}
-                onChange={(e) => updateProviderConfig(llmProvider, { model: e.target.value })}
-                placeholder="Enter model"
-              />
-            ) : (
-              <Select
-                value={activeConfig.model}
-                onValueChange={(value) => updateProviderConfig(llmProvider, { model: value })}
-              >
-                <SelectTrigger>
-                  <SelectValue placeholder="Select a model" />
-                </SelectTrigger>
-                <SelectContent>
-                  {modelsForProvider.map((model) => (
-                    <SelectItem key={model.id} value={model.id}>
-                      {model.name || model.id}
-                    </SelectItem>
-                  ))}
-                </SelectContent>
-              </Select>
-            )}
-            {modelsError && (
-              <div className="text-xs text-destructive">{modelsError}</div>
-            )}
+          <div className="grid grid-cols-2 gap-3">
+            <div className="space-y-2">
+              <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Assistant model</span>
+              {modelsLoading ? (
+                <div className="flex items-center gap-2 text-sm text-muted-foreground">
+                  <Loader2 className="size-4 animate-spin" />
+                  Loading...
+                </div>
+              ) : showModelInput ? (
+                <Input
+                  value={activeConfig.model}
+                  onChange={(e) => updateProviderConfig(llmProvider, { model: e.target.value })}
+                  placeholder="Enter model"
+                />
+              ) : (
+                <Select
+                  value={activeConfig.model}
+                  onValueChange={(value) => updateProviderConfig(llmProvider, { model: value })}
+                >
+                  <SelectTrigger>
+                    <SelectValue placeholder="Select a model" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {modelsForProvider.map((model) => (
+                      <SelectItem key={model.id} value={model.id}>
+                        {model.name || model.id}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              )}
+              {modelsError && (
+                <div className="text-xs text-destructive">{modelsError}</div>
+              )}
+            </div>
+
+            <div className="space-y-2">
+              <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Knowledge graph model</span>
+              {modelsLoading ? (
+                <div className="flex items-center gap-2 text-sm text-muted-foreground">
+                  <Loader2 className="size-4 animate-spin" />
+                  Loading...
+                </div>
+              ) : showModelInput ? (
+                <Input
+                  value={activeConfig.knowledgeGraphModel}
+                  onChange={(e) => updateProviderConfig(llmProvider, { knowledgeGraphModel: e.target.value })}
+                  placeholder={activeConfig.model || "Enter model"}
+                />
+              ) : (
+                <Select
+                  value={activeConfig.knowledgeGraphModel || "__same__"}
+                  onValueChange={(value) => updateProviderConfig(llmProvider, { knowledgeGraphModel: value === "__same__" ? "" : value })}
+                >
+                  <SelectTrigger>
+                    <SelectValue placeholder="Select a model" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="__same__">Same as assistant</SelectItem>
+                    {modelsForProvider.map((model) => (
+                      <SelectItem key={model.id} value={model.id}>
+                        {model.name || model.id}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              )}
+            </div>
           </div>
 
           {showApiKey && (
diff --git a/apps/x/apps/renderer/src/components/settings-dialog.tsx b/apps/x/apps/renderer/src/components/settings-dialog.tsx
index 840b9cf4..2948ae02 100644
--- a/apps/x/apps/renderer/src/components/settings-dialog.tsx
+++ b/apps/x/apps/renderer/src/components/settings-dialog.tsx
@@ -167,14 +167,14 @@ const defaultBaseURLs: Partial<Record<LlmProviderFlavor, string>> = {
 
 function ModelSettings({ dialogOpen }: { dialogOpen: boolean }) {
   const [provider, setProvider] = useState<LlmProviderFlavor>("openai")
-  const [providerConfigs, setProviderConfigs] = useState<Record<LlmProviderFlavor, { apiKey: string; baseURL: string; model: string }>>({
-    openai: { apiKey: "", baseURL: "", model: "" },
-    anthropic: { apiKey: "", baseURL: "", model: "" },
-    google: { apiKey: "", baseURL: "", model: "" },
-    openrouter: { apiKey: "", baseURL: "", model: "" },
-    aigateway: { apiKey: "", baseURL: "", model: "" },
-    ollama: { apiKey: "", baseURL: "http://localhost:11434", model: "" },
-    "openai-compatible": { apiKey: "", baseURL: "http://localhost:1234/v1", model: "" },
+  const [providerConfigs, setProviderConfigs] = useState<Record<LlmProviderFlavor, { apiKey: string; baseURL: string; model: string; knowledgeGraphModel: string }>>({
+    openai: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    anthropic: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    google: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    openrouter: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    aigateway: { apiKey: "", baseURL: "", model: "", knowledgeGraphModel: "" },
+    ollama: { apiKey: "", baseURL: "http://localhost:11434", model: "", knowledgeGraphModel: "" },
+    "openai-compatible": { apiKey: "", baseURL: "http://localhost:1234/v1", model: "", knowledgeGraphModel: "" },
   })
   const [modelsCatalog, setModelsCatalog] = useState<Record<string, LlmModelOption[]>>({})
   const [modelsLoading, setModelsLoading] = useState(false)
@@ -199,7 +199,7 @@ function ModelSettings({ dialogOpen }: { dialogOpen: boolean }) {
     (!requiresBaseURL || activeConfig.baseURL.trim().length > 0)
 
   const updateConfig = useCallback(
-    (prov: LlmProviderFlavor, updates: Partial<{ apiKey: string; baseURL: string; model: string }>) => {
+    (prov: LlmProviderFlavor, updates: Partial<{ apiKey: string; baseURL: string; model: string; knowledgeGraphModel: string }>) => {
       setProviderConfigs(prev => ({
         ...prev,
         [prov]: { ...prev[prov], ...updates },
@@ -229,6 +229,7 @@ function ModelSettings({ dialogOpen }: { dialogOpen: boolean }) {
               apiKey: parsed.provider.apiKey || "",
               baseURL: parsed.provider.baseURL || (defaultBaseURLs[flavor] || ""),
               model: parsed.model,
+              knowledgeGraphModel: parsed.knowledgeGraphModel || "",
             },
           }))
         }
@@ -296,6 +297,7 @@ function ModelSettings({ dialogOpen }: { dialogOpen: boolean }) {
           baseURL: activeConfig.baseURL.trim() || undefined,
         },
         model: activeConfig.model.trim(),
+        knowledgeGraphModel: activeConfig.knowledgeGraphModel.trim() || undefined,
       }
       const result = await window.ipc.invoke("models:test", providerConfig)
       if (result.success) {
@@ -362,40 +364,75 @@ function ModelSettings({ dialogOpen }: { dialogOpen: boolean }) {
         )}
       </div>
 
-      {/* Model selection */}
-      <div className="space-y-2">
-        <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Model</span>
-        {modelsLoading ? (
-          <div className="flex items-center gap-2 text-sm text-muted-foreground">
-            <Loader2 className="size-4 animate-spin" />
-            Loading models...
-          </div>
-        ) : showModelInput ? (
-          <Input
-            value={activeConfig.model}
-            onChange={(e) => updateConfig(provider, { model: e.target.value })}
-            placeholder="Enter model"
-          />
-        ) : (
-          <Select
-            value={activeConfig.model}
-            onValueChange={(value) => updateConfig(provider, { model: value })}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder="Select a model" />
-            </SelectTrigger>
-            <SelectContent>
-              {modelsForProvider.map((model) => (
-                <SelectItem key={model.id} value={model.id}>
-                  {model.name || model.id}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-        )}
-        {modelsError && (
-          <div className="text-xs text-destructive">{modelsError}</div>
-        )}
+      {/* Model selection - side by side */}
+      <div className="grid grid-cols-2 gap-3">
+        <div className="space-y-2">
+          <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Assistant model</span>
+          {modelsLoading ? (
+            <div className="flex items-center gap-2 text-sm text-muted-foreground">
+              <Loader2 className="size-4 animate-spin" />
+              Loading...
+            </div>
+          ) : showModelInput ? (
+            <Input
+              value={activeConfig.model}
+              onChange={(e) => updateConfig(provider, { model: e.target.value })}
+              placeholder="Enter model"
+            />
+          ) : (
+            <Select
+              value={activeConfig.model}
+              onValueChange={(value) => updateConfig(provider, { model: value })}
+            >
+              <SelectTrigger>
+                <SelectValue placeholder="Select a model" />
+              </SelectTrigger>
+              <SelectContent>
+                {modelsForProvider.map((model) => (
+                  <SelectItem key={model.id} value={model.id}>
+                    {model.name || model.id}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          )}
+          {modelsError && (
+            <div className="text-xs text-destructive">{modelsError}</div>
+          )}
+        </div>
+
+        <div className="space-y-2">
+          <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Knowledge graph model</span>
+          {modelsLoading ? (
+            <div className="flex items-center gap-2 text-sm text-muted-foreground">
+              <Loader2 className="size-4 animate-spin" />
+              Loading...
+            </div>
+          ) : showModelInput ? (
+            <Input
+              value={activeConfig.knowledgeGraphModel}
+              onChange={(e) => updateConfig(provider, { knowledgeGraphModel: e.target.value })}
+              placeholder={activeConfig.model || "Enter model"}
+            />
+          ) : (
+            <Select
+              value={activeConfig.knowledgeGraphModel || "__same__"}
+              onValueChange={(value) => updateConfig(provider, { knowledgeGraphModel: value === "__same__" ? "" : value })}
+            >
+              <SelectTrigger>
+                <SelectValue placeholder="Select a model" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="__same__">Same as assistant</SelectItem>
+                {modelsForProvider.map((model) => (
+                  <SelectItem key={model.id} value={model.id}>
+                    {model.name || model.id}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          )}
+        </div>
       </div>
 
       {/* API Key */}
diff --git a/apps/x/packages/core/src/agents/runtime.ts b/apps/x/packages/core/src/agents/runtime.ts
index e1924523..0aeb167f 100644
--- a/apps/x/packages/core/src/agents/runtime.ts
+++ b/apps/x/packages/core/src/agents/runtime.ts
@@ -706,7 +706,12 @@ export async function* streamAgent({
 
     // set up provider + model
     const provider = createProvider(modelConfig.provider);
-    const model = provider.languageModel(modelConfig.model);
+    const knowledgeGraphAgents = ["note_creation", "email-draft", "meeting-prep"];
+    const modelId = (knowledgeGraphAgents.includes(state.agentName!) && modelConfig.knowledgeGraphModel)
+        ? modelConfig.knowledgeGraphModel
+        : modelConfig.model;
+    const model = provider.languageModel(modelId);
+    logger.log(`using model: ${modelId}`);
 
     let loopCounter = 0;
     while (true) {
diff --git a/apps/x/packages/shared/src/models.ts b/apps/x/packages/shared/src/models.ts
index 14e91689..48085e9f 100644
--- a/apps/x/packages/shared/src/models.ts
+++ b/apps/x/packages/shared/src/models.ts
@@ -10,4 +10,5 @@ export const LlmProvider = z.object({
 export const LlmModelConfig = z.object({
   provider: LlmProvider,
   model: z.string(),
+  knowledgeGraphModel: z.string().optional(),
 });