fix(web): make the first connect click explicitly commitment-free

The preview only appeared AFTER clicking "Connect" — the exact button
hesitant users avoid, fearing the click immediately modifies their
config. Rename the row action to "Review & connect" and say up front
in the modal subtitle and wizard intro that nothing is written until
the confirm step, so the safety of the first click is visible before
it happens (Spec 078 US1 trust copy).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: Dumbris

frontend/src/components/ConnectModal.vue

@@ -3,7 +3,7 @@
     <div class="modal-box max-w-lg">
       <h3 class="font-bold text-lg mb-2">Connect MCPProxy to AI Agents</h3>
       <p class="text-sm opacity-70 mb-4">
-        Register MCPProxy as an MCP server in your AI tools. This modifies the tool's config file (backup created automatically).
+        Register MCPProxy as an MCP server in your AI tools. Clicking a client shows the exact change first — nothing is written until you confirm (backup created automatically).
       </p>
 
       <!-- Loading state -->
@@ -75,7 +75,7 @@
                 :disabled="loading.clients[client.id] || previewLoading[client.id]"
               >
                 <span v-if="loading.clients[client.id] || previewLoading[client.id]" class="loading loading-spinner loading-xs"></span>
-                <span v-else>Connect</span>
+                <span v-else>Review & connect</span>
               </button>
               <!-- Spec 075 US1: explicit, no-eager-read access check. The stat-only
                    listing leaves installed clients 'unknown'; this is the only

frontend/src/components/OnboardingWizard.vue

@@ -49,7 +49,7 @@
         <!-- ============================ -->
         <section v-if="activeTab === 'clients'" data-test="panel-clients">
           <p class="text-sm opacity-70 mb-4">
-            Pick at least one AI tool. MCPProxy registers itself in that tool's config so the assistant can talk to mcpproxy. A timestamped backup is created before any file is modified.
+            Pick at least one AI tool. MCPProxy registers itself in that tool's config so the assistant can talk to mcpproxy. You'll see the exact change before anything is written, and a timestamped backup is created first.
           </p>
 
           <div v-if="loadingClients" class="flex justify-center py-6">
@@ -1256,7 +1256,7 @@ const ClientRow: FunctionalComponent<
                   },
                   props.busy || props.previewBusy
                     ? [h('span', { class: 'loading loading-spinner loading-xs' })]
-                    : ['Connect']
+                    : ['Review & connect']
                 ),
       ]),
     ]

frontend/tests/unit/connect-modal.spec.ts

@@ -154,7 +154,7 @@ describe('ConnectModal', () => {
     // A real one-click Connect button must be offered (not greyed out).
     const connectButton = wrapper.find('button.btn-primary.btn-xs')
     expect(connectButton.exists()).toBe(true)
-    expect(connectButton.text()).toContain('Connect')
+    expect(connectButton.text()).toContain('Review & connect')
 
     // The bridge note must be surfaced to the user.
     expect(wrapper.text()).toContain('mcp-remote stdio bridge')
@@ -187,7 +187,7 @@ describe('ConnectModal', () => {
     // Fresh install: no config file yet, but the bridge Connect must still appear.
     const connectButton = wrapper.find('button.btn-primary.btn-xs')
     expect(connectButton.exists()).toBe(true)
-    expect(connectButton.text()).toContain('Connect')
+    expect(connectButton.text()).toContain('Review & connect')
     expect(wrapper.text()).not.toContain('Config not found')
   })
 
@@ -293,7 +293,7 @@ describe('ConnectModal', () => {
     // cursor is genuinely not connected -> Connect button still offered.
     const connectButtons = wrapper.findAll('button.btn-primary.btn-xs')
     expect(connectButtons.length).toBe(1)
-    expect(connectButtons[0].text()).toContain('Connect')
+    expect(connectButtons[0].text()).toContain('Review & connect')
   })
 
   // Spec 075 (MCP-2833) US1: the stat-only listing reports access_state=unknown
@@ -327,7 +327,7 @@ describe('ConnectModal', () => {
     // Explicit, no-eager-read affordance to verify access on demand.
     expect(wrapper.find('[data-test="connect-check-access"]').exists()).toBe(true)
     // Connect remains offered.
-    expect(wrapper.find('button.btn-primary.btn-xs').text()).toContain('Connect')
+    expect(wrapper.find('button.btn-primary.btn-xs').text()).toContain('Review & connect')
   })
 
   // Spec 075 US2: a permission-denied client surfaces a distinct, actionable