From 43ee2b7b537d9ca26bbff6bb85ff7c27f9701546 Mon Sep 17 00:00:00 2001
From: Douglas <douglas.ym.lai@gmail.com>
Date: Thu, 23 Apr 2026 13:47:29 +0100
Subject: [PATCH] refactor(ChatBox): use Host abstraction for Electron APIs

Use useHost() for file selection and opening skill folders instead of
window.electronAPI.

Made-with: Cursor
---
 src/components/ChatBox/MessageItem/UserMessageRichContent.tsx | 4 +++-
 src/components/ChatBox/index.tsx                              | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/ChatBox/MessageItem/UserMessageRichContent.tsx b/src/components/ChatBox/MessageItem/UserMessageRichContent.tsx
index adf30735..acadfe03 100644
--- a/src/components/ChatBox/MessageItem/UserMessageRichContent.tsx
+++ b/src/components/ChatBox/MessageItem/UserMessageRichContent.tsx
@@ -12,6 +12,7 @@
 // limitations under the License.
 // ========= Copyright 2025-2026 @ Eigent.ai All Rights Reserved. =========
 
+import { useHost } from '@/host';
 import {
   RICH_SKILL_STYLE_CLASSES,
   hashSkillLabel,
@@ -113,11 +114,12 @@ export function UserMessageRichContent({
   variant = 'card',
   className,
 }: UserMessageRichContentProps) {
+  const host = useHost();
   const contentNodes = parseContentWithTags(content);
 
   const handleOpenSkillFolder = (skillName: string) => {
     if (!isSafeSkillFolderName(skillName)) return;
-    window.electronAPI?.openSkillFolder?.(skillName);
+    host?.electronAPI?.openSkillFolder?.(skillName);
   };
 
   const bodyClass =
diff --git a/src/components/ChatBox/index.tsx b/src/components/ChatBox/index.tsx
index 9a4a87bc..8cbc5e19 100644
--- a/src/components/ChatBox/index.tsx
+++ b/src/components/ChatBox/index.tsx
@@ -20,6 +20,7 @@ import {
   proxyFetchGet,
 } from '@/api/http';
 import useChatStoreAdapter from '@/hooks/useChatStoreAdapter';
+import { useHost } from '@/host';
 import { generateUniqueId } from '@/lib';
 import { proxyUpdateTriggerExecution } from '@/service/triggerApi';
 import { useAuthStore } from '@/store/authStore';
@@ -46,6 +47,7 @@ const CHAT_SCROLL_BOTTOM_MIN_PX = 128;
 const CHAT_SCROLL_BOTTOM_GAP_PX = 8;
 export default function ChatBox(): JSX.Element {
   const [message, setMessage] = useState<string>('');
+  const host = useHost();
 
   //Get Chatstore for the active project's task
   const { chatStore, projectStore } = useChatStoreAdapter();
@@ -675,7 +677,7 @@ export default function ChatBox(): JSX.Element {
   // File selection handler
   const handleFileSelect = async () => {
     try {
-      const result = await window.electronAPI.selectFile({
+      const result = await host?.electronAPI?.selectFile({
         title: t('chat.select-file'),
         filters: [{ name: t('chat.all-files'), extensions: ['*'] }],
       });