diff --git a/src-ui/src/app/components/admin/logs/logs.component.ts b/src-ui/src/app/components/admin/logs/logs.component.ts index e186b27b0..57210fddb 100644 --- a/src-ui/src/app/components/admin/logs/logs.component.ts +++ b/src-ui/src/app/components/admin/logs/logs.component.ts @@ -7,6 +7,7 @@ import { OnInit, ViewChild, inject, + signal, } from '@angular/core' import { FormsModule, ReactiveFormsModule } from '@angular/forms' import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap' @@ -34,22 +35,70 @@ export class LogsComponent private logService = inject(LogService) private changedetectorRef = inject(ChangeDetectorRef) - public logs: Array<{ message: string; level: number }> = [] + private logsSignal = signal>([]) - public logFiles: string[] = [] + private logFilesSignal = signal([]) - public activeLog: string + private activeLogSignal = signal(undefined) - public autoRefreshEnabled: boolean = true + private autoRefreshEnabledSignal = signal(true) - public limit: number = 5000 + private limitSignal = signal(5000) - public showJumpToBottom = false + private showJumpToBottomSignal = signal(false) private readonly limitChange$ = new Subject() @ViewChild('logContainer') logContainer: ElementRef + public get logs(): Array<{ message: string; level: number }> { + return this.logsSignal() + } + + public set logs(logs: Array<{ message: string; level: number }>) { + this.logsSignal.set(logs) + } + + public get logFiles(): string[] { + return this.logFilesSignal() + } + + public set logFiles(logFiles: string[]) { + this.logFilesSignal.set(logFiles) + } + + public get activeLog(): string { + return this.activeLogSignal() + } + + public set activeLog(activeLog: string) { + this.activeLogSignal.set(activeLog) + } + + public get autoRefreshEnabled(): boolean { + return this.autoRefreshEnabledSignal() + } + + public set autoRefreshEnabled(autoRefreshEnabled: boolean) { + this.autoRefreshEnabledSignal.set(autoRefreshEnabled) + } + + public get limit(): number { + return this.limitSignal() + } + + public set limit(limit: number) { + this.limitSignal.set(limit) + } + + public get showJumpToBottom(): boolean { + return this.showJumpToBottomSignal() + } + + public set showJumpToBottom(showJumpToBottom: boolean) { + this.showJumpToBottomSignal.set(showJumpToBottom) + } + ngOnInit(): void { this.limitChange$ .pipe(debounceTime(300), takeUntil(this.unsubscribeNotifier)) diff --git a/src-ui/src/app/components/manage/workflows/workflows.component.ts b/src-ui/src/app/components/manage/workflows/workflows.component.ts index 710eb3aa3..5ede19c59 100644 --- a/src-ui/src/app/components/manage/workflows/workflows.component.ts +++ b/src-ui/src/app/components/manage/workflows/workflows.component.ts @@ -1,8 +1,8 @@ -import { Component, OnInit, inject } from '@angular/core' +import { Component, OnInit, inject, signal } from '@angular/core' import { FormsModule, ReactiveFormsModule } from '@angular/forms' import { NgbDropdownModule, NgbModal } from '@ng-bootstrap/ng-bootstrap' import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons' -import { delay, takeUntil, tap } from 'rxjs' +import { takeUntil, tap } from 'rxjs' import { Workflow } from 'src/app/data/workflow' import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive' import { PermissionsService } from 'src/app/services/permissions.service' @@ -39,7 +39,15 @@ export class WorkflowsComponent private modalService = inject(NgbModal) private toastService = inject(ToastService) - public workflows: Workflow[] = [] + private workflowsSignal = signal([]) + + public get workflows(): Workflow[] { + return this.workflowsSignal() + } + + public set workflows(workflows: Workflow[]) { + this.workflowsSignal.set(workflows) + } ngOnInit() { this.reload() @@ -51,8 +59,7 @@ export class WorkflowsComponent .listAll() .pipe( takeUntil(this.unsubscribeNotifier), - tap((r) => (this.workflows = r.results)), - delay(100) + tap((r) => (this.workflows = r.results)) ) .subscribe(() => { this.show = true