import { useState, useEffect } from "react"; import { useAppStore } from "@/store/app-store"; import { getElectronAPI } from "@/lib/electron"; import type { ProviderConfigParams } from "@/config/api-providers"; interface TestResult { success: boolean; message: string; } interface ApiKeyStatus { hasAnthropicKey: boolean; hasGoogleKey: boolean; } /** * Custom hook for managing API key state and operations * Handles input values, visibility toggles, connection testing, and saving */ export function useApiKeyManagement() { const { apiKeys, setApiKeys } = useAppStore(); // API key values const [anthropicKey, setAnthropicKey] = useState(apiKeys.anthropic); const [googleKey, setGoogleKey] = useState(apiKeys.google); // Visibility toggles const [showAnthropicKey, setShowAnthropicKey] = useState(false); const [showGoogleKey, setShowGoogleKey] = useState(false); // Test connection states const [testingConnection, setTestingConnection] = useState(false); const [testResult, setTestResult] = useState(null); const [testingGeminiConnection, setTestingGeminiConnection] = useState(false); const [geminiTestResult, setGeminiTestResult] = useState( null ); // API key status from environment const [apiKeyStatus, setApiKeyStatus] = useState(null); // Save state const [saved, setSaved] = useState(false); // Sync local state with store useEffect(() => { setAnthropicKey(apiKeys.anthropic); setGoogleKey(apiKeys.google); }, [apiKeys]); // Check API key status from environment on mount useEffect(() => { const checkApiKeyStatus = async () => { const api = getElectronAPI(); if (api?.setup?.getApiKeys) { try { const status = await api.setup.getApiKeys(); if (status.success) { setApiKeyStatus({ hasAnthropicKey: status.hasAnthropicKey, hasGoogleKey: status.hasGoogleKey, }); } } catch (error) { console.error("Failed to check API key status:", error); } } }; checkApiKeyStatus(); }, []); // Test Anthropic/Claude connection const handleTestAnthropicConnection = async () => { setTestingConnection(true); setTestResult(null); try { const response = await fetch("/api/claude/test", { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ apiKey: anthropicKey }), }); const data = await response.json(); if (response.ok && data.success) { setTestResult({ success: true, message: data.message || "Connection successful! Claude responded.", }); } else { setTestResult({ success: false, message: data.error || "Failed to connect to Claude API.", }); } } catch { setTestResult({ success: false, message: "Network error. Please check your connection.", }); } finally { setTestingConnection(false); } }; // Test Google/Gemini connection const handleTestGeminiConnection = async () => { setTestingGeminiConnection(true); setGeminiTestResult(null); try { const response = await fetch("/api/gemini/test", { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ apiKey: googleKey }), }); const data = await response.json(); if (response.ok && data.success) { setGeminiTestResult({ success: true, message: data.message || "Connection successful! Gemini responded.", }); } else { setGeminiTestResult({ success: false, message: data.error || "Failed to connect to Gemini API.", }); } } catch { setGeminiTestResult({ success: false, message: "Network error. Please check your connection.", }); } finally { setTestingGeminiConnection(false); } }; // Save API keys const handleSave = () => { setApiKeys({ anthropic: anthropicKey, google: googleKey, }); setSaved(true); setTimeout(() => setSaved(false), 2000); }; // Build provider config params for buildProviderConfigs const providerConfigParams: ProviderConfigParams = { apiKeys, anthropic: { value: anthropicKey, setValue: setAnthropicKey, show: showAnthropicKey, setShow: setShowAnthropicKey, testing: testingConnection, onTest: handleTestAnthropicConnection, result: testResult, }, google: { value: googleKey, setValue: setGoogleKey, show: showGoogleKey, setShow: setShowGoogleKey, testing: testingGeminiConnection, onTest: handleTestGeminiConnection, result: geminiTestResult, }, }; return { // Provider config params for buildProviderConfigs providerConfigParams, // API key status from environment apiKeyStatus, // Save handler and state handleSave, saved, }; }