Add ability to filter logs by tags

6 files changed, 32 insertions, 19 deletions

diff --git a/client/src/app/+admin/system/logs/logs.component.html b/client/src/app/+admin/system/logs/logs.component.html
index b2c7f84bc..18011b205 100644
--- a/client/src/app/+admin/system/logs/logs.component.html
+++ b/client/src/app/+admin/system/logs/logs.component.html
@@ -28,6 +28,8 @@
     </ng-option>
   </ng-select>
 
+  <my-select-tags i18n-placeholder placeholder="Filter logs by tags" [(ngModel)]="tagsOneOf" (ngModelChange)="refresh()"></my-select-tags>
+
   <my-button i18n-label label="Refresh" icon="refresh" (click)="refresh()"></my-button>
 </div>
 
diff --git a/client/src/app/+admin/system/logs/logs.component.scss b/client/src/app/+admin/system/logs/logs.component.scss
index fefa7efc2..be66d563b 100644
--- a/client/src/app/+admin/system/logs/logs.component.scss
+++ b/client/src/app/+admin/system/logs/logs.component.scss
@@ -52,9 +52,7 @@
     @include peertube-select-container(150px);
   }
 
-  my-button,
-  .peertube-select-container,
-  ng-select {
+  > * {
     @include margin-left(10px);
   }
 }
diff --git a/client/src/app/+admin/system/logs/logs.component.ts b/client/src/app/+admin/system/logs/logs.component.ts
index 865ab80a2..06237522a 100644
--- a/client/src/app/+admin/system/logs/logs.component.ts
+++ b/client/src/app/+admin/system/logs/logs.component.ts
@@ -23,6 +23,7 @@ export class LogsComponent implements OnInit {
   startDate: string
   level: LogLevel
   logType: 'audit' | 'standard'
+  tagsOneOf: string[] = []
 
   constructor (
     private logsService: LogsService,
@@ -51,20 +52,28 @@ export class LogsComponent implements OnInit {
   load () {
     this.loading = true
 
-    this.logsService.getLogs({ isAuditLog: this.isAuditLog(), level: this.level, startDate: this.startDate })
-        .subscribe({
-          next: logs => {
-            this.logs = logs
-
-            setTimeout(() => {
-              this.logsElement.nativeElement.scrollIntoView({ block: 'end', inline: 'nearest' })
-            })
-          },
+    const tagsOneOf = this.tagsOneOf.length !== 0
+      ? this.tagsOneOf
+      : undefined
+
+    this.logsService.getLogs({
+      isAuditLog: this.isAuditLog(),
+      level: this.level,
+      startDate: this.startDate,
+      tagsOneOf
+    }).subscribe({
+      next: logs => {
+        this.logs = logs
+
+        setTimeout(() => {
+          this.logsElement.nativeElement.scrollIntoView({ block: 'end', inline: 'nearest' })
+        })
+      },
 
-          error: err => this.notifier.error(err.message),
+      error: err => this.notifier.error(err.message),
 
-          complete: () => this.loading = false
-        })
+      complete: () => this.loading = false
+    })
   }
 
   isAuditLog () {
diff --git a/client/src/app/+admin/system/logs/logs.service.ts b/client/src/app/+admin/system/logs/logs.service.ts
index 0c222cad2..ea7e08b9b 100644
--- a/client/src/app/+admin/system/logs/logs.service.ts
+++ b/client/src/app/+admin/system/logs/logs.service.ts
@@ -2,7 +2,7 @@ import { Observable } from 'rxjs'
 import { catchError, map } from 'rxjs/operators'
 import { HttpClient, HttpParams } from '@angular/common/http'
 import { Injectable } from '@angular/core'
-import { RestExtractor } from '@app/core'
+import { RestExtractor, RestService } from '@app/core'
 import { LogLevel } from '@shared/models'
 import { environment } from '../../../../environments/environment'
 import { LogRow } from './log-row.model'
@@ -14,22 +14,25 @@ export class LogsService {
 
   constructor (
     private authHttp: HttpClient,
+    private restService: RestService,
     private restExtractor: RestExtractor
   ) {}
 
   getLogs (options: {
     isAuditLog: boolean
     startDate: string
+    tagsOneOf?: string[]
     level?: LogLevel
     endDate?: string
   }): Observable<any[]> {
-    const { isAuditLog, startDate } = options
+    const { isAuditLog, startDate, endDate, tagsOneOf } = options
 
     let params = new HttpParams()
     params = params.append('startDate', startDate)
 
     if (!isAuditLog) params = params.append('level', options.level)
-    if (options.endDate) params.append('endDate', options.endDate)
+    if (endDate) params = params.append('endDate', options.endDate)
+    if (tagsOneOf) params = this.restService.addArrayParams(params, 'tagsOneOf', tagsOneOf)
 
     const path = isAuditLog
       ? LogsService.BASE_AUDIT_LOG_URL
diff --git a/client/src/app/shared/shared-forms/select/select-tags.component.html b/client/src/app/shared/shared-forms/select/select-tags.component.html
index e1cd50882..de6cee6db 100644
--- a/client/src/app/shared/shared-forms/select/select-tags.component.html
+++ b/client/src/app/shared/shared-forms/select/select-tags.component.html
@@ -2,7 +2,7 @@
   [items]="availableItems"
   [(ngModel)]="selectedItems"
   (ngModelChange)="onModelChange()"
-  i18n-placeholder placeholder="Enter a new tag"
+  [placeholder]="placeholder"
   [maxSelectedItems]="5"
   [clearable]="true"
   [addTag]="true"
diff --git a/client/src/app/shared/shared-forms/select/select-tags.component.ts b/client/src/app/shared/shared-forms/select/select-tags.component.ts
index 93d199037..bef04de8a 100644
--- a/client/src/app/shared/shared-forms/select/select-tags.component.ts
+++ b/client/src/app/shared/shared-forms/select/select-tags.component.ts
@@ -16,6 +16,7 @@ import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms'
 export class SelectTagsComponent implements ControlValueAccessor {
   @Input() availableItems: string[] = []
   @Input() selectedItems: string[] = []
+  @Input() placeholder = $localize`Enter a new tag`
 
   propagateChange = (_: any) => { /* empty */ }