Merge branch 'verified-improvements' into 'develop'

Verification improvements

See merge request soapbox-pub/soapbox-fe!446

app/soapbox/actions/admin.js

@@ -45,6 +45,14 @@ export const ADMIN_LOG_FETCH_REQUEST = 'ADMIN_LOG_FETCH_REQUEST';
 export const ADMIN_LOG_FETCH_SUCCESS = 'ADMIN_LOG_FETCH_SUCCESS';
 export const ADMIN_LOG_FETCH_FAIL    = 'ADMIN_LOG_FETCH_FAIL';
 
+export const ADMIN_USERS_TAG_REQUEST = 'ADMIN_USERS_TAG_REQUEST';
+export const ADMIN_USERS_TAG_SUCCESS = 'ADMIN_USERS_TAG_SUCCESS';
+export const ADMIN_USERS_TAG_FAIL    = 'ADMIN_USERS_TAG_FAIL';
+
+export const ADMIN_USERS_UNTAG_REQUEST = 'ADMIN_USERS_UNTAG_REQUEST';
+export const ADMIN_USERS_UNTAG_SUCCESS = 'ADMIN_USERS_UNTAG_SUCCESS';
+export const ADMIN_USERS_UNTAG_FAIL    = 'ADMIN_USERS_UNTAG_FAIL';
+
 export function fetchConfig() {
   return (dispatch, getState) => {
     dispatch({ type: ADMIN_CONFIG_FETCH_REQUEST });
@@ -197,3 +205,31 @@ export function fetchModerationLog(params) {
       });
   };
 }
+
+export function tagUsers(accountIds, tags) {
+  return (dispatch, getState) => {
+    const nicknames = accountIds.map(id => getState().getIn(['accounts', id, 'acct']));
+    dispatch({ type: ADMIN_USERS_TAG_REQUEST, accountIds, tags });
+    return api(getState)
+      .put('/api/v1/pleroma/admin/users/tag', { nicknames, tags })
+      .then(() => {
+        dispatch({ type: ADMIN_USERS_TAG_SUCCESS, accountIds, tags });
+      }).catch(error => {
+        dispatch({ type: ADMIN_USERS_TAG_FAIL, error, accountIds, tags });
+      });
+  };
+}
+
+export function untagUsers(accountIds, tags) {
+  return (dispatch, getState) => {
+    const nicknames = accountIds.map(id => getState().getIn(['accounts', id, 'acct']));
+    dispatch({ type: ADMIN_USERS_UNTAG_REQUEST, accountIds, tags });
+    return api(getState)
+      .delete('/api/v1/pleroma/admin/users/tag', { data: { nicknames, tags } })
+      .then(() => {
+        dispatch({ type: ADMIN_USERS_UNTAG_SUCCESS, accountIds, tags });
+      }).catch(error => {
+        dispatch({ type: ADMIN_USERS_UNTAG_FAIL, error, accountIds, tags });
+      });
+  };
+}

app/soapbox/actions/soapbox.js

@@ -39,6 +39,7 @@ export const defaultConfig = ImmutableMap({
     homeFooter: ImmutableList(),
   }),
   allowedEmoji: allowedEmoji,
+  verifiedCanEditName: false,
 });
 
 export function getSoapboxConfig(state) {

app/soapbox/features/account/components/header.js

@@ -19,6 +19,7 @@ import ProfileInfoPanel from '../../ui/components/profile_info_panel';
 import { debounce } from 'lodash';
 import StillImage from 'soapbox/components/still_image';
 import ActionButton from 'soapbox/features/ui/components/action_button';
+import { isVerified } from 'soapbox/utils/accounts';
 
 const messages = defineMessages({
   edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
@@ -48,6 +49,8 @@ const messages = defineMessages({
   add_or_remove_from_list: { id: 'account.add_or_remove_from_list', defaultMessage: 'Add or Remove from lists' },
   deactivateUser: { id: 'admin.users.actions.deactivate_user', defaultMessage: 'Deactivate @{name}' },
   deleteUser: { id: 'admin.users.actions.delete_user', defaultMessage: 'Delete @{name}' },
+  verifyUser: { id: 'admin.users.actions.verify_user', defaultMessage: 'Verify @{name}' },
+  unverifyUser: { id: 'admin.users.actions.unverify_user', defaultMessage: 'Unverify @{name}' },
 });
 
 const mapStateToProps = state => {
@@ -168,11 +171,20 @@ class Header extends ImmutablePureComponent {
       }
     }
 
-    if (account.get('id') !== me && isStaff) {
+    if (isStaff) {
       menu.push(null);
       menu.push({ text: intl.formatMessage(messages.admin_account, { name: account.get('username') }), href: `/pleroma/admin/#/users/${account.get('id')}/`, newTab: true });
-      menu.push({ text: intl.formatMessage(messages.deactivateUser, { name: account.get('username') }), action: this.props.onDeactivateUser });
+
-      menu.push({ text: intl.formatMessage(messages.deleteUser, { name: account.get('username') }), action: this.props.onDeleteUser });
+      if (isVerified(account)) {
+        menu.push({ text: intl.formatMessage(messages.unverifyUser, { name: account.get('username') }), action: this.props.onUnverifyUser });
+      } else {
+        menu.push({ text: intl.formatMessage(messages.verifyUser, { name: account.get('username') }), action: this.props.onVerifyUser });
+      }
+
+      if (account.get('id') !== me) {
+        menu.push({ text: intl.formatMessage(messages.deactivateUser, { name: account.get('username') }), action: this.props.onDeactivateUser });
+        menu.push({ text: intl.formatMessage(messages.deleteUser, { name: account.get('username') }), action: this.props.onDeleteUser });
+      }
     }
 
     return menu;

app/soapbox/features/account_timeline/components/header.js

@@ -92,6 +92,14 @@ export default class Header extends ImmutablePureComponent {
     this.props.onDeleteUser(this.props.account);
   }
 
+  handleVerifyUser = () => {
+    this.props.onVerifyUser(this.props.account);
+  }
+
+  handleUnverifyUser = () => {
+    this.props.onUnverifyUser(this.props.account);
+  }
+
   render() {
     const { account, identity_proofs } = this.props;
     const moved = (account) ? account.get('moved') : false;
@@ -117,6 +125,8 @@ export default class Header extends ImmutablePureComponent {
           onAddToList={this.handleAddToList}
           onDeactivateUser={this.handleDeactivateUser}
           onDeleteUser={this.handleDeleteUser}
+          onVerifyUser={this.handleVerifyUser}
+          onUnverifyUser={this.handleUnverifyUser}
           username={this.props.username}
         />
       </div>

app/soapbox/features/account_timeline/containers/header_container.js

@@ -25,12 +25,16 @@ import { getSettings } from 'soapbox/actions/settings';
 import { startChat, openChat } from 'soapbox/actions/chats';
 import { isMobile } from 'soapbox/is_mobile';
 import { deactivateUserModal, deleteUserModal } from 'soapbox/actions/moderation';
+import { tagUsers, untagUsers } from 'soapbox/actions/admin';
+import snackbar from 'soapbox/actions/snackbar';
 
 const messages = defineMessages({
   unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },
   blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' },
   blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
   blockAndReport: { id: 'confirmations.block.block_and_report', defaultMessage: 'Block & Report' },
+  userVerified: { id: 'admin.users.user_verified_message', defaultMessage: '@{acct} was verified' },
+  userUnverified: { id: 'admin.users.user_unverified_message', defaultMessage: '@{acct} was unverified' },
 });
 
 const makeMapStateToProps = () => {
@@ -154,6 +158,20 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   onDeleteUser(account) {
     dispatch(deleteUserModal(intl, account.get('id')));
   },
+
+  onVerifyUser(account) {
+    const message = intl.formatMessage(messages.userVerified, { acct: account.get('acct') });
+    dispatch(tagUsers([account.get('id')], ['verified'])).then(() => {
+      dispatch(snackbar.success(message));
+    }).catch(() => {});
+  },
+
+  onUnverifyUser(account) {
+    const message = intl.formatMessage(messages.userUnverified, { acct: account.get('acct') });
+    dispatch(untagUsers([account.get('id')], ['verified'])).then(() => {
+      dispatch(snackbar.info(message));
+    }).catch(() => {});
+  },
 });
 
 export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Header));

app/soapbox/features/edit_profile/index.js

@@ -21,6 +21,8 @@ import {
 } from 'immutable';
 import { patchMe } from 'soapbox/actions/me';
 import { unescape } from 'lodash';
+import { isVerified } from 'soapbox/utils/accounts';
+import { getSoapboxConfig } from 'soapbox/actions/soapbox';
 
 const messages = defineMessages({
   heading: { id: 'column.edit_profile', defaultMessage: 'Edit profile' },
@@ -31,9 +33,11 @@ const messages = defineMessages({
 
 const mapStateToProps = state => {
   const me = state.get('me');
+  const soapbox = getSoapboxConfig(state);
   return {
     account: state.getIn(['accounts', me]),
     maxFields: state.getIn(['instance', 'pleroma', 'metadata', 'fields_limits', 'max_fields'], 4),
+    verifiedCanEditName: soapbox.get('verifiedCanEditName'),
   };
 };
 
@@ -60,6 +64,7 @@ class EditProfile extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
     account: ImmutablePropTypes.map,
     maxFields: PropTypes.number,
+    verifiedCanEditName: PropTypes.bool,
   };
 
   state = {
@@ -160,8 +165,9 @@ class EditProfile extends ImmutablePureComponent {
   }
 
   render() {
-    const { intl, maxFields, account } = this.props;
+    const { intl, maxFields, account, verifiedCanEditName } = this.props;
-    const verified = account.getIn(['pleroma', 'tags'], ImmutableList()).includes('verified');
+    const verified = isVerified(account);
+    const canEditName = verifiedCanEditName || !verified;
 
     return (
       <Column icon='user' heading={intl.formatMessage(messages.heading)} backBtnSlim>
@@ -169,13 +175,13 @@ class EditProfile extends ImmutablePureComponent {
           <fieldset disabled={this.state.isLoading}>
             <FieldsGroup>
               <TextInput
-                className={verified ? 'disabled' : ''}
+                className={canEditName ? '' : 'disabled'}
                 label={<FormattedMessage id='edit_profile.fields.display_name_label' defaultMessage='Display name' />}
                 name='display_name'
                 value={this.state.display_name}
                 onChange={this.handleTextChange}
-                disabled={verified}
+                disabled={!canEditName}
-                hint={verified && intl.formatMessage(messages.verified)}
+                hint={!canEditName && intl.formatMessage(messages.verified)}
               />
               <SimpleTextarea
                 label={<FormattedMessage id='edit_profile.fields.bio_label' defaultMessage='Bio' />}

app/soapbox/features/soapbox_config/index.js

@@ -12,6 +12,7 @@ import {
   SimpleTextarea,
   FileChooserLogo,
   FormPropTypes,
+  Checkbox,
 } from 'soapbox/features/forms';
 import { Map as ImmutableMap, List as ImmutableList, fromJS } from 'immutable';
 import { updateConfig } from 'soapbox/actions/admin';
@@ -39,6 +40,7 @@ const messages = defineMessages({
   customCssLabel: { id: 'soapbox_config.custom_css.meta_fields.url_placeholder', defaultMessage: 'URL' },
   rawJSONLabel: { id: 'soapbox_config.raw_json_label', defaultMessage: 'Advanced: Edit raw JSON data' },
   rawJSONHint: { id: 'soapbox_config.raw_json_hint', defaultMessage: 'Edit the settings data directly. Changes made directly to the JSON file will override the form fields above. Click "Save" to apply your changes.' },
+  verifiedCanEditNameLabel: { id: 'soapbox_config.verified_can_edit_name_label', defaultMessage: 'Allow verified users to edit their own display name.' },
 });
 
 const listenerOptions = supportsPassiveEvents ? { passive: true } : false;
@@ -232,6 +234,14 @@ class SoapboxConfig extends ImmutablePureComponent {
                 onChange={this.handleChange(['copyright'], (e) => e.target.value)}
               />
             </FieldsGroup>
+            <FieldsGroup>
+              <Checkbox
+                name='verifiedCanEditName'
+                label={intl.formatMessage(messages.verifiedCanEditNameLabel)}
+                checked={soapbox.get('verifiedCanEditName') === true}
+                onChange={this.handleChange(['verifiedCanEditName'], (e) => e.target.checked)}
+              />
+            </FieldsGroup>
             <FieldsGroup>
               <div className='input with_block_label popup'>
                 <label><FormattedMessage id='soapbox_config.fields.promo_panel_fields_label' defaultMessage='Promo panel items' /></label>

app/soapbox/reducers/accounts.js

@@ -6,8 +6,18 @@ import {
 import { CHATS_FETCH_SUCCESS, CHAT_FETCH_SUCCESS } from 'soapbox/actions/chats';
 import { STREAMING_CHAT_UPDATE } from 'soapbox/actions/streaming';
 import { normalizeAccount as normalizeAccount2 } from 'soapbox/actions/importer/normalizer';
-import { Map as ImmutableMap, fromJS } from 'immutable';
+import {
+  Map as ImmutableMap,
+  List as ImmutableList,
+  fromJS,
+} from 'immutable';
 import { normalizePleromaUserFields } from 'soapbox/utils/pleroma';
+import {
+  ADMIN_USERS_TAG_REQUEST,
+  ADMIN_USERS_TAG_FAIL,
+  ADMIN_USERS_UNTAG_REQUEST,
+  ADMIN_USERS_UNTAG_FAIL,
+} from 'soapbox/actions/admin';
 
 const initialState = ImmutableMap();
 
@@ -43,6 +53,26 @@ const importAccountsFromChats = (state, chats) =>
   state.withMutations(mutable =>
     chats.forEach(chat => importAccountFromChat(mutable, chat)));
 
+const addTags = (state, accountIds, tags) => {
+  return state.withMutations(state => {
+    accountIds.forEach(id => {
+      state.updateIn([id, 'pleroma', 'tags'], ImmutableList(), v =>
+        v.toOrderedSet().union(tags).toList(),
+      );
+    });
+  });
+};
+
+const removeTags = (state, accountIds, tags) => {
+  return state.withMutations(state => {
+    accountIds.forEach(id => {
+      state.updateIn([id, 'pleroma', 'tags'], ImmutableList(), v =>
+        v.toOrderedSet().subtract(tags).toList(),
+      );
+    });
+  });
+};
+
 export default function accounts(state = initialState, action) {
   switch(action.type) {
   case ACCOUNT_IMPORT:
@@ -58,6 +88,12 @@ export default function accounts(state = initialState, action) {
   case CHAT_FETCH_SUCCESS:
   case STREAMING_CHAT_UPDATE:
     return importAccountsFromChats(state, [action.chat]);
+  case ADMIN_USERS_TAG_REQUEST:
+  case ADMIN_USERS_UNTAG_FAIL:
+    return addTags(state, action.accountIds, action.tags);
+  case ADMIN_USERS_UNTAG_REQUEST:
+  case ADMIN_USERS_TAG_FAIL:
+    return removeTags(state, action.accountIds, action.tags);
   default:
     return state;
   }

app/soapbox/utils/accounts.js

@@ -45,3 +45,7 @@ export const isLocal = account => {
   let domain = account.get('acct').split('@')[1];
   return domain === undefined ? true : false;
 };
+
+export const isVerified = account => (
+  account.getIn(['pleroma', 'tags'], ImmutableList()).includes('verified')
+);