forks/peertube
1
0
Fork 0
Code Releases Activity

Add separators in user moderation dropdown

Browse source
This commit is contained in:
Chocobozzz 2018-11-21 17:05:31 +01:00
parent 9fa0ea41aa
commit f97c91f7ec
No known key found for this signature in database
GPG key ID: 583A612D890159BE
4 changed files with 36 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
client/src/app/shared/buttons/action-dropdown.component.html
View file

@ -8,14 +8,20 @@
</div>
<div ngbDropdownMenu class="dropdown-menu">
<ng-container *ngFor="let action of actions">
<ng-container *ngIf="action.isDisplayed === undefined || action.isDisplayed(entry) === true">
<a *ngIf="action.linkBuilder" class="dropdown-item" [routerLink]="action.linkBuilder(entry)">{{ action.label }}</a>
<ng-container *ngFor="let actions of getActions()">
<span *ngIf="!action.linkBuilder" class="custom-action dropdown-item" (click)="action.handler(entry)" role="button">
{{ action.label }}
</span>
<ng-container *ngFor="let action of actions">
<ng-container *ngIf="action.isDisplayed === undefined || action.isDisplayed(entry) === true">
<a *ngIf="action.linkBuilder" class="dropdown-item" [routerLink]="action.linkBuilder(entry)">{{ action.label }}</a>
<span *ngIf="!action.linkBuilder" class="custom-action dropdown-item" (click)="action.handler(entry)" role="button">
{{ action.label }}
</span>
</ng-container>
</ng-container>
<div class="dropdown-divider"></div>
</ng-container>
</div>
</div>

4
client/src/app/shared/buttons/action-dropdown.component.scss
View file

@ -1,6 +1,10 @@
@import '_variables';
@import '_mixins';
.dropdown-divider:last-child {
display: none;
}
.action-button {
@include peertube-button;

8
client/src/app/shared/buttons/action-dropdown.component.ts
View file

@ -14,10 +14,16 @@ export type DropdownAction<T> = {
})
export class ActionDropdownComponent<T> {
@Input() actions: DropdownAction<T>[] = []
@Input() actions: DropdownAction<T>[] | DropdownAction<T>[][] = []
@Input() entry: T
@Input() placement = 'bottom-left'
@Input() buttonSize: 'normal' | 'small' = 'normal'
@Input() label: string
@Input() theme: 'orange' | 'grey' = 'grey'
getActions () {
if (this.actions.length !== 0 && Array.isArray(this.actions[0])) return this.actions
return [ this.actions ]
}
}

16
client/src/app/shared/moderation/user-moderation-dropdown.component.ts
View file

@ -26,7 +26,7 @@ export class UserModerationDropdownComponent implements OnChanges {
@Output() userChanged = new EventEmitter()
@Output() userDeleted = new EventEmitter()
userActions: DropdownAction<{ user: User, account: Account }>[] = []
userActions: DropdownAction<{ user: User, account: Account }>[][] = []
constructor (
private authService: AuthService,
@ -264,7 +264,7 @@ export class UserModerationDropdownComponent implements OnChanges {
if (this.user && authUser.id === this.user.id) return
if (this.user && authUser.hasRight(UserRight.MANAGE_USERS)) {
this.userActions = this.userActions.concat([
this.userActions.push([
{
label: this.i18n('Edit'),
linkBuilder: ({ user }) => this.getRouterUserEditLink(user)
@ -294,7 +294,7 @@ export class UserModerationDropdownComponent implements OnChanges {
// Actions on accounts/servers
if (this.account) {
// User actions
this.userActions = this.userActions.concat([
this.userActions.push([
{
label: this.i18n('Mute this account'),
isDisplayed: ({ account }: { account: Account }) => account.mutedByUser === false,
@ -317,9 +317,11 @@ export class UserModerationDropdownComponent implements OnChanges {
}
])
let instanceActions: DropdownAction<{ user: User, account: Account }>[] = []
// Instance actions
if (authUser.hasRight(UserRight.MANAGE_ACCOUNTS_BLOCKLIST)) {
this.userActions = this.userActions.concat([
instanceActions = instanceActions.concat([
{
label: this.i18n('Mute this account by your instance'),
isDisplayed: ({ account }: { account: Account }) => account.mutedByInstance === false,
@ -335,7 +337,7 @@ export class UserModerationDropdownComponent implements OnChanges {
// Instance actions
if (authUser.hasRight(UserRight.MANAGE_SERVERS_BLOCKLIST)) {
this.userActions = this.userActions.concat([
instanceActions = instanceActions.concat([
{
label: this.i18n('Mute the instance by your instance'),
isDisplayed: ({ account }: { account: Account }) => !account.userId && account.mutedServerByInstance === false,
@ -348,6 +350,10 @@ export class UserModerationDropdownComponent implements OnChanges {
}
])
}
if (instanceActions.length !== 0) {
this.userActions.push(instanceActions)
}
}
}
}