feat: add proxy configuration support
- Add proxy settings UI component with enable/disable toggle - Support HTTP, HTTPS, NO_PROXY, and ALL_PROXY environment variables - Store proxy settings in app database for persistence - Apply proxy settings on app startup and when saved - Pass proxy environment variables to Claude command execution - Integrate proxy settings into main Settings page with unified save - Add proxy support for both system binary and sidecar execution This allows users to configure proxy settings for Claude API requests, which is essential for users behind corporate firewalls or in regions requiring proxy access. Fixes network connectivity issues in restricted environments.
This commit is contained in:
@@ -26,6 +26,7 @@ import { ClaudeVersionSelector } from "./ClaudeVersionSelector";
|
||||
import { StorageTab } from "./StorageTab";
|
||||
import { HooksEditor } from "./HooksEditor";
|
||||
import { SlashCommandsManager } from "./SlashCommandsManager";
|
||||
import { ProxySettings } from "./ProxySettings";
|
||||
import { useTheme } from "@/hooks";
|
||||
|
||||
interface SettingsProps {
|
||||
@@ -82,6 +83,10 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
// Theme hook
|
||||
const { theme, setTheme, customColors, setCustomColors } = useTheme();
|
||||
|
||||
// Proxy state
|
||||
const [proxySettingsChanged, setProxySettingsChanged] = useState(false);
|
||||
const saveProxySettings = React.useRef<(() => Promise<void>) | null>(null);
|
||||
|
||||
// Load settings on mount
|
||||
useEffect(() => {
|
||||
loadSettings();
|
||||
@@ -198,6 +203,12 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
setUserHooksChanged(false);
|
||||
}
|
||||
|
||||
// Save proxy settings if changed
|
||||
if (proxySettingsChanged && saveProxySettings.current) {
|
||||
await saveProxySettings.current();
|
||||
setProxySettingsChanged(false);
|
||||
}
|
||||
|
||||
setToast({ message: "Settings saved successfully!", type: "success" });
|
||||
} catch (err) {
|
||||
console.error("Failed to save settings:", err);
|
||||
@@ -363,7 +374,7 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
) : (
|
||||
<div className="flex-1 overflow-y-auto p-4">
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
|
||||
<TabsList className="grid grid-cols-7 w-full">
|
||||
<TabsList className="grid grid-cols-8 w-full">
|
||||
<TabsTrigger value="general">General</TabsTrigger>
|
||||
<TabsTrigger value="permissions">Permissions</TabsTrigger>
|
||||
<TabsTrigger value="environment">Environment</TabsTrigger>
|
||||
@@ -371,6 +382,7 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
<TabsTrigger value="hooks">Hooks</TabsTrigger>
|
||||
<TabsTrigger value="commands">Commands</TabsTrigger>
|
||||
<TabsTrigger value="storage">Storage</TabsTrigger>
|
||||
<TabsTrigger value="proxy">Proxy</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
{/* General Settings */}
|
||||
@@ -872,6 +884,19 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
<TabsContent value="storage">
|
||||
<StorageTab />
|
||||
</TabsContent>
|
||||
|
||||
{/* Proxy Settings */}
|
||||
<TabsContent value="proxy">
|
||||
<Card className="p-6">
|
||||
<ProxySettings
|
||||
setToast={setToast}
|
||||
onChange={(hasChanges, _getSettings, save) => {
|
||||
setProxySettingsChanged(hasChanges);
|
||||
saveProxySettings.current = save;
|
||||
}}
|
||||
/>
|
||||
</Card>
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
</div>
|
||||
)}
|
||||
|
Reference in New Issue
Block a user