From b5993aaabbc0d6333462edeaabd5fc9faa5105bb Mon Sep 17 00:00:00 2001
From: Giwayume <Giwayume@users.noreply.github.com>
Date: Thu, 10 Apr 2025 03:30:37 -0400
Subject: [PATCH] Continue button is disabled when uploading a recovery key
 file (#29695)

* Wait for setState to complete before validating recovery key

* Linter fix

* Pass in recovery key to validateRecoveryKey function
---
 .../dialogs/security/AccessSecretStorageDialog.tsx  | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/views/dialogs/security/AccessSecretStorageDialog.tsx b/src/components/views/dialogs/security/AccessSecretStorageDialog.tsx
index 14c144a538..01d7203b68 100644
--- a/src/components/views/dialogs/security/AccessSecretStorageDialog.tsx
+++ b/src/components/views/dialogs/security/AccessSecretStorageDialog.tsx
@@ -86,11 +86,11 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
     };
 
     private validateRecoveryKeyOnChange = debounce(async (): Promise<void> => {
-        await this.validateRecoveryKey();
+        await this.validateRecoveryKey(this.state.recoveryKey);
     }, VALIDATION_THROTTLE_MS);
 
-    private async validateRecoveryKey(): Promise<void> {
-        if (this.state.recoveryKey === "") {
+    private async validateRecoveryKey(recoveryKey: string): Promise<void> {
+        if (recoveryKey === "") {
             this.setState({
                 recoveryKeyValid: null,
                 recoveryKeyCorrect: null,
@@ -100,7 +100,7 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
 
         try {
             const cli = MatrixClientPeg.safeGet();
-            const decodedKey = decodeRecoveryKey(this.state.recoveryKey);
+            const decodedKey = decodeRecoveryKey(recoveryKey);
             const correct = await cli.secretStorage.checkKey(decodedKey, this.props.keyInfo);
             this.setState({
                 recoveryKeyValid: true,
@@ -148,11 +148,12 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
             // right number of characters, but it's really just to make sure that what we're reading is
             // text because we'll put it in the text field.
             if (/^[123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz\s]+$/.test(contents)) {
+                const recoveryKey = contents.trim();
                 this.setState({
                     recoveryKeyFileError: null,
-                    recoveryKey: contents.trim(),
+                    recoveryKey,
                 });
-                await this.validateRecoveryKey();
+                await this.validateRecoveryKey(recoveryKey);
             } else {
                 this.setState({
                     recoveryKeyFileError: true,