249 lines
8.3 KiB
JavaScript
Executable file
249 lines
8.3 KiB
JavaScript
Executable file
import React from 'react';
|
|
import Flux from '../../lib/flux';
|
|
import i18n from '../../i18n';
|
|
import UserSettingsStore from '../../stores/UserSettingsStore';
|
|
import GuildStore from '../../stores/GuildStore';
|
|
import FormSection from '../../uikit/form/FormSection';
|
|
import SwitchItem from '../../uikit/SwitchItem';
|
|
import UserSettingsActionCreators from '../../actions/UserSettingsActionCreators';
|
|
import ModalActionCreators from '../../actions/ModalActionCreators';
|
|
import FormTitle, {Tags} from '../../uikit/form/FormTitle';
|
|
import RadioGroup from '../../uikit/RadioGroup';
|
|
import FormText, {Types} from '../../uikit/form/FormText';
|
|
import ConfirmModal from '../ConfirmModal';
|
|
// import FormDivider from '../../uikit/form/FormDivider';
|
|
import {ExplicitContentFilterTypes} from '../../Constants';
|
|
import {Colors} from '../../../discord_common/js/Constants';
|
|
|
|
import type {FriendSourceFlags} from '../../flow/Server';
|
|
|
|
const FriendSourceFlagKeys = {
|
|
ALL: 'all',
|
|
FRIENDS: 'mutual_friends',
|
|
GUILDS: 'mutual_guilds',
|
|
};
|
|
|
|
class UserSettingsPrivacySafety extends React.PureComponent {
|
|
constructor(props) {
|
|
super(props);
|
|
(this: any).handleChangeDefaultGuildsRestricted = this.handleChangeDefaultGuildsRestricted.bind(this);
|
|
const {defaultGuildsRestricted} = props;
|
|
this.state = {defaultGuildsRestricted};
|
|
}
|
|
|
|
componentWillReceiveProps({defaultGuildsRestricted}) {
|
|
if (defaultGuildsRestricted !== this.props.defaultGuildsRestricted) {
|
|
this.setState({defaultGuildsRestricted});
|
|
}
|
|
}
|
|
|
|
hasPermittedSourceFlag(sourceFlag: string) {
|
|
const {friendSourceFlags} = this.props;
|
|
const has = flag => friendSourceFlags[flag] === true;
|
|
|
|
return has(FriendSourceFlagKeys.ALL) ? true : has(sourceFlag);
|
|
}
|
|
|
|
onFieldChange(type: string, checked: boolean) {
|
|
const {friendSourceFlags} = this.props;
|
|
|
|
let newFlags;
|
|
|
|
if (type === FriendSourceFlagKeys.ALL) {
|
|
if (checked) {
|
|
newFlags = {
|
|
[FriendSourceFlagKeys.ALL]: true,
|
|
[FriendSourceFlagKeys.FRIENDS]: true,
|
|
[FriendSourceFlagKeys.GUILDS]: true,
|
|
};
|
|
} else {
|
|
newFlags = {
|
|
[FriendSourceFlagKeys.ALL]: false,
|
|
[FriendSourceFlagKeys.FRIENDS]: true,
|
|
[FriendSourceFlagKeys.GUILDS]: true,
|
|
};
|
|
}
|
|
} else if (checked) {
|
|
// If all are on, turn all on too
|
|
let turnAllOn = false;
|
|
switch (type) {
|
|
case FriendSourceFlagKeys.FRIENDS:
|
|
turnAllOn = friendSourceFlags[FriendSourceFlagKeys.GUILDS] === true;
|
|
break;
|
|
default:
|
|
turnAllOn = friendSourceFlags[FriendSourceFlagKeys.FRIENDS] === true;
|
|
break;
|
|
}
|
|
|
|
newFlags = {
|
|
...friendSourceFlags,
|
|
[FriendSourceFlagKeys.ALL]: turnAllOn,
|
|
[type]: true,
|
|
};
|
|
} else {
|
|
newFlags = {
|
|
...friendSourceFlags,
|
|
[FriendSourceFlagKeys.ALL]: false,
|
|
[type]: false,
|
|
};
|
|
}
|
|
|
|
this.updatePermittedFriendSourceFlags(newFlags);
|
|
}
|
|
|
|
updatePermittedFriendSourceFlags(friendSourceFlags: FriendSourceFlags) {
|
|
UserSettingsActionCreators.updateRemoteSettings({friendSourceFlags});
|
|
}
|
|
|
|
handleExplicitContentFilterChange({value}) {
|
|
UserSettingsActionCreators.updateRemoteSettings({explicitContentFilter: value});
|
|
}
|
|
|
|
handleChangeDefaultGuildsRestricted({target: {checked: defaultGuildsRestricted}}) {
|
|
defaultGuildsRestricted = !defaultGuildsRestricted;
|
|
this.setState({defaultGuildsRestricted}, () => this.showGuildRestrictionModal(defaultGuildsRestricted));
|
|
}
|
|
|
|
showGuildRestrictionModal(defaultGuildsRestricted) {
|
|
ModalActionCreators.push(props => {
|
|
return (
|
|
<ConfirmModal
|
|
header={i18n.Messages.USER_DM_SETTINGS}
|
|
confirmText={i18n.Messages.YES_TEXT}
|
|
cancelText={i18n.Messages.NO_TEXT}
|
|
onConfirm={() => {
|
|
UserSettingsActionCreators.updateRemoteSettings({
|
|
defaultGuildsRestricted,
|
|
restrictedGuilds: defaultGuildsRestricted ? Object.keys(GuildStore.getGuilds()) : [],
|
|
});
|
|
}}
|
|
onCancel={() => {
|
|
UserSettingsActionCreators.updateRemoteSettings({defaultGuildsRestricted});
|
|
}}
|
|
{...props}>
|
|
<p>{i18n.Messages.USER_DM_SETTINGS_QUESTION}</p>
|
|
</ConfirmModal>
|
|
);
|
|
});
|
|
}
|
|
|
|
renderFriendSettings() {
|
|
const hasAll = this.hasPermittedSourceFlag(FriendSourceFlagKeys.ALL);
|
|
|
|
return (
|
|
<FormSection title={i18n.Messages.FRIEND_PERMITTED_SOURCE}>
|
|
<SwitchItem
|
|
className="margin-top-8 margin-bottom-20"
|
|
value={hasAll}
|
|
onChange={event => this.onFieldChange(FriendSourceFlagKeys.ALL, event.target.checked)}>
|
|
{i18n.Messages.FRIEND_PERMITTED_SOURCE_ALL}
|
|
</SwitchItem>
|
|
<SwitchItem
|
|
value={this.hasPermittedSourceFlag(FriendSourceFlagKeys.FRIENDS)}
|
|
onChange={event => this.onFieldChange(FriendSourceFlagKeys.FRIENDS, event.target.checked)}>
|
|
{i18n.Messages.FRIEND_PERMITTED_SOURCE_MUTUAL_FRIENDS}
|
|
</SwitchItem>
|
|
<SwitchItem
|
|
className="margin-reset"
|
|
value={this.hasPermittedSourceFlag(FriendSourceFlagKeys.GUILDS)}
|
|
onChange={event => this.onFieldChange(FriendSourceFlagKeys.GUILDS, event.target.checked)}>
|
|
{i18n.Messages.FRIEND_PERMITTED_SOURCE_MUTUAL_GUILDS}
|
|
</SwitchItem>
|
|
</FormSection>
|
|
);
|
|
}
|
|
|
|
renderDMSafety() {
|
|
const options = [
|
|
{
|
|
name: i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_FRIENDS_AND_NON_FRIENDS,
|
|
desc: i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_FRIENDS_AND_NON_FRIENDS_HELP,
|
|
value: ExplicitContentFilterTypes.FRIENDS_AND_NON_FRIENDS,
|
|
color: Colors.STATUS_GREEN,
|
|
},
|
|
{
|
|
name: i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_NON_FRIENDS,
|
|
desc: i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_NON_FRIENDS_HELP,
|
|
value: ExplicitContentFilterTypes.NON_FRIENDS,
|
|
color: Colors.STATUS_YELLOW,
|
|
},
|
|
{
|
|
name: i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_DISABLED,
|
|
desc: i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_DISABLED_HELP,
|
|
value: ExplicitContentFilterTypes.DISABLED,
|
|
color: Colors.STATUS_RED,
|
|
},
|
|
];
|
|
return (
|
|
<FormSection className="margin-bottom-40">
|
|
<FormTitle tag={Tags.H5} className="margin-bottom-4">
|
|
{i18n.Messages.USER_EXPLICIT_CONTENT_FILTER}
|
|
</FormTitle>
|
|
<FormText type={Types.DESCRIPTION} className="margin-bottom-8">
|
|
{i18n.Messages.USER_EXPLICIT_CONTENT_FILTER_HELP}
|
|
</FormText>
|
|
<RadioGroup
|
|
value={this.props.explicitContentFilter}
|
|
options={options}
|
|
onChange={this.handleExplicitContentFilterChange}
|
|
/>
|
|
</FormSection>
|
|
);
|
|
}
|
|
|
|
renderServerPrivacy() {
|
|
return (
|
|
<FormSection className="margin-bottom-40">
|
|
<FormTitle tag={Tags.H5} className="margin-bottom-8">
|
|
{i18n.Messages.USER_DM_SETTINGS}
|
|
</FormTitle>
|
|
<SwitchItem
|
|
className="margin-reset"
|
|
value={!this.state.defaultGuildsRestricted}
|
|
note={i18n.Messages.USER_DM_SETTINGS_HELP}
|
|
onChange={this.handleChangeDefaultGuildsRestricted}>
|
|
{i18n.Messages.NEW_GUILDS_DM_ALLOWED}
|
|
</SwitchItem>
|
|
</FormSection>
|
|
);
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<FormSection tag={Tags.H2} title={i18n.Messages.PRIVACY_AND_SAFETY}>
|
|
{this.renderDMSafety()}
|
|
{this.renderServerPrivacy()}
|
|
{this.renderFriendSettings()}
|
|
</FormSection>
|
|
);
|
|
}
|
|
}
|
|
|
|
function computeFlags() {
|
|
const storedFlags = UserSettingsStore.friendSourceFlags;
|
|
|
|
if (storedFlags[FriendSourceFlagKeys.ALL]) {
|
|
return {
|
|
[FriendSourceFlagKeys.ALL]: true,
|
|
[FriendSourceFlagKeys.FRIENDS]: true,
|
|
[FriendSourceFlagKeys.GUILDS]: true,
|
|
};
|
|
}
|
|
|
|
return {
|
|
[FriendSourceFlagKeys.ALL]: false,
|
|
[FriendSourceFlagKeys.FRIENDS]: !!storedFlags[FriendSourceFlagKeys.FRIENDS],
|
|
[FriendSourceFlagKeys.GUILDS]: !!storedFlags[FriendSourceFlagKeys.GUILDS],
|
|
};
|
|
}
|
|
|
|
export default Flux.connectStores([UserSettingsStore], () => ({
|
|
friendSourceFlags: computeFlags(),
|
|
explicitContentFilter: UserSettingsStore.explicitContentFilter,
|
|
defaultGuildsRestricted: UserSettingsStore.defaultGuildsRestricted,
|
|
}))(UserSettingsPrivacySafety);
|
|
|
|
|
|
|
|
// WEBPACK FOOTER //
|
|
// ./discord_app/components/user_settings/UserSettingsPrivacySafety.js
|