Apply prettier formatting
This commit is contained in:
Michael Weimann
parent
1cac306093
commit
526645c791
1576 changed files with 65385 additions and 62478 deletions
|
|
@ -14,11 +14,11 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import React from "react";
|
||||
import { GuestAccess, HistoryVisibility, JoinRule } from "matrix-js-sdk/src/@types/partials";
|
||||
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
|
||||
import { RoomStateEvent } from "matrix-js-sdk/src/models/room-state";
|
||||
import { EventType } from 'matrix-js-sdk/src/@types/event';
|
||||
import { EventType } from "matrix-js-sdk/src/@types/event";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
|
||||
import { Icon as WarningIcon } from "../../../../../../res/img/warning.svg";
|
||||
|
|
@ -26,18 +26,18 @@ import { _t } from "../../../../../languageHandler";
|
|||
import LabelledToggleSwitch from "../../../elements/LabelledToggleSwitch";
|
||||
import Modal from "../../../../../Modal";
|
||||
import QuestionDialog from "../../../dialogs/QuestionDialog";
|
||||
import StyledRadioGroup from '../../../elements/StyledRadioGroup';
|
||||
import StyledRadioGroup from "../../../elements/StyledRadioGroup";
|
||||
import { SettingLevel } from "../../../../../settings/SettingLevel";
|
||||
import SettingsStore from "../../../../../settings/SettingsStore";
|
||||
import { UIFeature } from "../../../../../settings/UIFeature";
|
||||
import AccessibleButton from "../../../elements/AccessibleButton";
|
||||
import SettingsFlag from '../../../elements/SettingsFlag';
|
||||
import createRoom, { IOpts } from '../../../../../createRoom';
|
||||
import CreateRoomDialog from '../../../dialogs/CreateRoomDialog';
|
||||
import SettingsFlag from "../../../elements/SettingsFlag";
|
||||
import createRoom, { IOpts } from "../../../../../createRoom";
|
||||
import CreateRoomDialog from "../../../dialogs/CreateRoomDialog";
|
||||
import JoinRuleSettings from "../../JoinRuleSettings";
|
||||
import ErrorDialog from "../../../dialogs/ErrorDialog";
|
||||
import SettingsFieldset from '../../SettingsFieldset';
|
||||
import ExternalLink from '../../../elements/ExternalLink';
|
||||
import SettingsFieldset from "../../SettingsFieldset";
|
||||
import ExternalLink from "../../../elements/ExternalLink";
|
||||
import PosthogTrackers from "../../../../../PosthogTrackers";
|
||||
import MatrixClientContext from "../../../../../contexts/MatrixClientContext";
|
||||
|
||||
|
|
@ -66,12 +66,12 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
this.state = {
|
||||
guestAccess: this.pullContentPropertyFromEvent<GuestAccess>(
|
||||
state.getStateEvents(EventType.RoomGuestAccess, ""),
|
||||
'guest_access',
|
||||
"guest_access",
|
||||
GuestAccess.Forbidden,
|
||||
),
|
||||
history: this.pullContentPropertyFromEvent<HistoryVisibility>(
|
||||
state.getStateEvents(EventType.RoomHistoryVisibility, ""),
|
||||
'history_visibility',
|
||||
"history_visibility",
|
||||
HistoryVisibility.Shared,
|
||||
),
|
||||
hasAliases: false, // async loaded in componentDidMount
|
||||
|
|
@ -82,7 +82,7 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
|
||||
componentDidMount() {
|
||||
this.context.on(RoomStateEvent.Events, this.onStateEvent);
|
||||
this.hasAliases().then(hasAliases => this.setState({ hasAliases }));
|
||||
this.hasAliases().then((hasAliases) => this.setState({ hasAliases }));
|
||||
}
|
||||
|
||||
private pullContentPropertyFromEvent<T>(event: MatrixEvent, key: string, defaultValue: T): T {
|
||||
|
|
@ -106,31 +106,45 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
private onEncryptionChange = async () => {
|
||||
if (this.context.getRoom(this.props.roomId)?.getJoinRule() === JoinRule.Public) {
|
||||
const dialog = Modal.createDialog(QuestionDialog, {
|
||||
title: _t('Are you sure you want to add encryption to this public room?'),
|
||||
description: <div>
|
||||
<p> { _t(
|
||||
"<b>It's not recommended to add encryption to public rooms.</b> " +
|
||||
"Anyone can find and join public rooms, so anyone can read messages in them. " +
|
||||
"You'll get none of the benefits of encryption, and you won't be able to turn it " +
|
||||
"off later. Encrypting messages in a public room will make receiving and sending " +
|
||||
"messages slower.",
|
||||
null,
|
||||
{ "b": (sub) => <b>{ sub }</b> },
|
||||
) } </p>
|
||||
<p> { _t(
|
||||
"To avoid these issues, create a <a>new encrypted room</a> for " +
|
||||
"the conversation you plan to have.",
|
||||
null,
|
||||
{
|
||||
"a": (sub) => <AccessibleButton kind='link_inline'
|
||||
onClick={() => {
|
||||
dialog.close();
|
||||
this.createNewRoom(false, true);
|
||||
}}> { sub } </AccessibleButton>,
|
||||
},
|
||||
) } </p>
|
||||
</div>,
|
||||
|
||||
title: _t("Are you sure you want to add encryption to this public room?"),
|
||||
description: (
|
||||
<div>
|
||||
<p>
|
||||
{" "}
|
||||
{_t(
|
||||
"<b>It's not recommended to add encryption to public rooms.</b> " +
|
||||
"Anyone can find and join public rooms, so anyone can read messages in them. " +
|
||||
"You'll get none of the benefits of encryption, and you won't be able to turn it " +
|
||||
"off later. Encrypting messages in a public room will make receiving and sending " +
|
||||
"messages slower.",
|
||||
null,
|
||||
{ b: (sub) => <b>{sub}</b> },
|
||||
)}{" "}
|
||||
</p>
|
||||
<p>
|
||||
{" "}
|
||||
{_t(
|
||||
"To avoid these issues, create a <a>new encrypted room</a> for " +
|
||||
"the conversation you plan to have.",
|
||||
null,
|
||||
{
|
||||
a: (sub) => (
|
||||
<AccessibleButton
|
||||
kind="link_inline"
|
||||
onClick={() => {
|
||||
dialog.close();
|
||||
this.createNewRoom(false, true);
|
||||
}}
|
||||
>
|
||||
{" "}
|
||||
{sub}{" "}
|
||||
</AccessibleButton>
|
||||
),
|
||||
},
|
||||
)}{" "}
|
||||
</p>
|
||||
</div>
|
||||
),
|
||||
});
|
||||
|
||||
const { finished } = dialog;
|
||||
|
|
@ -139,16 +153,14 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
}
|
||||
|
||||
Modal.createDialog(QuestionDialog, {
|
||||
title: _t('Enable encryption?'),
|
||||
title: _t("Enable encryption?"),
|
||||
description: _t(
|
||||
"Once enabled, encryption for a room cannot be disabled. Messages sent in an encrypted " +
|
||||
"room cannot be seen by the server, only by the participants of the room. Enabling encryption " +
|
||||
"may prevent many bots and bridges from working correctly. <a>Learn more about encryption.</a>",
|
||||
"room cannot be seen by the server, only by the participants of the room. Enabling encryption " +
|
||||
"may prevent many bots and bridges from working correctly. <a>Learn more about encryption.</a>",
|
||||
{},
|
||||
{
|
||||
a: sub => <ExternalLink
|
||||
href="https://element.io/help#encryption"
|
||||
>{ sub }</ExternalLink>,
|
||||
a: (sub) => <ExternalLink href="https://element.io/help#encryption">{sub}</ExternalLink>,
|
||||
},
|
||||
),
|
||||
onFinished: (confirm) => {
|
||||
|
|
@ -159,13 +171,12 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
|
||||
const beforeEncrypted = this.state.encrypted;
|
||||
this.setState({ encrypted: true });
|
||||
this.context.sendStateEvent(
|
||||
this.props.roomId, EventType.RoomEncryption,
|
||||
{ algorithm: "m.megolm.v1.aes-sha2" },
|
||||
).catch((e) => {
|
||||
logger.error(e);
|
||||
this.setState({ encrypted: beforeEncrypted });
|
||||
});
|
||||
this.context
|
||||
.sendStateEvent(this.props.roomId, EventType.RoomEncryption, { algorithm: "m.megolm.v1.aes-sha2" })
|
||||
.catch((e) => {
|
||||
logger.error(e);
|
||||
this.setState({ encrypted: beforeEncrypted });
|
||||
});
|
||||
},
|
||||
});
|
||||
};
|
||||
|
|
@ -177,19 +188,23 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
|
||||
this.setState({ guestAccess });
|
||||
|
||||
this.context.sendStateEvent(this.props.roomId, EventType.RoomGuestAccess, {
|
||||
guest_access: guestAccess,
|
||||
}, "").catch((e) => {
|
||||
logger.error(e);
|
||||
this.setState({ guestAccess: beforeGuestAccess });
|
||||
});
|
||||
this.context
|
||||
.sendStateEvent(
|
||||
this.props.roomId,
|
||||
EventType.RoomGuestAccess,
|
||||
{
|
||||
guest_access: guestAccess,
|
||||
},
|
||||
"",
|
||||
)
|
||||
.catch((e) => {
|
||||
logger.error(e);
|
||||
this.setState({ guestAccess: beforeGuestAccess });
|
||||
});
|
||||
};
|
||||
|
||||
private createNewRoom = async (defaultPublic: boolean, defaultEncrypted: boolean) => {
|
||||
const modal = Modal.createDialog<[boolean, IOpts]>(
|
||||
CreateRoomDialog,
|
||||
{ defaultPublic, defaultEncrypted },
|
||||
);
|
||||
const modal = Modal.createDialog<[boolean, IOpts]>(CreateRoomDialog, { defaultPublic, defaultEncrypted });
|
||||
|
||||
PosthogTrackers.trackInteraction("WebRoomSettingsSecurityTabCreateNewRoomButton");
|
||||
|
||||
|
|
@ -205,12 +220,19 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
if (beforeHistory === history) return;
|
||||
|
||||
this.setState({ history: history });
|
||||
this.context.sendStateEvent(this.props.roomId, EventType.RoomHistoryVisibility, {
|
||||
history_visibility: history,
|
||||
}, "").catch((e) => {
|
||||
logger.error(e);
|
||||
this.setState({ history: beforeHistory });
|
||||
});
|
||||
this.context
|
||||
.sendStateEvent(
|
||||
this.props.roomId,
|
||||
EventType.RoomHistoryVisibility,
|
||||
{
|
||||
history_visibility: history,
|
||||
},
|
||||
"",
|
||||
)
|
||||
.catch((e) => {
|
||||
logger.error(e);
|
||||
this.setState({ history: beforeHistory });
|
||||
});
|
||||
};
|
||||
|
||||
private updateBlacklistDevicesFlag = (checked: boolean) => {
|
||||
|
|
@ -231,11 +253,9 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
let aliasWarning = null;
|
||||
if (room.getJoinRule() === JoinRule.Public && !this.state.hasAliases) {
|
||||
aliasWarning = (
|
||||
<div className='mx_SecurityRoomSettingsTab_warning'>
|
||||
<div className="mx_SecurityRoomSettingsTab_warning">
|
||||
<WarningIcon width={15} height={15} />
|
||||
<span>
|
||||
{ _t("To link to this room, please add an address.") }
|
||||
</span>
|
||||
<span>{_t("To link to this room, please add an address.")}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -243,16 +263,18 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
roomName: room?.name,
|
||||
});
|
||||
|
||||
return <SettingsFieldset legend={_t("Access")} description={description}>
|
||||
<JoinRuleSettings
|
||||
room={room}
|
||||
beforeChange={this.onBeforeJoinRuleChange}
|
||||
onError={this.onJoinRuleChangeError}
|
||||
closeSettingsFn={this.props.closeSettingsFn}
|
||||
promptUpgrade={true}
|
||||
aliasWarning={aliasWarning}
|
||||
/>
|
||||
</SettingsFieldset>;
|
||||
return (
|
||||
<SettingsFieldset legend={_t("Access")} description={description}>
|
||||
<JoinRuleSettings
|
||||
room={room}
|
||||
beforeChange={this.onBeforeJoinRuleChange}
|
||||
onError={this.onJoinRuleChangeError}
|
||||
closeSettingsFn={this.props.closeSettingsFn}
|
||||
promptUpgrade={true}
|
||||
aliasWarning={aliasWarning}
|
||||
/>
|
||||
</SettingsFieldset>
|
||||
);
|
||||
}
|
||||
|
||||
private onJoinRuleChangeError = (error: Error) => {
|
||||
|
|
@ -266,29 +288,43 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
if (this.state.encrypted && joinRule === JoinRule.Public) {
|
||||
const dialog = Modal.createDialog(QuestionDialog, {
|
||||
title: _t("Are you sure you want to make this encrypted room public?"),
|
||||
description: <div>
|
||||
<p> { _t(
|
||||
"<b>It's not recommended to make encrypted rooms public.</b> " +
|
||||
"It will mean anyone can find and join the room, so anyone can read messages. " +
|
||||
"You'll get none of the benefits of encryption. Encrypting messages in a public " +
|
||||
"room will make receiving and sending messages slower.",
|
||||
null,
|
||||
{ "b": (sub) => <b>{ sub }</b> },
|
||||
) } </p>
|
||||
<p> { _t(
|
||||
"To avoid these issues, create a <a>new public room</a> for the conversation " +
|
||||
"you plan to have.",
|
||||
null,
|
||||
{
|
||||
"a": (sub) => <AccessibleButton
|
||||
kind='link_inline'
|
||||
onClick={() => {
|
||||
dialog.close();
|
||||
this.createNewRoom(true, false);
|
||||
}}> { sub } </AccessibleButton>,
|
||||
},
|
||||
) } </p>
|
||||
</div>,
|
||||
description: (
|
||||
<div>
|
||||
<p>
|
||||
{" "}
|
||||
{_t(
|
||||
"<b>It's not recommended to make encrypted rooms public.</b> " +
|
||||
"It will mean anyone can find and join the room, so anyone can read messages. " +
|
||||
"You'll get none of the benefits of encryption. Encrypting messages in a public " +
|
||||
"room will make receiving and sending messages slower.",
|
||||
null,
|
||||
{ b: (sub) => <b>{sub}</b> },
|
||||
)}{" "}
|
||||
</p>
|
||||
<p>
|
||||
{" "}
|
||||
{_t(
|
||||
"To avoid these issues, create a <a>new public room</a> for the conversation " +
|
||||
"you plan to have.",
|
||||
null,
|
||||
{
|
||||
a: (sub) => (
|
||||
<AccessibleButton
|
||||
kind="link_inline"
|
||||
onClick={() => {
|
||||
dialog.close();
|
||||
this.createNewRoom(true, false);
|
||||
}}
|
||||
>
|
||||
{" "}
|
||||
{sub}{" "}
|
||||
</AccessibleButton>
|
||||
),
|
||||
},
|
||||
)}{" "}
|
||||
</p>
|
||||
</div>
|
||||
),
|
||||
});
|
||||
|
||||
const { finished } = dialog;
|
||||
|
|
@ -312,15 +348,15 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
const options = [
|
||||
{
|
||||
value: HistoryVisibility.Shared,
|
||||
label: _t('Members only (since the point in time of selecting this option)'),
|
||||
label: _t("Members only (since the point in time of selecting this option)"),
|
||||
},
|
||||
{
|
||||
value: HistoryVisibility.Invited,
|
||||
label: _t('Members only (since they were invited)'),
|
||||
label: _t("Members only (since they were invited)"),
|
||||
},
|
||||
{
|
||||
value: HistoryVisibility.Joined,
|
||||
label: _t('Members only (since they joined)'),
|
||||
label: _t("Members only (since they joined)"),
|
||||
},
|
||||
];
|
||||
|
||||
|
|
@ -332,18 +368,22 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
});
|
||||
}
|
||||
|
||||
const description = _t('Changes to who can read history will only apply to future messages in this room. ' +
|
||||
'The visibility of existing history will be unchanged.');
|
||||
const description = _t(
|
||||
"Changes to who can read history will only apply to future messages in this room. " +
|
||||
"The visibility of existing history will be unchanged.",
|
||||
);
|
||||
|
||||
return (<SettingsFieldset legend={_t("Who can read history?")} description={description}>
|
||||
<StyledRadioGroup
|
||||
name="historyVis"
|
||||
value={history}
|
||||
onChange={this.onHistoryRadioToggle}
|
||||
disabled={!canChangeHistory}
|
||||
definitions={options}
|
||||
/>
|
||||
</SettingsFieldset>);
|
||||
return (
|
||||
<SettingsFieldset legend={_t("Who can read history?")} description={description}>
|
||||
<StyledRadioGroup
|
||||
name="historyVis"
|
||||
value={history}
|
||||
onChange={this.onHistoryRadioToggle}
|
||||
disabled={!canChangeHistory}
|
||||
definitions={options}
|
||||
/>
|
||||
</SettingsFieldset>
|
||||
);
|
||||
}
|
||||
|
||||
private toggleAdvancedSection = () => {
|
||||
|
|
@ -356,18 +396,22 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
const state = client.getRoom(this.props.roomId).currentState;
|
||||
const canSetGuestAccess = state.mayClientSendStateEvent(EventType.RoomGuestAccess, client);
|
||||
|
||||
return <>
|
||||
<LabelledToggleSwitch
|
||||
value={guestAccess === GuestAccess.CanJoin}
|
||||
onChange={this.onGuestAccessChange}
|
||||
disabled={!canSetGuestAccess}
|
||||
label={_t("Enable guest access")}
|
||||
/>
|
||||
<p>
|
||||
{ _t("People with supported clients will be able to join " +
|
||||
"the room without having a registered account.") }
|
||||
</p>
|
||||
</>;
|
||||
return (
|
||||
<>
|
||||
<LabelledToggleSwitch
|
||||
value={guestAccess === GuestAccess.CanJoin}
|
||||
onChange={this.onGuestAccessChange}
|
||||
disabled={!canSetGuestAccess}
|
||||
label={_t("Enable guest access")}
|
||||
/>
|
||||
<p>
|
||||
{_t(
|
||||
"People with supported clients will be able to join " +
|
||||
"the room without having a registered account.",
|
||||
)}
|
||||
</p>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
@ -379,12 +423,14 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
|
||||
let encryptionSettings = null;
|
||||
if (isEncrypted && SettingsStore.isEnabled("blacklistUnverifiedDevices")) {
|
||||
encryptionSettings = <SettingsFlag
|
||||
name="blacklistUnverifiedDevices"
|
||||
level={SettingLevel.ROOM_DEVICE}
|
||||
onChange={this.updateBlacklistDevicesFlag}
|
||||
roomId={this.props.roomId}
|
||||
/>;
|
||||
encryptionSettings = (
|
||||
<SettingsFlag
|
||||
name="blacklistUnverifiedDevices"
|
||||
level={SettingLevel.ROOM_DEVICE}
|
||||
onChange={this.updateBlacklistDevicesFlag}
|
||||
roomId={this.props.roomId}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const historySection = this.renderHistory();
|
||||
|
|
@ -398,31 +444,34 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
|
|||
kind="link"
|
||||
className="mx_SettingsTab_showAdvanced"
|
||||
>
|
||||
{ this.state.showAdvancedSection ? _t("Hide advanced") : _t("Show advanced") }
|
||||
{this.state.showAdvancedSection ? _t("Hide advanced") : _t("Show advanced")}
|
||||
</AccessibleButton>
|
||||
{ this.state.showAdvancedSection && this.renderAdvanced() }
|
||||
{this.state.showAdvancedSection && this.renderAdvanced()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mx_SettingsTab mx_SecurityRoomSettingsTab">
|
||||
<div className="mx_SettingsTab_heading">{ _t("Security & Privacy") }</div>
|
||||
<div className="mx_SettingsTab_heading">{_t("Security & Privacy")}</div>
|
||||
|
||||
<SettingsFieldset legend={_t("Encryption")} description={_t("Once enabled, encryption cannot be disabled.")}>
|
||||
<SettingsFieldset
|
||||
legend={_t("Encryption")}
|
||||
description={_t("Once enabled, encryption cannot be disabled.")}
|
||||
>
|
||||
<LabelledToggleSwitch
|
||||
value={isEncrypted}
|
||||
onChange={this.onEncryptionChange}
|
||||
label={_t("Encrypted")}
|
||||
disabled={!canEnableEncryption}
|
||||
/>
|
||||
{ encryptionSettings }
|
||||
{encryptionSettings}
|
||||
</SettingsFieldset>
|
||||
|
||||
{ this.renderJoinRule() }
|
||||
{this.renderJoinRule()}
|
||||
|
||||
{ advanced }
|
||||
{ historySection }
|
||||
{advanced}
|
||||
{historySection}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue