Merge branch 'awaiting-approval-modals' into 'develop'

Admin: Make account approval buttons larger, require confirmation when deleting users

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

app/soapbox/actions/moderation.js

@@ -17,6 +17,8 @@ const messages = defineMessages({
   userDeleted: { id: 'admin.users.user_deleted_message', defaultMessage: '@{acct} was deleted' },
   deleteStatusPrompt: { id: 'confirmations.admin.delete_status.message', defaultMessage: 'You are about to delete a post by @{acct}. This action cannot be undone.' },
   deleteStatusConfirm: { id: 'confirmations.admin.delete_status.confirm', defaultMessage: 'Delete post' },
+  rejectUserPrompt: { id: 'confirmations.admin.reject_user.message', defaultMessage: 'You are about to reject @{acct} registration request. This action cannot be undone.' },
+  rejectUserConfirm: { id: 'confirmations.admin.reject_user.confirm', defaultMessage: 'Reject @{name}' },
   statusDeleted: { id: 'admin.statuses.status_deleted_message', defaultMessage: 'Post by @{acct} was deleted' },
   markStatusSensitivePrompt: { id: 'confirmations.admin.mark_status_sensitive.message', defaultMessage: 'You are about to mark a post by @{acct} sensitive.' },
   markStatusNotSensitivePrompt: { id: 'confirmations.admin.mark_status_not_sensitive.message', defaultMessage: 'You are about to mark a post by @{acct} not sensitive.' },
@@ -85,6 +87,26 @@ export function deleteUserModal(intl, accountId, afterConfirm = () => {}) {
   };
 }
 
+export function rejectUserModal(intl, accountId, afterConfirm = () => {}) {
+  return function(dispatch, getState) {
+    const state = getState();
+    const acct = state.getIn(['accounts', accountId, 'acct']);
+    const name = state.getIn(['accounts', accountId, 'username']);
+
+    dispatch(openModal('CONFIRM', {
+      message: intl.formatMessage(messages.rejectUserPrompt, { acct }),
+      confirm: intl.formatMessage(messages.rejectUserConfirm, { name }),
+      onConfirm: () => {
+        dispatch(deleteUsers([accountId]))
+          .then(() => {
+            afterConfirm();
+          })
+          .catch(() => {});
+      },
+    }));
+  };
+}
+
 export function toggleStatusSensitivityModal(intl, statusId, sensitive, afterConfirm = () => {}) {
   return function(dispatch, getState) {
     const state = getState();

app/soapbox/features/admin/components/unapproved_account.js

@@ -5,9 +5,10 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import IconButton from 'soapbox/components/icon_button';
-import { deleteUsers, approveUsers } from 'soapbox/actions/admin';
+import { approveUsers } from 'soapbox/actions/admin';
 import { makeGetAccount } from 'soapbox/selectors';
 import snackbar from 'soapbox/actions/snackbar';
+import { rejectUserModal } from '../../../actions/admin';
 
 const messages = defineMessages({
   approved: { id: 'admin.awaiting_approval.approved_message', defaultMessage: '{acct} was approved!' },
@@ -37,7 +38,6 @@ class UnapprovedAccount extends ImmutablePureComponent {
 
   handleApprove = () => {
     const { dispatch, intl, account } = this.props;
-
     dispatch(approveUsers([account.get('id')]))
       .then(() => {
         const message = intl.formatMessage(messages.approved, { acct: `@${account.get('acct')}` });
@@ -49,12 +49,10 @@ class UnapprovedAccount extends ImmutablePureComponent {
   handleReject = () => {
     const { dispatch, intl, account } = this.props;
 
-    dispatch(deleteUsers([account.get('id')]))
-      .then(() => {
-        const message = intl.formatMessage(messages.rejected, { acct: `@${account.get('acct')}` });
-        dispatch(snackbar.info(message));
-      })
-      .catch(() => {});
+    dispatch(rejectUserModal(intl, account.get('id'), () => {
+      const message = intl.formatMessage(messages.rejected, { acct: `@${account.get('acct')}` });
+      dispatch(snackbar.info(message));
+    }));
   }
 
   render() {

app/soapbox/locales/pl.json

@@ -270,6 +270,8 @@
   "confirmations.admin.mark_status_not_sensitive.message": "Zamierzasz oznaczyć wpis {acct} jako niewrażliwy.",
   "confirmations.admin.mark_status_sensitive.confirm": "Oznacz wpis jako wrażliwy",
   "confirmations.admin.mark_status_sensitive.message": "Zamierzasz oznaczyć wpis {acct} jako wrażliwy.",
+  "confirmations.admin.reject_user.confirm": "Odrzuć @{name}",
+  "confirmations.admin.reject_user.message": "Zamierzasz odrzucić prośbę o rejestrację @{acct}. To działanie nie może zostać cofnięte.",
   "confirmations.block.block_and_report": "Zablokuj i zgłoś",
   "confirmations.block.confirm": "Zablokuj",
   "confirmations.block.message": "Czy na pewno chcesz zablokować {name}?",

app/styles/components/admin.scss

@@ -102,10 +102,12 @@
     margin-left: auto;
     display: flex;
     flex-wrap: nowrap;
+    column-gap: 10px;
     padding-left: 20px;
 
-    button.icon-button:nth-child(n+2) {
-      padding-left: 10px;
+    .svg-icon {
+      height: 24px;
+      width: 24px;
     }
   }
 }