feat: add configurable sandbox mode setting

Add a global setting to enable/disable sandbox mode for Claude Agent SDK.
This allows users to control sandbox behavior based on their authentication
setup and system compatibility.

Changes:
- Add enableSandboxMode to GlobalSettings (default: true)
- Add sandbox mode checkbox in Claude settings UI
- Wire up setting through app store and settings service
- Update createChatOptions and createAutoModeOptions to use setting
- Add getEnableSandboxModeSetting helper function
- Remove hardcoded sandbox configuration from ClaudeProvider
- Add detailed logging throughout agent execution flow

The sandbox mode requires API key or OAuth token authentication. Users
experiencing issues with CLI-only auth can disable it in settings.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

apps/ui/src/components/views/settings-view.tsx

@@ -50,6 +50,8 @@ export function SettingsView() {
     setValidationModel,
     autoLoadClaudeMd,
     setAutoLoadClaudeMd,
+    enableSandboxMode,
+    setEnableSandboxMode,
   } = useAppStore();
 
   // Hide usage tracking when using API key (only show for Claude Code CLI users)
@@ -108,6 +110,8 @@ export function SettingsView() {
             <ClaudeMdSettings
               autoLoadClaudeMd={autoLoadClaudeMd}
               onAutoLoadClaudeMdChange={setAutoLoadClaudeMd}
+              enableSandboxMode={enableSandboxMode}
+              onEnableSandboxModeChange={setEnableSandboxMode}
             />
             {showUsageTracking && <ClaudeUsageSection />}
           </div>

apps/ui/src/components/views/settings-view/claude/claude-md-settings.tsx

@@ -1,11 +1,13 @@
 import { Label } from '@/components/ui/label';
 import { Checkbox } from '@/components/ui/checkbox';
-import { FileCode } from 'lucide-react';
+import { FileCode, Shield } from 'lucide-react';
 import { cn } from '@/lib/utils';
 
 interface ClaudeMdSettingsProps {
   autoLoadClaudeMd: boolean;
   onAutoLoadClaudeMdChange: (enabled: boolean) => void;
+  enableSandboxMode: boolean;
+  onEnableSandboxModeChange: (enabled: boolean) => void;
 }
 
 /**
@@ -25,6 +27,8 @@ interface ClaudeMdSettingsProps {
 export function ClaudeMdSettings({
   autoLoadClaudeMd,
   onAutoLoadClaudeMdChange,
+  enableSandboxMode,
+  onEnableSandboxModeChange,
 }: ClaudeMdSettingsProps) {
   return (
     <div
@@ -76,6 +80,32 @@ export function ClaudeMdSettings({
             </p>
           </div>
         </div>
+
+        <div className="group flex items-start space-x-3 p-3 rounded-xl hover:bg-accent/30 transition-colors duration-200 -mx-3 mt-2">
+          <Checkbox
+            id="enable-sandbox-mode"
+            checked={enableSandboxMode}
+            onCheckedChange={(checked) => onEnableSandboxModeChange(checked === true)}
+            className="mt-1"
+            data-testid="enable-sandbox-mode-checkbox"
+          />
+          <div className="space-y-1.5">
+            <Label
+              htmlFor="enable-sandbox-mode"
+              className="text-foreground cursor-pointer font-medium flex items-center gap-2"
+            >
+              <Shield className="w-4 h-4 text-brand-500" />
+              Enable Sandbox Mode
+            </Label>
+            <p className="text-xs text-muted-foreground/80 leading-relaxed">
+              Run bash commands in an isolated sandbox environment for additional security.
+              <span className="block mt-1 text-warning/80">
+                Note: On some systems, enabling sandbox mode may cause the agent to hang without
+                responding. If you experience issues, try disabling this option.
+              </span>
+            </p>
+          </div>
+        </div>
       </div>
     </div>
   );