From a093c54b162ad378b4978f4dfd8ca0f84f6771db Mon Sep 17 00:00:00 2001
From: Adrian Astles <adrian.e.astles@gmail.com>
Date: Sun, 6 Jul 2025 20:41:26 +0800
Subject: [PATCH] simplified security key management interface.

---
 messages/en-US.json                |  2 +-
 src/components/SecurityKeyForm.tsx | 19 ++++++-------------
 2 files changed, 7 insertions(+), 14 deletions(-)

diff --git a/messages/en-US.json b/messages/en-US.json
index 4a68fb17..a0b570fc 100644
--- a/messages/en-US.json
+++ b/messages/en-US.json
@@ -1150,7 +1150,7 @@
     "securityKeyLoadError": "Failed to load security keys",
     "securityKeyLogin": "Sign in with security key",
     "securityKeyAuthError": "Failed to authenticate with security key",
-    "securityKeyRecommendation": "Consider registering another security key on a different device to ensure you don't get locked out of your account.",
+    "securityKeyRecommendation": "Tip: Register a backup security key on another device to ensure you always have access to your account.",
     "registering": "Registering...",
     "securityKeyPrompt": "Please verify your identity using your security key. Make sure your security key is connected and ready.",
     "securityKeyBrowserNotSupported": "Your browser doesn't support security keys. Please use a modern browser like Chrome, Firefox, or Safari.",
diff --git a/src/components/SecurityKeyForm.tsx b/src/components/SecurityKeyForm.tsx
index a83165bc..bb76ee56 100644
--- a/src/components/SecurityKeyForm.tsx
+++ b/src/components/SecurityKeyForm.tsx
@@ -267,19 +267,12 @@ export default function SecurityKeyForm({ open, setOpen }: SecurityKeyFormProps)
                     <div className="space-y-4">
                         <div className="flex items-center justify-between">
                             <h3 className="text-sm font-medium text-muted-foreground">{t('securityKeyList')}</h3>
-                            <div className="flex items-center gap-2">
-                                {securityKeys.length > 0 && (
-                                    <Badge className="text-xs">
-                                        {securityKeys.length} {securityKeys.length === 1 ? 'key' : 'keys'}
-                                    </Badge>
-                                )}
-                                <Button
-                                    className="h-8 w-8 p-0"
-                                    onClick={() => setShowRegisterDialog(true)}
-                                >
-                                    <Plus className="h-4 w-4" />
-                                </Button>
-                            </div>
+                            <Button
+                                className="h-8 w-8 p-0"
+                                onClick={() => setShowRegisterDialog(true)}
+                            >
+                                <Plus className="h-4 w-4" />
+                            </Button>
                         </div>
 
                         {securityKeys.length > 0 ? (