2017-06-08_509bba0/509bba0_unpacked_with_node_modules/discord_app/components/guild_settings/GuildSettingsModeration.js

/* @flow */

import React from 'react';
import Flux from '../../lib/flux';
import i18n from '../../i18n';

import MFASettings from './MFASettings';
import StreamerModeEnabled from '../StreamerModeEnabled';
import type GuildRecord from '../../records/GuildRecord';

import FormSection from '../../uikit/form/FormSection';
import {Tags as FormTitleTags} from '../../uikit/form/FormTitle';
import FormText, {Types} from '../../uikit/form/FormText';
import FormDivider from '../../uikit/form/FormDivider';
import RadioGroup from '../../uikit/RadioGroup';

import AuthenticationStore from '../../stores/AuthenticationStore';
import StreamerModeStore from '../../stores/StreamerModeStore';
import GuildSettingsStore from '../../stores/GuildSettingsStore';
import GuildStore from '../../stores/GuildStore';
import PermissionStore from '../../stores/PermissionStore';

import GuildSettingsActionCreators from '../../actions/GuildSettingsActionCreators';
import {VerificationLevels, VerificationCriteria, GuildExplicitContentFilterTypes, Permissions} from '../../Constants';
import {Colors} from '../../../discord_common/js/Constants';

type Props = {
  hide: boolean,
  currentUserId: string,
  guild: GuildRecord,
  canManageGuild: boolean,
};

type State = {
  verificationLevel: number,
  explicitContentFilter: number,
};

class GuildSettingsModeration extends React.PureComponent {
  props: Props;
  state: State;

  verificationLevelOptions = [
    {
      name: i18n.Messages.VERIFICATION_LEVEL_NONE,
      desc: i18n.Messages.VERIFICATION_LEVEL_NONE_CRITERIA,
      value: VerificationLevels.NONE,
    },
    {
      name: i18n.Messages.VERIFICATION_LEVEL_LOW,
      desc: i18n.Messages.VERIFICATION_LEVEL_LOW_CRITERIA,
      value: VerificationLevels.LOW,
      color: Colors.STATUS_GREEN,
    },
    {
      name: i18n.Messages.VERIFICATION_LEVEL_MEDIUM,
      desc: i18n.Messages.VERIFICATION_LEVEL_MEDIUM_CRITERIA.format({min: VerificationCriteria.ACCOUNT_AGE}),
      value: VerificationLevels.MEDIUM,
      color: Colors.STATUS_YELLOW,
    },
    {
      name: '(╯°□°）╯︵ ┻━┻',
      desc: i18n.Messages.VERIFICATION_LEVEL_HIGH_CRITERIA.format({min: VerificationCriteria.MEMBER_AGE}),
      value: VerificationLevels.HIGH,
      color: Colors.ORANGE,
    },
    {
      name: '┻━┻ ﾐヽ(ಠ益ಠ)ノ彡┻━┻',
      desc: i18n.Messages.VERIFICATION_LEVEL_VERY_HIGH_CRITERIA,
      value: VerificationLevels.VERY_HIGH,
      color: Colors.STATUS_RED,
    },
  ];

  contentFilterOptions = [
    {
      name: i18n.Messages.EXPLICIT_CONTENT_FILTER_DISABLED,
      desc: i18n.Messages.EXPLICIT_CONTENT_FILTER_DISABLED_DESCRIPTION,
      value: GuildExplicitContentFilterTypes.DISABLED,
    },
    {
      name: i18n.Messages.EXPLICIT_CONTENT_FILTER_MEDIUM,
      desc: i18n.Messages.EXPLICIT_CONTENT_FILTER_MEDIUM_DESCRIPTION,
      value: GuildExplicitContentFilterTypes.MEMBERS_WITHOUT_ROLES,
    },
    {
      name: i18n.Messages.EXPLICIT_CONTENT_FILTER_HIGH,
      desc: i18n.Messages.EXPLICIT_CONTENT_FILTER_HIGH_DESCRIPTION,
      value: GuildExplicitContentFilterTypes.ALL_MEMBERS,
    },
  ];

  constructor(props: Props) {
    super(props);
    (this: any).handleVerificationLevelChange = this.handleVerificationLevelChange.bind(this);
    (this: any).handleExplicitContentFilterChange = this.handleExplicitContentFilterChange.bind(this);
  }

  renderVerificationLevelSection() {
    const {canManageGuild, guild} = this.props;
    return (
      <FormSection title={i18n.Messages.FORM_LABEL_VERIFICATION_LEVEL}>
        <FormText type={Types.DESCRIPTION} className="margin-bottom-20">
          {i18n.Messages.FORM_HELP_VERIFICATION_LEVEL.format()}
        </FormText>
        <RadioGroup
          value={guild.verificationLevel}
          options={this.verificationLevelOptions}
          disabled={!canManageGuild}
          onChange={this.handleVerificationLevelChange}
        />
      </FormSection>
    );
  }

  renderExplicitContentFilter() {
    const {canManageGuild, guild} = this.props;
    return (
      <FormSection title={i18n.Messages.FORM_LABEL_EXPLICIT_CONTENT_FILTER}>
        <FormText type={Types.DESCRIPTION} className="margin-bottom-20">
          {i18n.Messages.FORM_HELP_EXPLICIT_CONTENT_FILTER.format()}
        </FormText>
        <RadioGroup
          value={guild.explicitContentFilter}
          options={this.contentFilterOptions}
          disabled={!canManageGuild}
          onChange={this.handleExplicitContentFilterChange}
        />
      </FormSection>
    );
  }

  render() {
    const {hide, guild, currentUserId} = this.props;

    if (hide) {
      return <StreamerModeEnabled />;
    }

    let showMFASettings = false;
    if (currentUserId === guild.ownerId) {
      showMFASettings = true;
    }

    return (
      <FormSection title={i18n.Messages.MODERATION} tag={FormTitleTags.H2}>
        {this.renderVerificationLevelSection()}
        <FormDivider className="margin-top-40 margin-bottom-40" />
        {this.renderExplicitContentFilter()}
        {showMFASettings && <FormDivider className="margin-top-40 margin-bottom-40" />}
        {showMFASettings && <MFASettings />}
      </FormSection>
    );
  }

  // Handlers
  handleVerificationLevelChange({value: verificationLevel}) {
    GuildSettingsActionCreators.updateGuild({verificationLevel});
  }

  handleExplicitContentFilterChange({value: explicitContentFilter}) {
    GuildSettingsActionCreators.updateGuild({explicitContentFilter});
  }
}

export default Flux.connectStores(
  [GuildSettingsStore, GuildStore, AuthenticationStore, PermissionStore, StreamerModeStore],
  () => {
    const {guild} = GuildSettingsStore.getProps();
    let canManageGuild = false;
    if (guild != null) {
      canManageGuild = PermissionStore.can(Permissions.MANAGE_GUILD, guild);
    }
    return {
      currentUserId: AuthenticationStore.getId(),
      canManageGuild,
      guild,
      hide: StreamerModeStore.enabled,
    };
  }
)(GuildSettingsModeration);



// WEBPACK FOOTER //
// ./discord_app/components/guild_settings/GuildSettingsModeration.js