From a8c87125fafe66cc51980c627c142fd78c4c7e63 Mon Sep 17 00:00:00 2001
From: 0xYYBB | ZYY | Bobo <128128010+the-dev-z@users.noreply.github.com>
Date: Wed, 12 Nov 2025 19:43:00 +0800
Subject: [PATCH] =?UTF-8?q?fix(web):=20fix=20button=20disabled=20validatio?=
 =?UTF-8?q?n=20to=20normalize=200x=20prefix=20(#937)=20##=20Problem=20PR?=
 =?UTF-8?q?=20#917=20fixed=20the=20validation=20logic=20but=20missed=20fix?=
 =?UTF-8?q?ing=20the=20button=20disabled=20state:=20**Issue:**=20-=20Butto?=
 =?UTF-8?q?n=20enabled/disabled=20check=20uses=20raw=20input=20length=20(i?=
 =?UTF-8?q?ncludes=20"0x")=20-=20Validation=20logic=20uses=20normalized=20?=
 =?UTF-8?q?length=20(excludes=20"0x")=20-=20**Result:**=20Button=20can=20b?=
 =?UTF-8?q?e=20enabled=20with=20insufficient=20hex=20characters=20**Exampl?=
 =?UTF-8?q?e=20scenario:**=201.=20User=20inputs:=20`0x`=20+=2030=20hex=20c?=
 =?UTF-8?q?hars=20=3D=2032=20total=20chars=202.=20Button=20check:=20`32=20?=
 =?UTF-8?q?<=2032`=20=E2=86=92=20false=20=E2=86=92=20=E2=9C=85=20Button=20?=
 =?UTF-8?q?enabled=203.=20User=20clicks=20button=204.=20Validation:=20norm?=
 =?UTF-8?q?alized=20to=2030=20hex=20chars=20=E2=86=92=20`30=20<=2032`=20?=
 =?UTF-8?q?=E2=86=92=20=E2=9D=8C=20Error=205.=20Error=20message:=20"?=
 =?UTF-8?q?=E9=9C=80=E8=A6=81=E8=87=B3=E5=B0=91=2032=20=E5=80=8B=E5=AD=97?=
 =?UTF-8?q?=E7=AC=A6"=20(confusing!)=20##=20Root=20Cause=20**Lines=20230?=
 =?UTF-8?q?=20&=20301**:=20Button=20disabled=20conditions=20don't=20normal?=
 =?UTF-8?q?ize=20input=20```typescript=20//=20=E2=9D=8C=20Before:=20Checks?=
 =?UTF-8?q?=20raw=20length=20including=20"0x"=20disabled=3D{part1.length?=
 =?UTF-8?q?=20<=20expectedPart1Length=20||=20processing}=20disabled=3D{par?=
 =?UTF-8?q?t2.length=20<=20expectedPart2Length}=20```=20##=20Solution=20No?=
 =?UTF-8?q?rmalize=20input=20before=20checking=20length=20in=20disabled=20?=
 =?UTF-8?q?conditions:=20```typescript=20//=20=E2=9C=85=20After:=20Normali?=
 =?UTF-8?q?ze=20before=20checking=20disabled=3D{=20=20=20(part1.startsWith?=
 =?UTF-8?q?('0x')=20=3F=20part1.slice(2)=20:=20part1).length=20<=20=20=20?=
 =?UTF-8?q?=20=20expectedPart1Length=20||=20processing=20}=20disabled=3D{?=
 =?UTF-8?q?=20=20=20(part2.startsWith('0x')=20=3F=20part2.slice(2)=20:=20p?=
 =?UTF-8?q?art2).length=20<=20=20=20expectedPart2Length=20}=20```=20##=20T?=
 =?UTF-8?q?esting=20|=20Input=20|=20Total=20Length=20|=20Normalized=20Leng?=
 =?UTF-8?q?th=20|=20Button=20(Before)=20|=20Button=20(After)=20|=20Click?=
 =?UTF-8?q?=20Result=20|=20|-------|--------------|-------------------|---?=
 =?UTF-8?q?--------------|----------------|--------------|=20|=20`0x`=20+?=
 =?UTF-8?q?=2030=20hex=20|=2032=20|=2030=20|=20=E2=9C=85=20Enabled=20(bug)?=
 =?UTF-8?q?=20|=20=E2=9D=8C=20Disabled=20|=20N/A=20|=20|=20`0x`=20+=2032?=
 =?UTF-8?q?=20hex=20|=2034=20|=2032=20|=20=E2=9C=85=20Enabled=20|=20?=
 =?UTF-8?q?=E2=9C=85=20Enabled=20|=20=E2=9C=85=20Valid=20|=20|=2032=20hex?=
 =?UTF-8?q?=20|=2032=20|=2032=20|=20=E2=9C=85=20Enabled=20|=20=E2=9C=85=20?=
 =?UTF-8?q?Enabled=20|=20=E2=9C=85=20Valid=20|=20##=20Impact=20-=20?=
 =?UTF-8?q?=E2=9C=85=20Button=20state=20now=20consistent=20with=20validati?=
 =?UTF-8?q?on=20logic=20-=20=E2=9C=85=20Users=20won't=20see=20confusing=20?=
 =?UTF-8?q?"need=2032=20chars"=20errors=20when=20button=20is=20enabled=20-?=
 =?UTF-8?q?=20=E2=9C=85=20Better=20UX=20-=20button=20only=20enabled=20when?=
 =?UTF-8?q?=20input=20is=20truly=20valid=20**Related:**=20Follow-up=20to?=
 =?UTF-8?q?=20PR=20#917=20Co-authored-by:=20the-dev-z=20<the-dev-z@users.n?=
 =?UTF-8?q?oreply.github.com>=20Co-authored-by:=20tinkle-community=20<tink?=
 =?UTF-8?q?lefund@gmail.com>?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/TwoStageKeyModal.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/web/src/components/TwoStageKeyModal.tsx b/web/src/components/TwoStageKeyModal.tsx
index 0e261fb4..70e0f478 100644
--- a/web/src/components/TwoStageKeyModal.tsx
+++ b/web/src/components/TwoStageKeyModal.tsx
@@ -227,7 +227,10 @@ export function TwoStageKeyModal({
               <div className="flex gap-3">
                 <button
                   onClick={handleStage1Next}
-                  disabled={part1.length < expectedPart1Length || processing}
+                  disabled={
+                    (part1.startsWith('0x') ? part1.slice(2) : part1).length <
+                      expectedPart1Length || processing
+                  }
                   className="flex-1 bg-blue-600 hover:bg-blue-700 disabled:bg-gray-600 text-white font-medium py-3 px-4 rounded-lg transition-colors"
                 >
                   {processing
@@ -298,7 +301,10 @@ export function TwoStageKeyModal({
               <div className="flex gap-3">
                 <button
                   onClick={handleStage2Complete}
-                  disabled={part2.length < expectedPart2Length}
+                  disabled={
+                    (part2.startsWith('0x') ? part2.slice(2) : part2).length <
+                    expectedPart2Length
+                  }
                   className="flex-1 bg-green-600 hover:bg-green-700 disabled:bg-gray-600 text-white font-medium py-3 px-4 rounded-lg transition-colors"
                 >
                   🔒 {t('twoStageKey.encryptButton', language)}