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

Add spinner when room encryption is loading in room settings (#28535)

pull/28549/head
Florian Duros 2024-11-26 10:43:21 +01:00 committed by GitHub
parent a2a066d8b4
commit 2ac2bae4fa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 24 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/views/settings/tabs/room/SecurityRoomSettingsTab.tsx
View File

@ -17,6 +17,7 @@ import {
EventType, EventType,
} from "matrix-js-sdk/src/matrix"; } from "matrix-js-sdk/src/matrix";
import { logger } from "matrix-js-sdk/src/logger"; import { logger } from "matrix-js-sdk/src/logger";
import { InlineSpinner } from "@vector-im/compound-web";
import { Icon as WarningIcon } from "../../../../../../res/img/warning.svg"; import { Icon as WarningIcon } from "../../../../../../res/img/warning.svg";
import { _t } from "../../../../../languageHandler"; import { _t } from "../../../../../languageHandler";
@ -53,7 +54,7 @@ interface IState {
guestAccess: GuestAccess; guestAccess: GuestAccess;
history: HistoryVisibility; history: HistoryVisibility;
hasAliases: boolean; hasAliases: boolean;
encrypted: boolean; encrypted: boolean | null;
showAdvancedSection: boolean; showAdvancedSection: boolean;
} }
@ -78,7 +79,7 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
HistoryVisibility.Shared, HistoryVisibility.Shared,
), ),
hasAliases: false, // async loaded in componentDidMount hasAliases: false, // async loaded in componentDidMount
encrypted: false, // async loaded in componentDidMount encrypted: null, // async loaded in componentDidMount
showAdvancedSection: false, showAdvancedSection: false,
}; };
} }
@ -419,6 +420,7 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
const client = this.context; const client = this.context;
const room = this.props.room; const room = this.props.room;
const isEncrypted = this.state.encrypted; const isEncrypted = this.state.encrypted;
const isEncryptionLoading = isEncrypted === null;
const hasEncryptionPermission = room.currentState.mayClientSendStateEvent(EventType.RoomEncryption, client); const hasEncryptionPermission = room.currentState.mayClientSendStateEvent(EventType.RoomEncryption, client);
const isEncryptionForceDisabled = shouldForceDisableEncryption(client); const isEncryptionForceDisabled = shouldForceDisableEncryption(client);
const canEnableEncryption = !isEncrypted && !isEncryptionForceDisabled && hasEncryptionPermission; const canEnableEncryption = !isEncrypted && !isEncryptionForceDisabled && hasEncryptionPermission;
@ -451,18 +453,23 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
: _t("room_settings|security|encryption_permanent") : _t("room_settings|security|encryption_permanent")
} }
> >
<LabelledToggleSwitch {isEncryptionLoading ? (
value={isEncrypted} <InlineSpinner />
onChange={this.onEncryptionChange} ) : (
label={_t("common|encrypted")} <>
disabled={!canEnableEncryption} <LabelledToggleSwitch
/> value={isEncrypted}
{isEncryptionForceDisabled && !isEncrypted && ( onChange={this.onEncryptionChange}
<Caption>{_t("room_settings|security|encryption_forced")}</Caption> label={_t("common|encrypted")}
disabled={!canEnableEncryption}
/>
{isEncryptionForceDisabled && !isEncrypted && (
<Caption>{_t("room_settings|security|encryption_forced")}</Caption>
)}
{encryptionSettings}
</>
)} )}
{encryptionSettings}
</SettingsFieldset> </SettingsFieldset>
{this.renderJoinRule()} {this.renderJoinRule()}
{historySection} {historySection}
</SettingsSection> </SettingsSection>

10
test/unit-tests/components/views/settings/tabs/room/SecurityRoomSettingsTab-test.tsx
View File

@ -75,7 +75,7 @@ describe("<SecurityRoomSettingsTab />", () => {
beforeEach(async () => { beforeEach(async () => {
client.sendStateEvent.mockReset().mockResolvedValue({ event_id: "test" }); client.sendStateEvent.mockReset().mockResolvedValue({ event_id: "test" });
client.isRoomEncrypted.mockReturnValue(false); jest.spyOn(client.getCrypto()!, "isEncryptionEnabledInRoom").mockResolvedValue(false);
client.getClientWellKnown.mockReturnValue(undefined); client.getClientWellKnown.mockReturnValue(undefined);
jest.spyOn(SettingsStore, "getValue").mockRestore(); jest.spyOn(SettingsStore, "getValue").mockRestore();
@ -313,7 +313,7 @@ describe("<SecurityRoomSettingsTab />", () => {
setRoomStateEvents(room); setRoomStateEvents(room);
getComponent(room); getComponent(room);
expect(screen.getByLabelText("Encrypted")).not.toBeChecked(); await waitFor(() => expect(screen.getByLabelText("Encrypted")).not.toBeChecked());
fireEvent.click(screen.getByLabelText("Encrypted")); fireEvent.click(screen.getByLabelText("Encrypted"));
@ -330,7 +330,7 @@ describe("<SecurityRoomSettingsTab />", () => {
setRoomStateEvents(room); setRoomStateEvents(room);
getComponent(room); getComponent(room);
expect(screen.getByLabelText("Encrypted")).not.toBeChecked(); await waitFor(() => expect(screen.getByLabelText("Encrypted")).not.toBeChecked());
fireEvent.click(screen.getByLabelText("Encrypted")); fireEvent.click(screen.getByLabelText("Encrypted"));
@ -416,12 +416,12 @@ describe("<SecurityRoomSettingsTab />", () => {
expect(screen.getByText("Once enabled, encryption cannot be disabled.")).toBeInTheDocument(); expect(screen.getByText("Once enabled, encryption cannot be disabled.")).toBeInTheDocument();
}); });
it("displays unencrypted rooms with toggle disabled", () => { it("displays unencrypted rooms with toggle disabled", async () => {
const room = new Room(roomId, client, userId); const room = new Room(roomId, client, userId);
setRoomStateEvents(room); setRoomStateEvents(room);
getComponent(room); getComponent(room);
expect(screen.getByLabelText("Encrypted")).not.toBeChecked(); await waitFor(() => expect(screen.getByLabelText("Encrypted")).not.toBeChecked());
expect(screen.getByLabelText("Encrypted").getAttribute("aria-disabled")).toEqual("true"); expect(screen.getByLabelText("Encrypted").getAttribute("aria-disabled")).toEqual("true");
expect(screen.queryByText("Once enabled, encryption cannot be disabled.")).not.toBeInTheDocument(); expect(screen.queryByText("Once enabled, encryption cannot be disabled.")).not.toBeInTheDocument();
expect(screen.getByText("Your server requires encryption to be disabled.")).toBeInTheDocument(); expect(screen.getByText("Your server requires encryption to be disabled.")).toBeInTheDocument();