OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Rename `ChangeRecoveryKey.isSetupFlow` into `ChangeRecoveryKey.userHasKeyBackup`

florianduros/encryption-tab
Florian Duros 2025-01-06 15:31:13 +01:00
parent 52076f1b39
commit a0d904e95f
No known key found for this signature in database
GPG Key ID: A5BBB4041B493F15
3 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/views/settings/encryption/ChangeRecoveryKey.tsx
View File

@ -38,10 +38,10 @@ type State = "inform_user" | "save_key_setup_flow" | "save_key_change_flow" | "c
interface ChangeRecoveryKeyProps { interface ChangeRecoveryKeyProps {
/** /**
* If true, the component will display the flow to set up a new recovery key. * If true, the component will display the flow to change the recovery key.
* If false, the component will display the flow to change the recovery key. * If false,the component will display the flow to set up a new recovery key.
*/ */
isSetupFlow: boolean; userHasKeyBackup: boolean;
/** /**
* Called when the recovery key is successfully changed. * Called when the recovery key is successfully changed.
*/ */
@ -56,13 +56,13 @@ interface ChangeRecoveryKeyProps {
* A component to set up or change the recovery key. * A component to set up or change the recovery key.
*/ */
export function ChangeRecoveryKey({ export function ChangeRecoveryKey({
isSetupFlow, userHasKeyBackup,
onFinish, onFinish,
onCancelClick, onCancelClick,
}: ChangeRecoveryKeyProps): JSX.Element | null { }: ChangeRecoveryKeyProps): JSX.Element | null {
const matrixClient = useMatrixClientContext(); const matrixClient = useMatrixClientContext();
const [state, setState] = useState<State>(isSetupFlow ? "inform_user" : "save_key_change_flow"); const [state, setState] = useState<State>(userHasKeyBackup ? "save_key_change_flow" : "inform_user");
// We create a new recovery key, the recovery key will be displayed to the user // We create a new recovery key, the recovery key will be displayed to the user
const recoveryKey = useAsyncMemo(() => matrixClient.getCrypto()!.createRecoveryKeyFromPassphrase(), []); const recoveryKey = useAsyncMemo(() => matrixClient.getCrypto()!.createRecoveryKeyFromPassphrase(), []);
@ -102,7 +102,7 @@ export function ChangeRecoveryKey({
// when we will try to access the secret storage during the bootstrap // when we will try to access the secret storage during the bootstrap
await withSecretStorageKeyCache(() => await withSecretStorageKeyCache(() =>
crypto.bootstrapSecretStorage({ crypto.bootstrapSecretStorage({
setupNewKeyBackup: isSetupFlow, setupNewKeyBackup: !userHasKeyBackup,
setupNewSecretStorage: true, setupNewSecretStorage: true,
createSecretStorageKey: async () => recoveryKey, createSecretStorageKey: async () => recoveryKey,
}), }),
@ -118,9 +118,9 @@ export function ChangeRecoveryKey({
const pages = [ const pages = [
_t("settings|encryption|title"), _t("settings|encryption|title"),
isSetupFlow userHasKeyBackup
? _t("settings|encryption|recovery|set_up_recovery") ? _t("settings|encryption|recovery|change_recovery_key")
: _t("settings|encryption|recovery|change_recovery_key"), : _t("settings|encryption|recovery|set_up_recovery"),
]; ];
const labels = getLabels(state); const labels = getLabels(state);

2
src/components/views/settings/tabs/user/EncryptionUserSettingsTab.tsx
View File

@ -53,7 +53,7 @@ export function EncryptionUserSettingsTab(): JSX.Element {
case "set_recovery_key": case "set_recovery_key":
content = ( content = (
<ChangeRecoveryKey <ChangeRecoveryKey
isSetupFlow={state === "set_recovery_key"} userHasKeyBackup={state === "change_recovery_key"}
onCancelClick={() => setState("main")} onCancelClick={() => setState("main")}
onFinish={() => setState("main")} onFinish={() => setState("main")}
/> />

10
test/unit-tests/components/views/settings/encryption/ChangeRecoveryKey-test.tsx
View File

@ -25,9 +25,9 @@ describe("<ChangeRecoveryKey />", () => {
matrixClient = createTestClient(); matrixClient = createTestClient();
}); });
function renderComponent(isSetupFlow = false, onFinish = jest.fn(), onCancelClick = jest.fn()) { function renderComponent(userHasKeyBackup = true, onFinish = jest.fn(), onCancelClick = jest.fn()) {
return render( return render(
<ChangeRecoveryKey isSetupFlow={isSetupFlow} onFinish={onFinish} onCancelClick={onCancelClick} />, <ChangeRecoveryKey userHasKeyBackup={userHasKeyBackup} onFinish={onFinish} onCancelClick={onCancelClick} />,
withClientContextRenderOptions(matrixClient), withClientContextRenderOptions(matrixClient),
); );
} }
@ -37,7 +37,7 @@ describe("<ChangeRecoveryKey />", () => {
const user = userEvent.setup(); const user = userEvent.setup();
const onCancelClick = jest.fn(); const onCancelClick = jest.fn();
const { asFragment } = renderComponent(true, jest.fn(), onCancelClick); const { asFragment } = renderComponent(false, jest.fn(), onCancelClick);
await waitFor(() => await waitFor(() =>
expect( expect(
screen.getByText( screen.getByText(
@ -55,7 +55,7 @@ describe("<ChangeRecoveryKey />", () => {
const user = userEvent.setup(); const user = userEvent.setup();
const onCancelClick = jest.fn(); const onCancelClick = jest.fn();
const { asFragment } = renderComponent(true, jest.fn(), onCancelClick); const { asFragment } = renderComponent(false, jest.fn(), onCancelClick);
await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" }))); await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" })));
expect(screen.getByText("Save your recovery key somewhere safe")).toBeInTheDocument(); expect(screen.getByText("Save your recovery key somewhere safe")).toBeInTheDocument();
@ -74,7 +74,7 @@ describe("<ChangeRecoveryKey />", () => {
const user = userEvent.setup(); const user = userEvent.setup();
const onFinish = jest.fn(); const onFinish = jest.fn();
const { asFragment } = renderComponent(true, onFinish); const { asFragment } = renderComponent(false, onFinish);
// Display the recovery key to save // Display the recovery key to save
await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" }))); await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" })));
// Display the form to confirm the recovery key // Display the form to confirm the recovery key