Files
SimpleCloudNotifier/webapp/src/app/features/clients/client-list/client-list.component.ts
Mike Schwörer 2b7950f5dc
All checks were successful
Build Docker and Deploy / Build Docker Container (push) Successful in 1m41s
Build Docker and Deploy / Run Unit-Tests (push) Successful in 9m31s
Build Docker and Deploy / Deploy to Server (push) Successful in 18s
More webapp changes+fixes
2025-12-05 21:39:32 +01:00

82 lines
2.3 KiB
TypeScript

import { Component, inject, signal, OnInit } from '@angular/core';
import { CommonModule, DatePipe } from '@angular/common';
import { Router, RouterLink } from '@angular/router';
import { NzTableModule } from 'ng-zorro-antd/table';
import { NzButtonModule } from 'ng-zorro-antd/button';
import { NzIconModule } from 'ng-zorro-antd/icon';
import { NzTagModule } from 'ng-zorro-antd/tag';
import { NzEmptyModule } from 'ng-zorro-antd/empty';
import { NzCardModule } from 'ng-zorro-antd/card';
import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
import { ApiService } from '../../../core/services/api.service';
import { AuthService } from '../../../core/services/auth.service';
import { Client, ClientType, getClientTypeIcon } from '../../../core/models';
import { RelativeTimePipe } from '../../../shared/pipes/relative-time.pipe';
@Component({
selector: 'app-client-list',
standalone: true,
imports: [
CommonModule,
DatePipe,
RouterLink,
NzTableModule,
NzButtonModule,
NzIconModule,
NzTagModule,
NzEmptyModule,
NzCardModule,
NzToolTipModule,
RelativeTimePipe,
],
templateUrl: './client-list.component.html',
styleUrl: './client-list.component.scss'
})
export class ClientListComponent implements OnInit {
private apiService = inject(ApiService);
private authService = inject(AuthService);
private router = inject(Router);
clients = signal<Client[]>([]);
loading = signal(false);
ngOnInit(): void {
this.loadClients();
}
loadClients(): void {
const userId = this.authService.getUserId();
if (!userId) return;
this.loading.set(true);
this.apiService.getClients(userId).subscribe({
next: (response) => {
this.clients.set(response.clients);
this.loading.set(false);
},
error: () => {
this.loading.set(false);
}
});
}
getClientIcon(type: ClientType): string {
return getClientTypeIcon(type);
}
getClientTypeLabel(type: ClientType): string {
switch (type) {
case 'ANDROID': return 'Android';
case 'IOS': return 'iOS';
case 'MACOS': return 'macOS';
case 'WINDOWS': return 'Windows';
case 'LINUX': return 'Linux';
default: return type;
}
}
openClient(clientId: string): void {
this.router.navigate(['/clients', clientId]);
}
}