imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Styling to match the other tabs a bit closer

Browse source 
Introduces a new component to reduce code duplication
This commit is contained in:
Travis Ralston 2019-01-23 20:13:43 -07:00
parent d267f232bc
commit 06a9ab3a70
4 changed files with 88 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/views/settings/tabs/LabsSettingsTab.js
View file

@ -18,8 +18,8 @@ import React from 'react';
import {_t} from "../../../../languageHandler";
import PropTypes from "prop-types";
import SettingsStore from "../../../../settings/SettingsStore";
import ToggleSwitch from "../../elements/ToggleSwitch";
import MatrixClientPeg from "../../../../MatrixClientPeg";
import LabelledToggleSwitch from "../../elements/LabelledToggleSwitch";
const Modal = require("../../../../Modal");
const sdk = require("../../../../index");
@ -65,15 +65,9 @@ export class LabsSettingToggle extends React.Component {
};
render() {
// This is a minimal version of a SettingsFlag
const label = _t(SettingsStore.getDisplayName(this.props.featureId));
const value = SettingsStore.isFeatureEnabled(this.props.featureId);
return (
<div className="mx_SettingsFlag">
<span className="mx_SettingsFlag_label">{label}</span>
<ToggleSwitch checked={value} onChange={this._onChange} />
</div>
);
return <LabelledToggleSwitch value={value} label={label} onChange={this._onChange} />
}
}

11
src/components/views/settings/tabs/NotificationSettingsTab.js
View file

@ -16,20 +16,11 @@ limitations under the License.
import React from 'react';
import {_t} from "../../../../languageHandler";
import MatrixClientPeg from "../../../../MatrixClientPeg";
const sdk = require("../../../../index");
export default class NotificationSettingsTab extends React.Component {
constructor() {
super();
this.state = {
threepids: [],
};
}
async componentWillMount(): void {
MatrixClientPeg.get().getThreePids().then(r => this.setState({threepids: r.threepids}));
}
render() {
@ -38,7 +29,7 @@ export default class NotificationSettingsTab extends React.Component {
<div className="mx_SettingsTab">
<div className="mx_SettingsTab_heading">{_t("Notifications")}</div>
<div className="mx_SettingsTab_section">
<Notifications threepids={this.state.threepids} />
<Notifications />
</div>
</div>
);