From 38999ac66625305ec7069ebf715af448e143df50 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Padez?= <andre.padez@gmail.com>
Date: Wed, 19 Aug 2026 10:41:43 +0000
Subject: [PATCH] wrap the vaultwarden url field in a form so enter submits

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 web/VaultPanel.tsx | 13 +++++--------
 1 file changed, 5 insertions(+), 8 deletions(-)

diff --git a/web/VaultPanel.tsx b/web/VaultPanel.tsx
index 92e66e4..c295b16 100644
--- a/web/VaultPanel.tsx
+++ b/web/VaultPanel.tsx
@@ -108,7 +108,8 @@ export const VaultPanel = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const save = async () => {
+  const save = async (ev?: React.FormEvent) => {
+    ev?.preventDefault();
     setSaving(true);
     setError(null);
     try {
@@ -182,14 +183,11 @@ export const VaultPanel = () => {
           </div>
         </header>
 
-        <section className="flex flex-col gap-4 rounded-xl border border-border p-4">
+        <form onSubmit={save} className="flex flex-col gap-4 rounded-xl border border-border p-4">
           <Field label="Vaultwarden URL">
             <input
               value={url}
               onChange={(ev) => setUrl(ev.target.value)}
-              onKeyDown={(ev) => {
-                if (ev.key === 'Enter' && dirty && !saving) void save();
-              }}
               placeholder="https://vault.example.com"
               spellCheck={false}
               autoCapitalize="none"
@@ -206,8 +204,7 @@ export const VaultPanel = () => {
 
           <div className="flex items-center gap-2">
             <button
-              type="button"
-              onClick={() => void save()}
+              type="submit"
               disabled={!dirty || saving}
               className="rounded-lg bg-primary px-3 py-1.5 text-xs font-medium text-primary-foreground transition-opacity hover:opacity-90 disabled:opacity-40"
             >
@@ -233,7 +230,7 @@ export const VaultPanel = () => {
               </button>
             )}
           </div>
-        </section>
+        </form>
 
         {config?.configured && (
           <section className="flex flex-col gap-3 rounded-xl border border-border p-4">