From 4d2295c2af91c69046478bfe83b012bcbd947d1a Mon Sep 17 00:00:00 2001
From: akprinciple <akeemolayiwola9@gmail.com>
Date: Tue, 30 Jun 2026 03:35:29 +0100
Subject: [PATCH] Settings page labels lack htmlFor

---
 .../src/app/settings/settings-content.tsx     | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/frontend/src/app/settings/settings-content.tsx b/frontend/src/app/settings/settings-content.tsx
index bb50750a..5483dd9b 100644
--- a/frontend/src/app/settings/settings-content.tsx
+++ b/frontend/src/app/settings/settings-content.tsx
@@ -242,8 +242,9 @@ export default function SettingsContent() {
 
             <div className="space-y-3 pl-12">
               <div>
-                <label className="text-sm text-white/60 dark:text-black/60">Default Token</label>
+                <label htmlFor="default-token" className="text-sm text-white/60 dark:text-black/60">Default Token</label>
                 <select
+                  id="default-token"
                   value={displayCurrency}
                   onChange={(e) => {
                     const val = e.target.value as DisplayCurrency;
@@ -259,8 +260,12 @@ export default function SettingsContent() {
               </div>
 
               <div>
-                <label className="text-sm text-white/60 dark:text-black/60">Amount Format</label>
-                <div className="flex gap-2 mt-1">
+                <label id="amount-format-label" className="text-sm text-white/60 dark:text-black/60">Amount Format</label>
+                <div
+                  className="flex gap-2 mt-1"
+                  role="radiogroup"
+                  aria-labelledby="amount-format-label"
+                >
                   {(["full", "compact"] as const).map((fmt) => (
                     <button
                       key={fmt}
@@ -281,8 +286,12 @@ export default function SettingsContent() {
               </div>
 
               <div>
-                <label className="text-sm text-white/60 dark:text-black/60">Decimal Places</label>
-                <div className="flex gap-2 mt-1">
+                <label id="decimal-places-label" className="text-sm text-white/60 dark:text-black/60">Decimal Places</label>
+                <div
+                  className="flex gap-2 mt-1"
+                  role="radiogroup"
+                  aria-labelledby="decimal-places-label"
+                >
                   {([2, 4, 7] as DecimalPlaces[]).map((places) => (
                     <button
                       key={places}