57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import { Component, OnInit, OnDestroy, ChangeDetectorRef, inject } from '@angular/core';
|
|
import { PluginManifest, PluginService } from '@services/plugin.service';
|
|
import { Subscription } from 'rxjs';
|
|
|
|
@Component({
|
|
selector: 'app-plugins',
|
|
templateUrl: './plugins.component.html',
|
|
styleUrls: ['./plugins.component.css']
|
|
})
|
|
export class PluginsComponent implements OnInit, OnDestroy {
|
|
plugins: PluginManifest[] = [];
|
|
selectedTabIndex: number = 0;
|
|
isLoading: boolean = true;
|
|
private pluginSub?: Subscription;
|
|
private cdr = inject(ChangeDetectorRef);
|
|
|
|
get activePluginsCount(): number {
|
|
return this.plugins.filter(p => p.enabled).length;
|
|
}
|
|
|
|
constructor(public pluginService: PluginService) {}
|
|
|
|
ngOnInit(): void {
|
|
// 1. Asignar estado actual en memoria si ya existe
|
|
this.plugins = this.pluginService.getAllPlugins();
|
|
if (this.plugins.length > 0) {
|
|
this.isLoading = false;
|
|
}
|
|
|
|
// 2. Suscribirse reactivamente al flujo de plugins
|
|
this.pluginSub = this.pluginService.plugins$.subscribe(plugins => {
|
|
this.plugins = plugins || [];
|
|
if (this.plugins.length > 0) {
|
|
this.isLoading = false;
|
|
}
|
|
this.cdr.markForCheck();
|
|
});
|
|
|
|
// 3. Forzar refresco desde el backend para garantizar datos actualizados
|
|
this.pluginService.refreshPlugins().subscribe({
|
|
next: (plugins) => {
|
|
this.plugins = plugins || [];
|
|
this.isLoading = false;
|
|
this.cdr.markForCheck();
|
|
},
|
|
error: () => {
|
|
this.isLoading = false;
|
|
this.cdr.markForCheck();
|
|
}
|
|
});
|
|
}
|
|
|
|
ngOnDestroy(): void {
|
|
this.pluginSub?.unsubscribe();
|
|
}
|
|
}
|