aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared/shared-moderation
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2021-10-21 10:19:42 +0200
committerChocobozzz <me@florianbigard.com>2021-10-21 10:19:42 +0200
commita2c3564a31268e4e60f05952aa3731e114ac1e30 (patch)
treef0bf29c8b304ec61ded60328f1a488338c2d4c8e /client/src/app/shared/shared-moderation
parent5196817c5d7cf86b35f3fa2cfe108ba283944482 (diff)
downloadPeerTube-a2c3564a31268e4e60f05952aa3731e114ac1e30.tar.gz
PeerTube-a2c3564a31268e4e60f05952aa3731e114ac1e30.tar.zst
PeerTube-a2c3564a31268e4e60f05952aa3731e114ac1e30.zip
Improve moderation dropdown UX
Diffstat (limited to 'client/src/app/shared/shared-moderation')
-rw-r--r--client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts252
1 files changed, 138 insertions, 114 deletions
diff --git a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
index 9f1e1bf9b..1c5240db4 100644
--- a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
+++ b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
@@ -241,139 +241,163 @@ export class UserModerationDropdownComponent implements OnInit, OnChanges {
241 return [ '/admin', 'users', 'update', user.id ] 241 return [ '/admin', 'users', 'update', user.id ]
242 } 242 }
243 243
244 private isMyUser (user: User) {
245 return user && this.authService.getUser().id === user.id
246 }
247
248 private isMyAccount (account: Account) {
249 return account && this.authService.getUser().account.id === account.id
250 }
251
244 private buildActions () { 252 private buildActions () {
245 this.userActions = [] 253 this.userActions = []
246 254
247 if (this.prependActions) { 255 if (this.prependActions && this.prependActions.length !== 0) {
248 this.userActions = [ 256 this.userActions = [
249 this.prependActions 257 this.prependActions
250 ] 258 ]
251 } 259 }
252 260
253 if (this.authService.isLoggedIn()) { 261 const myAccountModerationActions = this.buildMyAccountModerationActions()
254 const authUser = this.authService.getUser() 262 const instanceModerationActions = this.buildInstanceModerationActions()
255 263
256 if (this.user && authUser.id === this.user.id) return 264 if (myAccountModerationActions.length !== 0) this.userActions.push(myAccountModerationActions)
265 if (instanceModerationActions.length !== 0) this.userActions.push(instanceModerationActions)
266 }
257 267
258 if (this.user && authUser.hasRight(UserRight.MANAGE_USERS) && authUser.canManage(this.user)) { 268 private buildMyAccountModerationActions () {
259 this.userActions.push([ 269 if (!this.account || !this.authService.isLoggedIn()) return []
260 { 270
261 label: $localize`Edit user`, 271 const myAccountActions: DropdownAction<{ user: User, account: Account }>[] = [
262 description: $localize`Change quota, role, and more.`, 272 {
263 linkBuilder: ({ user }) => this.getRouterUserEditLink(user) 273 label: $localize`Personal moderation`,
264 }, 274 class: [ 'red' ],
265 { 275 isHeader: true
266 label: $localize`Delete user`, 276 },
267 description: $localize`Videos will be deleted, comments will be tombstoned.`, 277 {
268 handler: ({ user }) => this.removeUser(user) 278 label: $localize`Mute this account`,
269 }, 279 description: $localize`Hide any content from that user from you.`,
270 { 280 isDisplayed: ({ account }) => !this.isMyAccount(account) && account.mutedByUser === false,
271 label: $localize`Ban`, 281 handler: ({ account }) => this.blockAccountByUser(account)
272 description: $localize`User won't be able to login anymore, but videos and comments will be kept as is.`, 282 },
273 handler: ({ user }) => this.openBanUserModal(user), 283 {
274 isDisplayed: ({ user }) => !user.blocked 284 label: $localize`Unmute this account`,
275 }, 285 description: $localize`Show back content from that user for you.`,
276 { 286 isDisplayed: ({ account }) => !this.isMyAccount(account) && account.mutedByUser === true,
277 label: $localize`Unban user`, 287 handler: ({ account }) => this.unblockAccountByUser(account)
278 description: $localize`Allow the user to login and create videos/comments again`, 288 },
279 handler: ({ user }) => this.unbanUser(user), 289 {
280 isDisplayed: ({ user }) => user.blocked 290 label: $localize`Mute the instance`,
281 }, 291 description: $localize`Hide any content from that instance for you.`,
282 { 292 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === false,
283 label: $localize`Set Email as Verified`, 293 handler: ({ account }) => this.blockServerByUser(account.host)
284 handler: ({ user }) => this.setEmailAsVerified(user), 294 },
285 isDisplayed: ({ user }) => this.requiresEmailVerification && !user.blocked && user.emailVerified === false 295 {
286 } 296 label: $localize`Unmute the instance`,
287 ]) 297 description: $localize`Show back content from that instance for you.`,
298 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === true,
299 handler: ({ account }) => this.unblockServerByUser(account.host)
300 },
301 {
302 label: $localize`Remove comments from your videos`,
303 description: $localize`Remove comments made by this account on your videos.`,
304 isDisplayed: ({ account }) => !this.isMyAccount(account),
305 handler: ({ account }) => this.bulkRemoveCommentsOf({ accountName: account.nameWithHost, scope: 'my-videos' })
288 } 306 }
307 ]
289 308
290 // Actions on accounts/servers 309 return myAccountActions
291 if (this.account) { 310 }
292 // User actions 311
293 this.userActions.push([ 312 private buildInstanceModerationActions () {
294 { 313 if (!this.authService.isLoggedIn()) return []
295 label: $localize`Mute this account`, 314
296 description: $localize`Hide any content from that user from you.`, 315 const authUser = this.authService.getUser()
297 isDisplayed: ({ account }) => account.mutedByUser === false, 316
298 handler: ({ account }) => this.blockAccountByUser(account) 317 let instanceActions: DropdownAction<{ user: User, account: Account }>[] = []
299 }, 318
300 { 319 if (this.user && authUser.hasRight(UserRight.MANAGE_USERS) && authUser.canManage(this.user)) {
301 label: $localize`Unmute this account`, 320 instanceActions = instanceActions.concat([
302 description: $localize`Show back content from that user for you.`, 321 {
303 isDisplayed: ({ account }) => account.mutedByUser === true, 322 label: $localize`Edit user`,
304 handler: ({ account }) => this.unblockAccountByUser(account) 323 description: $localize`Change quota, role, and more.`,
305 }, 324 linkBuilder: ({ user }) => this.getRouterUserEditLink(user)
306 { 325 },
307 label: $localize`Mute the instance`, 326 {
308 description: $localize`Hide any content from that instance for you.`, 327 label: $localize`Delete user`,
309 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === false, 328 description: $localize`Videos will be deleted, comments will be tombstoned.`,
310 handler: ({ account }) => this.blockServerByUser(account.host) 329 isDisplayed: ({ user }) => !this.isMyUser(user),
311 }, 330 handler: ({ user }) => this.removeUser(user)
312 { 331 },
313 label: $localize`Unmute the instance`, 332 {
314 description: $localize`Show back content from that instance for you.`, 333 label: $localize`Ban`,
315 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === true, 334 description: $localize`User won't be able to login anymore, but videos and comments will be kept as is.`,
316 handler: ({ account }) => this.unblockServerByUser(account.host) 335 handler: ({ user }) => this.openBanUserModal(user),
317 }, 336 isDisplayed: ({ user }) => !this.isMyUser(user) && !user.blocked
318 { 337 },
319 label: $localize`Remove comments from your videos`, 338 {
320 description: $localize`Remove comments made by this account on your videos.`, 339 label: $localize`Unban user`,
321 handler: ({ account }) => this.bulkRemoveCommentsOf({ accountName: account.nameWithHost, scope: 'my-videos' }) 340 description: $localize`Allow the user to login and create videos/comments again`,
322 } 341 handler: ({ user }) => this.unbanUser(user),
323 ]) 342 isDisplayed: ({ user }) => !this.isMyUser(user) && user.blocked
324 343 },
325 let instanceActions: DropdownAction<{ user: User, account: Account }>[] = [] 344 {
326 345 label: $localize`Set Email as Verified`,
327 // Instance actions on account blocklists 346 handler: ({ user }) => this.setEmailAsVerified(user),
328 if (authUser.hasRight(UserRight.MANAGE_ACCOUNTS_BLOCKLIST)) { 347 isDisplayed: ({ user }) => this.requiresEmailVerification && !user.blocked && user.emailVerified === false
329 instanceActions = instanceActions.concat([
330 {
331 label: $localize`Mute this account by your instance`,
332 description: $localize`Hide any content from that user from you, your instance and its users.`,
333 isDisplayed: ({ account }) => account.mutedByInstance === false,
334 handler: ({ account }) => this.blockAccountByInstance(account)
335 },
336 {
337 label: $localize`Unmute this account by your instance`,
338 description: $localize`Show this user's content to the users of this instance again.`,
339 isDisplayed: ({ account }) => account.mutedByInstance === true,
340 handler: ({ account }) => this.unblockAccountByInstance(account)
341 }
342 ])
343 } 348 }
349 ])
350 }
344 351
345 // Instance actions on server blocklists 352 // Instance actions on account blocklists
346 if (authUser.hasRight(UserRight.MANAGE_SERVERS_BLOCKLIST)) { 353 if (this.account && authUser.hasRight(UserRight.MANAGE_ACCOUNTS_BLOCKLIST)) {
347 instanceActions = instanceActions.concat([ 354 instanceActions = instanceActions.concat([
348 { 355 {
349 label: $localize`Mute the instance by your instance`, 356 label: $localize`Mute this account`,
350 description: $localize`Hide any content from that instance from you, your instance and its users.`, 357 description: $localize`Hide any content from that user from you, your instance and its users.`,
351 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === false, 358 isDisplayed: ({ account }) => !this.isMyAccount(account) && account.mutedByInstance === false,
352 handler: ({ account }) => this.blockServerByInstance(account.host) 359 handler: ({ account }) => this.blockAccountByInstance(account)
353 }, 360 },
354 { 361 {
355 label: $localize`Unmute the instance by your instance`, 362 label: $localize`Unmute this account`,
356 description: $localize`Show back content from that instance for you, your instance and its users.`, 363 description: $localize`Show this user's content to the users of this instance again.`,
357 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === true, 364 isDisplayed: ({ account }) => !this.isMyAccount(account) && account.mutedByInstance === true,
358 handler: ({ account }) => this.unblockServerByInstance(account.host) 365 handler: ({ account }) => this.unblockAccountByInstance(account)
359 }
360 ])
361 } 366 }
367 ])
368 }
362 369
363 if (authUser.hasRight(UserRight.REMOVE_ANY_VIDEO_COMMENT)) { 370 // Instance actions on server blocklists
364 instanceActions = instanceActions.concat([ 371 if (this.account && authUser.hasRight(UserRight.MANAGE_SERVERS_BLOCKLIST)) {
365 { 372 instanceActions = instanceActions.concat([
366 label: $localize`Remove comments from your instance`, 373 {
367 description: $localize`Remove comments made by this account from your instance.`, 374 label: $localize`Mute the instance`,
368 handler: ({ account }) => this.bulkRemoveCommentsOf({ accountName: account.nameWithHost, scope: 'instance' }) 375 description: $localize`Hide any content from that instance from you, your instance and its users.`,
369 } 376 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === false,
370 ]) 377 handler: ({ account }) => this.blockServerByInstance(account.host)
378 },
379 {
380 label: $localize`Unmute the instance by your instance`,
381 description: $localize`Show back content from that instance for you, your instance and its users.`,
382 isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === true,
383 handler: ({ account }) => this.unblockServerByInstance(account.host)
371 } 384 }
385 ])
386 }
372 387
373 if (instanceActions.length !== 0) { 388 if (this.account && authUser.hasRight(UserRight.REMOVE_ANY_VIDEO_COMMENT)) {
374 this.userActions.push(instanceActions) 389 instanceActions = instanceActions.concat([
390 {
391 label: $localize`Remove comments from your instance`,
392 description: $localize`Remove comments made by this account from your instance.`,
393 isDisplayed: ({ account }) => !this.isMyAccount(account),
394 handler: ({ account }) => this.bulkRemoveCommentsOf({ accountName: account.nameWithHost, scope: 'instance' })
375 } 395 }
376 } 396 ])
377 } 397 }
398
399 if (instanceActions.length === 0) return []
400
401 return [ { label: $localize`Instance moderation`, isHeader: true }, ...instanceActions ]
378 } 402 }
379} 403}