diff --git a/client/src/app/+admin/system/jobs/jobs.component.html b/client/src/app/+admin/system/jobs/jobs.component.html index e10a2f785..bfe90a31d 100644 --- a/client/src/app/+admin/system/jobs/jobs.component.html +++ b/client/src/app/+admin/system/jobs/jobs.component.html @@ -53,7 +53,8 @@ Priority (1 = highest priority) State Progress - Created + Created + Processed/Finished @@ -64,11 +65,15 @@ {{ job.id }} - {{ job.type }} + + + {{ job.type }} + + {{ job.priority }} - {{ job.state }} + {{ job.state }} @@ -76,6 +81,11 @@ {{ job.createdAt }} + + +
{{ job.processedOn }}
+
{{ job.finishedOn}}
+ diff --git a/client/src/app/+admin/system/jobs/jobs.component.scss b/client/src/app/+admin/system/jobs/jobs.component.scss index c88e7af1e..4305eea06 100644 --- a/client/src/app/+admin/system/jobs/jobs.component.scss +++ b/client/src/app/+admin/system/jobs/jobs.component.scss @@ -27,7 +27,7 @@ } .job-date { - width: 170px !important; + width: 200px !important; } } diff --git a/client/src/app/+admin/system/jobs/jobs.component.ts b/client/src/app/+admin/system/jobs/jobs.component.ts index bd0799707..2ff60f8e0 100644 --- a/client/src/app/+admin/system/jobs/jobs.component.ts +++ b/client/src/app/+admin/system/jobs/jobs.component.ts @@ -144,6 +144,10 @@ export class JobsComponent extends RestTable implements OnInit { this.reloadData() } + getRandomJobTypeBadge (type: string) { + return this.getRandomBadge('type', type) + } + protected reloadDataInternal () { let jobState = this.jobState as JobState if (this.jobState === 'all') jobState = null diff --git a/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.html b/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.html index d1d4f589c..ae383f1d3 100644 --- a/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.html +++ b/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.html @@ -30,11 +30,12 @@ UUID Type - State + State Priority Progress - Runner + Runner Created + Processed/Finished @@ -75,18 +76,32 @@ {{ runnerJob.uuid }} - {{ runnerJob.type }} + - {{ runnerJob.state.label }} + {{ runnerJob.type }} + + + {{ runnerJob.state.label }} + + {{ runnerJob.priority }} {{ runnerJob.progress }}% - {{ runnerJob.runner?.name }} + +
+ {{ runnerJob.runner.name }} +
+ {{ runnerJob.createdAt }} + + +
{{ runnerJob.startedAt }}
+
{{ runnerJob.finishedAt}}
+ diff --git a/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.ts b/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.ts index a11bc2211..423bbadcf 100644 --- a/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.ts +++ b/client/src/app/+admin/system/runners/runner-job-list/runner-job-list.component.ts @@ -1,19 +1,19 @@ -import { SortMeta, SharedModule } from 'primeng/api' +import { NgClass, NgIf } from '@angular/common' import { Component, OnInit } from '@angular/core' +import { RouterLink } from '@angular/router' import { ConfirmService, Notifier, RestPagination, RestTable } from '@app/core' import { formatICU } from '@app/helpers' -import { RunnerJob, RunnerJobState } from '@peertube/peertube-models' -import { RunnerJobFormatted, RunnerService } from '../runner.service' -import { AutoColspanDirective } from '../../../../shared/shared-main/angular/auto-colspan.directive' -import { TableExpanderIconComponent } from '../../../../shared/shared-tables/table-expander-icon.component' -import { ButtonComponent } from '../../../../shared/shared-main/buttons/button.component' -import { AdvancedInputFilter, AdvancedInputFilterComponent } from '../../../../shared/shared-forms/advanced-input-filter.component' -import { ActionDropdownComponent, DropdownAction } from '../../../../shared/shared-main/buttons/action-dropdown.component' -import { NgIf, NgClass } from '@angular/common' import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap' +import { RunnerJob, RunnerJobState } from '@peertube/peertube-models' +import { SharedModule, SortMeta } from 'primeng/api' import { TableModule } from 'primeng/table' -import { RouterLink } from '@angular/router' +import { AdvancedInputFilter, AdvancedInputFilterComponent } from '../../../../shared/shared-forms/advanced-input-filter.component' import { GlobalIconComponent } from '../../../../shared/shared-icons/global-icon.component' +import { AutoColspanDirective } from '../../../../shared/shared-main/angular/auto-colspan.directive' +import { ActionDropdownComponent, DropdownAction } from '../../../../shared/shared-main/buttons/action-dropdown.component' +import { ButtonComponent } from '../../../../shared/shared-main/buttons/button.component' +import { TableExpanderIconComponent } from '../../../../shared/shared-tables/table-expander-icon.component' +import { RunnerJobFormatted, RunnerService } from '../runner.service' @Component({ selector: 'my-runner-job-list', @@ -176,6 +176,14 @@ export class RunnerJobListComponent extends RestTable implements OnI } } + getRandomRunnerNameBadge (value: string) { + return this.getRandomBadge('runner', value) + } + + getRandomRunnerTypeBadge (value: string) { + return this.getRandomBadge('type', value) + } + protected reloadDataInternal () { this.runnerService.listRunnerJobs({ pagination: this.pagination, sort: this.sort, search: this.search }) .subscribe({ diff --git a/client/src/app/core/rest/rest-table.ts b/client/src/app/core/rest/rest-table.ts index f2db6118f..9cc300210 100644 --- a/client/src/app/core/rest/rest-table.ts +++ b/client/src/app/core/rest/rest-table.ts @@ -1,9 +1,9 @@ -import debug from 'debug' -import { SortMeta } from 'primeng/api' -import { TableLazyLoadEvent } from 'primeng/table' import { ActivatedRoute, Router } from '@angular/router' import { logger } from '@root-helpers/logger' import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' +import debug from 'debug' +import { SortMeta } from 'primeng/api' +import { TableLazyLoadEvent } from 'primeng/table' import { RestPagination } from './rest-pagination' const debugLogger = debug('peertube:tables:RestTable') @@ -27,6 +27,11 @@ export abstract class RestTable { protected route: ActivatedRoute protected router: Router + // First string is badge column type + // Inner Map is value -> badge name + private valueToBadge = new Map>() + private badgesUsed = new Set() + abstract getIdentifier (): string initialize () { @@ -96,6 +101,38 @@ export abstract class RestTable { this.reloadDataInternal() } + protected getRandomBadge (type: string, value: string): string { + if (!this.valueToBadge.has(type)) { + this.valueToBadge.set(type, new Map()) + } + + const badges = this.valueToBadge.get(type) + const badge = badges.get(value) + if (badge) return badge + + const toTry = [ + 'badge-yellow', + 'badge-purple', + 'badge-blue', + 'badge-brown', + 'badge-green', + 'badge-secondary' + ] + + for (const badge of toTry) { + if (!this.badgesUsed.has(badge)) { + this.badgesUsed.add(badge) + badges.set(value, badge) + return badge + } + } + + // Reset, we used all available badges + this.badgesUsed.clear() + + return this.getRandomBadge(type, value) + } + private getSortLocalStorageKey () { return 'rest-table-sort-' + this.getIdentifier() } diff --git a/client/src/sass/include/_badges.scss b/client/src/sass/include/_badges.scss index 7efd2fb81..9474611f4 100644 --- a/client/src/sass/include/_badges.scss +++ b/client/src/sass/include/_badges.scss @@ -8,6 +8,7 @@ font-size: 75%; font-weight: $font-semibold; line-height: 1.1; + max-width: 100%; &.badge-fs-normal { font-size: 100%;