qbism/qb-admin-fe
1
0
Fork 0
forked from AkkomaGang/admin-fe
Code Issues Pull requests Projects Releases Packages Wiki Activity

Admin manage pending accounts

Browse source
This commit is contained in:
MK Fain 2020-08-05 22:53:23 +00:00 committed by Angelina Filippova
parent 39ef13ff7c
commit ea8374adb7
12 changed files with 200 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/api/__mocks__/users.js
View file

@ -1,7 +1,8 @@
export let users = [
{ active: true, deactivated: false, id: '2', nickname: 'allis', local: true, external: false, roles: { admin: true, moderator: false }, tags: [] },
{ active: true, deactivated: false, id: '10', nickname: 'bob', local: false, external: true, roles: { admin: false, moderator: false }, tags: ['mrf_tag:sandbox'] },
{ active: false, deactivated: true, id: 'abc', nickname: 'john', local: true, external: false, roles: { admin: false, moderator: false }, tags: ['mrf_tag:media-strip'] }
{ active: true, approval_pending: false, deactivated: false, id: '2', nickname: 'allis', local: true, external: false, roles: { admin: true, moderator: false }, tags: [] },
{ active: true, approval_pending: false, deactivated: false, id: '10', nickname: 'bob', local: false, external: true, roles: { admin: false, moderator: false }, tags: ['mrf_tag:sandbox'] },
{ active: false, approval_pending: false, deactivated: true, id: 'abc', nickname: 'john', local: true, external: false, roles: { admin: false, moderator: false }, tags: ['mrf_tag:media-strip'] },
{ active: true, approval_pending: true, deactivated: false, id: '100', nickname: 'sally', local: true, external: false, roles: { admin: false, moderator: false }, tags: [] }
]
const userProfile = { avatar: 'avatar.jpg', nickname: 'allis', id: '2', tags: [], roles: { admin: true, moderator: false }, local: true, external: false }
@ -85,6 +86,14 @@ export async function deactivateUsers(nicknames, authHost, token) {
return Promise.resolve({ data: response })
}
export async function approveUserAccount(nicknames, authHost, token) {
const response = nicknames.map(nickname => {
const currentUser = users.find(user => user.nickname === nickname)
return { ...currentUser, approval_pending: false }
})
return Promise.resolve({ data: response })
}
export async function deleteRight(nickname, right, authHost, token) {
return Promise.resolve({ data:
{ [`is_${right}`]: false }

10
src/api/users.js
View file

@ -166,6 +166,16 @@ export async function fetchUserStatuses(id, authHost, godmode, token) {
})
}
export async function approveUserAccount(nicknames, authHost, token) {
return await request({
baseURL: baseName(authHost),
url: '/api/pleroma/admin/users/approve',
method: 'patch',
headers: authHeaders(token),
data: { nicknames }
})
}
export async function confirmUserEmail(nicknames, authHost, token) {
return await request({
baseURL: baseName(authHost),

11
src/lang/en.js
View file

@ -191,6 +191,7 @@ export default {
external: 'External',
deactivated: 'Deactivated',
active: 'Active',
unapproved: 'Pending',
unconfirmed: 'Unconfirmed',
actions: 'Actions',
activate: 'Activate',
@ -233,6 +234,8 @@ export default {
addTagForMultipleUsersConfirmation: 'Are you sure you want to apply tag to all selected users?',
removeTagFromMultipleUsersConfirmation: 'Are you sure you want to remove tag from all selected users?',
requirePasswordResetConfirmation: 'Are you sure you want to require password reset for all selected users?',
approveAccountsConfirmation: 'Are you sure you want to approve accounts for all selected users?',
rejectAccountsConfirmation: 'Are you sure you want to reject accounts for all selected users?',
confirmAccountsConfirmation: 'Are you sure you want to confirm emails for all selected users?',
resendEmailConfirmation: 'Are you sure you want to resend confirmation email for all selected users?',
mailerMustBeEnabled: 'To require user\'s password reset you must enable mailer.',
@ -253,9 +256,14 @@ export default {
getPasswordResetToken: 'Get password reset token',
passwordResetTokenCreated: 'Password reset token was created',
accountCreated: 'New account was created!',
approveAccount: 'Approve account',
approveAccounts: 'Approve accounts',
unapprovedAccount: 'User account is pending approval',
unconfirmedEmail: 'User didn\'t confirm the email',
confirmAccount: 'Confirm account',
confirmAccounts: 'Confirm accounts',
rejectAccount: 'Reject account',
rejectAccounts: 'Reject accounts',
resendConfirmation: 'Resend confirmation email',
invalidAccount: 'This account has invalid nickname and can\'t be modified',
invalidNickname: 'invalid nickname',
@ -287,7 +295,9 @@ export default {
roles: 'Roles',
active: 'Active',
status: 'Status',
reason: 'Registration Reason',
deactivated: 'Deactivated',
pending: 'Pending',
noStatuses: 'No statuses to show',
openAccountInInstance: 'Open account in instance',
securitySettings: {
@ -313,6 +323,7 @@ export default {
external: 'External',
byStatus: 'By status',
active: 'Active',
pending: 'Pending',
deactivated: 'Deactivated'
},
reports: {

14
src/store/modules/users.js
View file

@ -14,6 +14,7 @@ import {
tagUser,
untagUser,
forcePasswordReset,
approveUserAccount,
confirmUserEmail,
resendConfirmationEmail
} from '@/api/users'
@ -30,6 +31,7 @@ const users = {
local: false,
external: false,
active: false,
needApproval: false,
deactivated: false
},
passwordResetToken: {
@ -126,7 +128,7 @@ const users = {
},
ClearUsersState({ commit }) {
commit('SET_SEARCH_QUERY', '')
commit('SET_USERS_FILTERS', { local: false, external: false, active: false, deactivated: false })
commit('SET_USERS_FILTERS', { local: false, external: false, active: false, needApproval: false, deactivated: false })
},
async ClearFilters({ commit, dispatch, state }) {
commit('CLEAR_USERS_FILTERS')
@ -159,6 +161,15 @@ const users = {
}
dispatch('SuccessMessage')
},
async ApproveUsersAccount({ dispatch, getters }, { users, _userId, _statusId }) {
const updatedUsers = users.map(user => {
return { ...user, approval_pending: false }
})
const nicknames = users.map(user => user.nickname)
const callApiFn = async() => await approveUserAccount(nicknames, getters.authHost, getters.token)
dispatch('ApplyChanges', { updatedUsers, callApiFn, userId: _userId, statusId: _statusId })
},
async ConfirmUsersEmail({ dispatch, getters }, { users, _userId, _statusId }) {
const updatedUsers = users.map(user => {
return { ...user, confirmation_pending: false }
@ -260,6 +271,7 @@ const users = {
local: false,
external: false,
active: false,
needApproval: false,
deactivated: false
}
const currentFilters = { ...defaultFilters, ...filters }

30
src/views/users/components/ModerationDropdown.vue
View file

@ -37,6 +37,17 @@
@click.native="handleDeletion(user)">
{{ $t('users.deleteAccount') }}
</el-dropdown-item>
<el-dropdown-item
v-if="user.local && user.approval_pending"
divided
@click.native="handleAccountApproval(user)">
{{ $t('users.approveAccount') }}
</el-dropdown-item>
<el-dropdown-item
v-if="user.local && user.approval_pending"
@click.native="handleAccountRejection(user)">
{{ $t('users.rejectAccount') }}
</el-dropdown-item>
<el-dropdown-item
v-if="user.local && user.confirmation_pending"
divided
@ -158,6 +169,25 @@ export default {
})
})
},
handleAccountApproval(user) {
this.$store.dispatch('ApproveUsersAccount', { users: [user], _userId: user.id, _statusId: this.statusId })
},
handleAccountRejection(user) {
this.$confirm(
this.$t('users.deleteUsersConfirmation'),
{
confirmButtonText: 'Delete',
cancelButtonText: 'Cancel',
type: 'warning'
}).then(() => {
this.$store.dispatch('DeleteUsers', { users: [user], _userId: user.id })
}).catch(() => {
this.$message({
type: 'info',
message: 'Delete canceled'
})
})
},
handleEmailConfirmation(user) {
this.$store.dispatch('ConfirmUsersEmail', { users: [user], _userId: user.id, _statusId: this.statusId })
},

29
src/views/users/components/MultipleUsersMenu.vue
View file

@ -26,6 +26,15 @@
@click.native="revokeRightFromMultipleUsers('moderator')">
{{ $t('users.revokeModerator') }}
</el-dropdown-item>
<el-dropdown-item
divided
@click.native="approveAccountsForMultipleUsers">
{{ $t('users.approveAccounts') }}
</el-dropdown-item>
<el-dropdown-item
@click.native="rejectAccountsForMultipleUsers">
{{ $t('users.rejectAccounts') }}
</el-dropdown-item>
<el-dropdown-item
divided
@click.native="confirmAccountsForMultipleUsers">
@ -219,6 +228,12 @@ export default {
applyAction(filtered, requirePasswordResetFn)
},
approveAccounts: () => {
const filtered = this.selectedUsers.filter(user => this.isLocalUser(user) && user.approval_pending)
const approveAccountFn = async(users) => await this.$store.dispatch('ApproveUsersAccount', { users })
applyAction(filtered, approveAccountFn)
},
confirmAccounts: () => {
const filtered = this.selectedUsers.filter(user => this.isLocalUser(user) && user.confirmation_pending)
const confirmAccountFn = async(users) => await this.$store.dispatch('ConfirmUsersEmail', { users })
@ -300,6 +315,20 @@ export default {
removeTag(tag)
)
},
approveAccountsForMultipleUsers() {
const { approveAccounts } = this.mappers()
this.confirmMessage(
this.$t('users.approveAccountsConfirmation'),
approveAccounts
)
},
rejectAccountsForMultipleUsers() {
const { remove } = this.mappers()
this.confirmMessage(
this.$t('users.deleteMultipleUsersConfirmation'),
remove
)
},
confirmAccountsForMultipleUsers() {
const { confirmAccounts } = this.mappers()
this.confirmMessage(

9
src/views/users/components/UsersFilter.vue
View file

@ -7,12 +7,13 @@
class="select-field"
@change="toggleFilters">
<el-option-group :label="$t('usersFilter.byAccountType')">
<el-option value="local">{{ $t('usersFilter.local') }}</el-option>
<el-option value="external">{{ $t('usersFilter.external') }}</el-option>
<el-option value="local" label="Local">{{ $t('usersFilter.local') }}</el-option>
<el-option value="external" label="External">{{ $t('usersFilter.external') }}</el-option>
</el-option-group>
<el-option-group :label="$t('usersFilter.byStatus')">
<el-option value="active">{{ $t('usersFilter.active') }}</el-option>
<el-option value="deactivated">{{ $t('usersFilter.deactivated') }}</el-option>
<el-option value="active" label="Active">{{ $t('usersFilter.active') }}</el-option>
<el-option value="needApproval" label="Need Approval">{{ $t('usersFilter.pending') }}</el-option>
<el-option value="deactivated" label="Deactivated">{{ $t('usersFilter.deactivated') }}</el-option>
</el-option-group>
</el-select>
</template>

24
src/views/users/index.vue
View file

@ -71,7 +71,16 @@
{{ isDesktop ? $t('users.unconfirmed') : getFirstLetter($t('users.unconfirmed')) }}
</el-tag>
</el-tooltip>
<el-tooltip :content="$t('users.unapprovedAccount')" effect="dark">
<el-tag v-if="scope.row.approval_pending" type="info">
{{ isDesktop ? $t('users.unapproved') : getFirstLetter($t('users.unapproved')) }}
</el-tag>
</el-tooltip>
<div v-if="pendingView && isDesktop" class="reason-text">
"{{ scope.row.registration_reason | truncate(100, '...') }}"
</div>
</template>
</el-table-column>
<el-table-column :label="$t('users.actions')" fixed="right">
<template slot-scope="scope">
@ -123,6 +132,15 @@ export default {
ResetPasswordDialog,
UsersFilter
},
filters: {
truncate: function(text, length, suffix) {
if (text.length > length) {
return text.substring(0, length) + suffix
} else {
return text
}
}
},
data() {
return {
search: '',
@ -156,6 +174,9 @@ export default {
usersCount() {
return this.$store.state.users.totalUsersCount
},
pendingView() {
return this.$store.state.users.filters['needApproval']
},
width() {
return this.isMobile ? 55 : false
}
@ -298,6 +319,9 @@ export default {
color: gray;
font-size: 28px;
}
.reason-text {
word-break: normal;
}
}
@media only screen and (max-width:480px) {

13
src/views/users/show.vue
View file

@ -79,12 +79,17 @@
<tr class="el-table__row">
<td>{{ $t('userProfile.status') }}</td>
<td>
<el-tag v-if="!user.deactivated" type="success">{{ $t('userProfile.active') }}</el-tag>
<el-tag v-if="user.approval_pending" type="info">{{ $t('userProfile.pending') }}</el-tag>
<el-tag v-if="!user.deactivated & !user.approval_pending" type="success">{{ $t('userProfile.active') }}</el-tag>
<el-tag v-if="user.deactivated" type="danger">{{ $t('userProfile.deactivated') }}</el-tag>
</td>
</tr>
</tbody>
</table>
<div v-if="user.registration_reason">
<div class="reason-label">{{ $t('userProfile.reason') }}</div>
"{{ user.registration_reason }}"
</div>
</div>
<el-button v-if="propertyExists(user, 'nickname')" icon="el-icon-lock" class="security-setting-button" @click="securitySettingsModalVisible = true">
{{ $t('userProfile.securitySettings.securitySettings') }}
@ -304,6 +309,7 @@ table {
.user-profile-card {
margin: 0 20px;
width: 30%;
min-width: 300px;
height: fit-content;
}
.user-profile-container {
@ -316,6 +322,11 @@ table {
.user-profile-tag {
margin: 0 4px 4px 0;
}
.reason-label {
color: #878d99;
font-weight: bold;
margin: 5px 0;
}
@media only screen and (max-width:480px) {
.avatar-name-container {

10
test/views/users/index.test.js
View file

@ -34,7 +34,7 @@ describe('Search and filter users', () => {
})
await flushPromises()
expect(wrapper.vm.usersCount).toEqual(3)
expect(wrapper.vm.usersCount).toEqual(4)
done()
})
@ -51,7 +51,7 @@ describe('Search and filter users', () => {
}
await flushPromises()
expect(wrapper.vm.usersCount).toEqual(3)
expect(wrapper.vm.usersCount).toEqual(4)
const input = wrapper.find('.search input.el-input__inner')
input.element.value = 'bob'
input.trigger('input')
@ -61,7 +61,7 @@ describe('Search and filter users', () => {
input.element.value = ''
input.trigger('input')
await flushPromises()
expect(wrapper.vm.usersCount).toEqual(3)
expect(wrapper.vm.usersCount).toEqual(4)
done()
})
@ -304,7 +304,7 @@ describe('Creates new account', () => {
stubs: ['router-link']
})
await flushPromises()
expect(wrapper.vm.usersCount).toEqual(3)
expect(wrapper.vm.usersCount).toEqual(4)
const openDialogButton = wrapper.find('button.actions-button')
openDialogButton.trigger('click')
@ -326,7 +326,7 @@ describe('Creates new account', () => {
createButton.trigger('click')
await flushPromises()
expect(wrapper.vm.usersCount).toEqual(4)
expect(wrapper.vm.usersCount).toEqual(5)
done()
})

51
test/views/users/multipleUsersMenu.test.js
View file

@ -163,7 +163,7 @@ describe('Apply users actions to multiple users', () => {
const activateMultipleUsersStub = jest.fn()
wrapper.setMethods({ activateMultipleUsers: activateMultipleUsersStub })
wrapper.find(`.el-dropdown-menu__item:nth-child(7)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(9)`).trigger('click')
expect(wrapper.vm.activateMultipleUsers).toHaveBeenCalled()
const activate = wrapper.vm.mappers().activate
@ -190,7 +190,7 @@ describe('Apply users actions to multiple users', () => {
const deactivateMultipleUsersStub = jest.fn()
wrapper.setMethods({ deactivateMultipleUsers: deactivateMultipleUsersStub })
wrapper.find(`.el-dropdown-menu__item:nth-child(8)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(10)`).trigger('click')
expect(wrapper.vm.deactivateMultipleUsers).toHaveBeenCalled()
const deactivate = wrapper.vm.mappers().deactivate
@ -221,7 +221,7 @@ describe('Apply users actions to multiple users', () => {
const deleteMultipleUsersStub = jest.fn()
wrapper.setMethods({ deleteMultipleUsers: deleteMultipleUsersStub })
wrapper.find(`.el-dropdown-menu__item:nth-child(9)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(11)`).trigger('click')
expect(wrapper.vm.deleteMultipleUsers).toHaveBeenCalled()
const remove = wrapper.vm.mappers().remove
@ -229,7 +229,7 @@ describe('Apply users actions to multiple users', () => {
remove()
await flushPromises()
expect(store.state.users.fetchedUsers.length).toEqual(3)
expect(store.state.users.fetchedUsers.length).toEqual(4)
done()
})
@ -247,15 +247,15 @@ describe('Apply users actions to multiple users', () => {
const addTagForMultipleUsersStub = jest.fn()
wrapper.setMethods({ addTagForMultipleUsers: addTagForMultipleUsersStub })
wrapper.find(`.el-dropdown-menu__item:nth-child(11) button:nth-child(1)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(13) button:nth-child(1)`).trigger('click')
expect(wrapper.vm.addTagForMultipleUsers).toHaveBeenCalled()
expect(wrapper.vm.addTagForMultipleUsers).toHaveBeenCalledWith('mrf_tag:media-force-nsfw')
wrapper.find(`.el-dropdown-menu__item:nth-child(13) button:nth-child(1)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(15) button:nth-child(1)`).trigger('click')
expect(wrapper.vm.addTagForMultipleUsers).toHaveBeenCalled()
expect(wrapper.vm.addTagForMultipleUsers).toHaveBeenCalledWith('mrf_tag:force-unlisted')
wrapper.find(`.el-dropdown-menu__item:nth-child(15 ) button:nth-child(1)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(17) button:nth-child(1)`).trigger('click')
expect(wrapper.vm.addTagForMultipleUsers).toHaveBeenCalled()
expect(wrapper.vm.addTagForMultipleUsers).toHaveBeenCalledWith('mrf_tag:disable-remote-subscription')
@ -287,15 +287,15 @@ describe('Apply users actions to multiple users', () => {
const removeTagFromMultipleUsersStub = jest.fn()
wrapper.setMethods({ removeTagFromMultipleUsers: removeTagFromMultipleUsersStub })
wrapper.find(`.el-dropdown-menu__item:nth-child(12) button:nth-child(2)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(14) button:nth-child(2)`).trigger('click')
expect(wrapper.vm.removeTagFromMultipleUsers).toHaveBeenCalled()
expect(wrapper.vm.removeTagFromMultipleUsers).toHaveBeenCalledWith('mrf_tag:media-strip')
wrapper.find(`.el-dropdown-menu__item:nth-child(14) button:nth-child(2)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(16) button:nth-child(2)`).trigger('click')
expect(wrapper.vm.removeTagFromMultipleUsers).toHaveBeenCalled()
expect(wrapper.vm.removeTagFromMultipleUsers).toHaveBeenCalledWith('mrf_tag:sandbox')
wrapper.find(`.el-dropdown-menu__item:nth-child(16) button:nth-child(2)`).trigger('click')
wrapper.find(`.el-dropdown-menu__item:nth-child(18) button:nth-child(2)`).trigger('click')
expect(wrapper.vm.removeTagFromMultipleUsers).toHaveBeenCalled()
expect(wrapper.vm.removeTagFromMultipleUsers).toHaveBeenCalledWith('mrf_tag:disable-any-subscription')
@ -312,4 +312,35 @@ describe('Apply users actions to multiple users', () => {
expect(updatedUser2.tags.length).toBe(0)
done()
})
it('approves multiple accounts', async (done) => {
const wrapper = mount(MultipleUsersMenu, {
store,
localVue,
sync: false,
propsData: {
selectedUsers: users
}
})
await flushPromises()
const approveAccountsForMultipleUsersStub = jest.fn()
wrapper.setMethods({ approveAccountsForMultipleUsers: approveAccountsForMultipleUsersStub })
wrapper.find(`.el-dropdown-menu__item:nth-child(5)`).trigger('click')
expect(wrapper.vm.approveAccountsForMultipleUsers).toHaveBeenCalled()
const approveAccounts = wrapper.vm.mappers().approveAccounts
const user1 = store.state.users.fetchedUsers[0]
const user2 = store.state.users.fetchedUsers[3]
expect(user1.approval_pending).toBe(false)
expect(user2.approval_pending).toBe(true)
approveAccounts()
const updatedUser1 = store.state.users.fetchedUsers[0]
const updatedUser2 = store.state.users.fetchedUsers[3]
expect(updatedUser1.approval_pending).toBe(false)
expect(updatedUser2.approval_pending).toBe(false)
done()
})
})

16
test/views/users/usersFilters.test.js
View file

@ -31,18 +31,18 @@ describe('Filters users', () => {
localVue
})
expect(store.state.users.totalUsersCount).toEqual(3)
expect(store.state.users.totalUsersCount).toEqual(4)
const filter = wrapper.find(`li.el-select-dropdown__item:nth-child(${1})`)
filter.trigger('click')
await flushPromises()
expect(store.state.users.totalUsersCount).toEqual(2)
expect(store.state.users.totalUsersCount).toEqual(3)
done()
})
it('shows users with applied filter and search query', async (done) => {
expect(store.state.users.totalUsersCount).toEqual(3)
expect(store.state.users.totalUsersCount).toEqual(4)
store.dispatch('ToggleUsersFilter', { active: true })
await flushPromises()
@ -56,17 +56,17 @@ describe('Filters users', () => {
store.dispatch('SearchUsers', { query: '', page: 1 })
await flushPromises()
expect(store.state.users.totalUsersCount).toEqual(2)
expect(store.state.users.totalUsersCount).toEqual(3)
done()
})
it('applies two filters', async (done) => {
expect(store.state.users.totalUsersCount).toEqual(3)
expect(store.state.users.totalUsersCount).toEqual(4)
store.dispatch('ToggleUsersFilter', { active: true, local: true })
await flushPromises()
expect(store.state.users.totalUsersCount).toEqual(1)
expect(store.state.users.totalUsersCount).toEqual(2)
expect(store.state.users.fetchedUsers[0].nickname).toEqual('allis')
store.dispatch('ToggleUsersFilter', { deactivated: true, external: true })
@ -77,7 +77,7 @@ describe('Filters users', () => {
})
it('shows all users after removing filters', async (done) => {
expect(store.state.users.totalUsersCount).toEqual(3)
expect(store.state.users.totalUsersCount).toEqual(4)
store.dispatch('ToggleUsersFilter', { deactivated: true })
await flushPromises()
@ -85,7 +85,7 @@ describe('Filters users', () => {
store.dispatch('ToggleUsersFilter', {})
await flushPromises()
expect(store.state.users.totalUsersCount).toEqual(3)
expect(store.state.users.totalUsersCount).toEqual(4)
done()
})