49 lines
1.4 KiB
TypeScript
49 lines
1.4 KiB
TypeScript
import {
|
|
ChangeDetectionStrategy,
|
|
Component,
|
|
OnInit,
|
|
inject,
|
|
signal,
|
|
} from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { AdminService, AdminUser } from '../../core/services/admin.service';
|
|
|
|
@Component({
|
|
selector: 'app-admin-users',
|
|
standalone: true,
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
imports: [CommonModule],
|
|
template: `
|
|
<section class="admin-area">
|
|
<h2>Admin area</h2>
|
|
<p data-testid="admin-loading" *ngIf="loading()">Loading users...</p>
|
|
<p data-testid="admin-error" *ngIf="error()" style="color:var(--color-danger)">{{ error() }}</p>
|
|
<ul data-testid="admin-user-list" *ngIf="!loading() && !error()">
|
|
<li *ngFor="let u of users()">
|
|
<b>{{ u.username }}</b> ({{ u.role }})
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
`,
|
|
})
|
|
export class AdminUsersComponent implements OnInit {
|
|
private readonly admin = inject(AdminService);
|
|
|
|
readonly users = signal<AdminUser[]>([]);
|
|
readonly loading = signal(false);
|
|
readonly error = signal<string | null>(null);
|
|
|
|
async ngOnInit(): Promise<void> {
|
|
this.loading.set(true);
|
|
this.error.set(null);
|
|
try {
|
|
const list = await this.admin.listUsers();
|
|
this.users.set(list);
|
|
} catch (e: any) {
|
|
this.error.set(e?.error?.message ?? e?.message ?? 'Failed to load users');
|
|
} finally {
|
|
this.loading.set(false);
|
|
}
|
|
}
|
|
}
|