apply changes from review and update to latest design

Author: uhoreg

src/components/views/settings/encryption/ResetIdentityPanel.tsx

@@ -91,8 +91,13 @@ export function ResetIdentityPanel({ onCancelClick, onFinish, variant }: ResetId
                             onFinish(evt);
                         }}
                     >
-                        {inProgress && <InlineSpinner />}
-                        {_t("action|continue")}
+                        {inProgress ? (
+                            <>
+                                <InlineSpinner /> {_t("settings|encryption|advanced|reset_in_progress")}
+                            </>
+                        ) : (
+                            _t("action|continue")
+                        )}
                     </Button>
                     {inProgress ? (
                         <EncryptionCardEmphasisedContent>

src/i18n/strings/en_EN.json

@@ -2486,6 +2486,7 @@
                 "other_people_device_label": "Never send encrypted messages to unverified devices",
                 "other_people_device_title": "Other people’s devices",
                 "reset_identity": "Reset cryptographic identity",
+                "reset_in_progress": "Reset in progress...",
                 "session_id": "Session ID:",
                 "session_key": "Session key:",
                 "title": "Advanced"

test/unit-tests/components/views/settings/encryption/ResetIdentityPanel-test.tsx

@@ -7,7 +7,7 @@
 
 import React from "react";
 import { type MatrixClient } from "matrix-js-sdk/src/matrix";
-import { sleep } from "matrix-js-sdk/src/utils";
+import { sleep, defer } from "matrix-js-sdk/src/utils";
 import { render, screen } from "jest-matrix-react";
 import userEvent from "@testing-library/user-event";
 
@@ -33,10 +33,7 @@ describe("<ResetIdentityPanel />", () => {
 
         // We need to pause the reset so that we can check that it's providing
         // feedback to the user that something is happening.
-        let resolveResetEncryption;
-        const resetEncryptionPromise: Promise<void> = new Promise((resolve) => {
-            resolveResetEncryption = resolve;
-        });
+        const { promise: resetEncryptionPromise, resolve: resolveResetEncryption } = defer();
         jest.spyOn(matrixClient.getCrypto()!, "resetEncryption").mockImplementation(() => {
             return resetEncryptionPromise;
         });

test/unit-tests/components/views/settings/encryption/__snapshots__/ResetIdentityPanel-test.tsx.snap

@@ -551,7 +551,7 @@ exports[`<ResetIdentityPanel /> should reset the encryption when the continue bu
             fill-rule="evenodd"
           />
         </svg>
-        Continue
+         Reset in progress...
       </button>
       <div
         class="mx_Flex mx_EncryptionCard_emphasisedContent"