From f3b494ebe89efe0f1659cd3136f431f787653437 Mon Sep 17 00:00:00 2001
From: simon-ami <sbenedict@gmx.de>
Date: Sun, 11 Jan 2026 16:43:25 +0100
Subject: [PATCH] Add confirmation dialog for restoring default config

- Add Restore Default confirmation modal to settings.html
- Add translation strings to store.js
- Update claude-config.js to trigger modal instead of immediate restore

Co-Authored-By: Claude <noreply@anthropic.com>
---
 public/js/components/claude-config.js |  9 ++++++++-
 public/js/store.js                    |  6 ++++++
 public/views/settings.html            | 27 +++++++++++++++++++++++++++
 3 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/public/js/components/claude-config.js b/public/js/components/claude-config.js
index af5bb00..a402913 100644
--- a/public/js/components/claude-config.js
+++ b/public/js/components/claude-config.js
@@ -144,7 +144,11 @@ window.Components.claudeConfig = () => ({
         }
     },
 
-    async restoreDefaultClaudeConfig() {
+    restoreDefaultClaudeConfig() {
+        document.getElementById('restore_defaults_modal').showModal();
+    },
+
+    async executeRestore() {
         this.restoring = true;
         const password = Alpine.store('global').webuiPassword;
         try {
@@ -157,6 +161,9 @@ window.Components.claudeConfig = () => ({
             if (!response.ok) throw new Error(`HTTP ${response.status}`);
             Alpine.store('global').showToast(Alpine.store('global').t('claudeConfigRestored'), 'success');
 
+            // Close modal
+            document.getElementById('restore_defaults_modal').close();
+
             // Reload the config to reflect the changes
             await this.fetchConfig();
         } catch (e) {
diff --git a/public/js/store.js b/public/js/store.js
index 2cfef80..e5a8ee2 100644
--- a/public/js/store.js
+++ b/public/js/store.js
@@ -161,6 +161,9 @@ document.addEventListener('alpine:init', () => {
                 saveConfigFailed: "Failed to save configuration",
                 restoreConfigFailed: "Failed to restore configuration",
                 restoreDefault: "Restore Default",
+                confirmRestoreTitle: "Confirm Restore",
+                confirmRestoreMessage: "Are you sure you want to restore Claude CLI to default settings? This will remove proxy configuration.",
+                confirmRestore: "Confirm Restore",
                 claudeActive: "Claude Active",
                 claudeEmpty: "Claude Empty",
                 geminiActive: "Gemini Active",
@@ -413,6 +416,9 @@ document.addEventListener('alpine:init', () => {
                 saveConfigFailed: "保存配置失败",
                 restoreConfigFailed: "恢复配置失败",
                 restoreDefault: "恢复默认",
+                confirmRestoreTitle: "确认恢复",
+                confirmRestoreMessage: "确定要将 Claude CLI 恢复为默认设置吗？这将移除代理配置。",
+                confirmRestore: "确认恢复",
                 claudeActive: "Claude 活跃",
                 claudeEmpty: "Claude 耗尽",
                 geminiActive: "Gemini 活跃",
diff --git a/public/views/settings.html b/public/views/settings.html
index 180f419..0760fbd 100644
--- a/public/views/settings.html
+++ b/public/views/settings.html
@@ -543,6 +543,33 @@
                         <span x-show="loading" class="loading loading-spinner loading-xs"></span>
                     </button>
                 </div>
+
+                <!-- Restore Defaults Confirmation Modal -->
+                <dialog id="restore_defaults_modal" class="modal">
+                    <div class="modal-box bg-space-900 border-2 border-red-500/50">
+                        <h3 class="font-bold text-lg text-red-400 flex items-center gap-2">
+                            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
+                            </svg>
+                            <span x-text="$store.global.t('confirmRestoreTitle')">Confirm Restore</span>
+                        </h3>
+                        <p class="py-4 text-gray-300" x-text="$store.global.t('confirmRestoreMessage')">
+                            Are you sure you want to restore Claude CLI to default settings? This will remove proxy configuration.
+                        </p>
+                        <div class="modal-action">
+                            <button class="btn btn-ghost text-gray-400" onclick="document.getElementById('restore_defaults_modal').close()"
+                                x-text="$store.global.t('cancel')">Cancel</button>
+                            <button class="btn bg-red-500 hover:bg-red-600 border-none text-white" @click="executeRestore()"
+                                :disabled="restoring"
+                                :class="{ 'loading': restoring }">
+                                <span x-text="$store.global.t('confirmRestore')" x-show="!restoring">Confirm Restore</span>
+                            </button>
+                        </div>
+                    </div>
+                    <form method="dialog" class="modal-backdrop">
+                        <button>close</button>
+                    </form>
+                </dialog>
             </div>
 
             <!-- Tab 3: Models Configuration -->