Unified room context menus (#7072)

This commit is contained in:
Michael Telatynski 2021-11-15 11:39:25 +00:00 committed by GitHub
parent 720b092844
commit 27c3153947
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
23 changed files with 660 additions and 133 deletions

View file

@ -1,5 +1,5 @@
/*
Copyright 2019 New Vector Ltd
Copyright 2019 - 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -24,9 +24,18 @@ import { SettingLevel } from "../../../../../settings/SettingLevel";
import { replaceableComponent } from "../../../../../utils/replaceableComponent";
import { logger } from "matrix-js-sdk/src/logger";
import { RoomEchoChamber } from "../../../../../stores/local-echo/RoomEchoChamber";
import { EchoChamber } from '../../../../../stores/local-echo/EchoChamber';
import MatrixClientContext from "../../../../../contexts/MatrixClientContext";
import StyledRadioGroup from "../../../elements/StyledRadioGroup";
import { RoomNotifState } from '../../../../../RoomNotifs';
import defaultDispatcher from "../../../../../dispatcher/dispatcher";
import { Action } from "../../../../../dispatcher/actions";
import { UserTab } from "../../../dialogs/UserSettingsDialog";
interface IProps {
roomId: string;
closeSettingsFn(): void;
}
interface IState {
@ -36,10 +45,16 @@ interface IState {
@replaceableComponent("views.settings.tabs.room.NotificationsSettingsTab")
export default class NotificationsSettingsTab extends React.Component<IProps, IState> {
private readonly roomProps: RoomEchoChamber;
private soundUpload = createRef<HTMLInputElement>();
constructor(props: IProps) {
super(props);
static contextType = MatrixClientContext;
public context!: React.ContextType<typeof MatrixClientContext>;
constructor(props: IProps, context: React.ContextType<typeof MatrixClientContext>) {
super(props, context);
this.roomProps = EchoChamber.forRoom(context.getRoom(this.props.roomId));
this.state = {
currentSound: "default",
@ -144,6 +159,19 @@ export default class NotificationsSettingsTab extends React.Component<IProps, IS
});
};
private onRoomNotificationChange = (value: RoomNotifState) => {
this.roomProps.notificationVolume = value;
this.forceUpdate();
};
private onOpenSettingsClick = () => {
this.props.closeSettingsFn();
defaultDispatcher.dispatch({
action: Action.ViewUserSettings,
initialTabId: UserTab.Notifications,
});
};
public render(): JSX.Element {
let currentUploadedFile = null;
if (this.state.uploadedFile) {
@ -157,6 +185,63 @@ export default class NotificationsSettingsTab extends React.Component<IProps, IS
return (
<div className="mx_SettingsTab">
<div className="mx_SettingsTab_heading">{ _t("Notifications") }</div>
<div className="mx_SettingsTab_section mx_NotificationSettingsTab_notificationsSection">
<StyledRadioGroup
name="roomNotificationSetting"
definitions={[
{
value: RoomNotifState.AllMessages,
className: "mx_NotificationSettingsTab_defaultEntry",
label: <>
{ _t("Default") }
<div className="mx_NotificationSettingsTab_microCopy">
{ _t("Get notifications as set up in your <a>settings</a>", {}, {
a: sub => <AccessibleButton kind="link" onClick={this.onOpenSettingsClick}>
{ sub }
</AccessibleButton>,
}) }
</div>
</>,
}, {
value: RoomNotifState.AllMessagesLoud,
className: "mx_NotificationSettingsTab_allMessagesEntry",
label: <>
{ _t("All messages") }
<div className="mx_NotificationSettingsTab_microCopy">
{ _t("Get notified for every message") }
</div>
</>,
}, {
value: RoomNotifState.MentionsOnly,
className: "mx_NotificationSettingsTab_mentionsKeywordsEntry",
label: <>
{ _t("@mentions & keywords") }
<div className="mx_NotificationSettingsTab_microCopy">
{ _t("Get notified only with mentions and keywords " +
"as set up in your <a>settings</a>", {}, {
a: sub => <AccessibleButton kind="link" onClick={this.onOpenSettingsClick}>
{ sub }
</AccessibleButton>,
}) }
</div>
</>,
}, {
value: RoomNotifState.Mute,
className: "mx_NotificationSettingsTab_noneEntry",
label: <>
{ _t("Off") }
<div className="mx_NotificationSettingsTab_microCopy">
{ _t("You won't get any notifications") }
</div>
</>,
},
]}
onChange={this.onRoomNotificationChange}
value={this.roomProps.notificationVolume}
/>
</div>
<div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
<span className='mx_SettingsTab_subheading'>{ _t("Sounds") }</span>
<div>