diff --git a/apps/client/src/app/components/admin-platform/admin-platform.component.html b/apps/client/src/app/components/admin-platform/admin-platform.component.html
index 7370a19ae..44f5a6eab 100644
--- a/apps/client/src/app/components/admin-platform/admin-platform.component.html
+++ b/apps/client/src/app/components/admin-platform/admin-platform.component.html
@@ -54,7 +54,7 @@
|
diff --git a/apps/client/src/app/components/admin-platform/admin-platform.component.ts b/apps/client/src/app/components/admin-platform/admin-platform.component.ts
index 1c117b983..a9d135068 100644
--- a/apps/client/src/app/components/admin-platform/admin-platform.component.ts
+++ b/apps/client/src/app/components/admin-platform/admin-platform.component.ts
@@ -11,10 +11,12 @@ import {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
+ computed,
DestroyRef,
- Input,
+ inject,
+ input,
OnInit,
- ViewChild
+ viewChild
} from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { MatButtonModule } from '@angular/material/button';
@@ -54,27 +56,29 @@ import { CreateOrUpdatePlatformDialogParams } from './create-or-update-platform-
templateUrl: './admin-platform.component.html'
})
export class GfAdminPlatformComponent implements OnInit {
- @Input() locale = getLocale();
-
- @ViewChild(MatSort) sort: MatSort;
-
- public dataSource = new MatTableDataSource();
- public deviceType: string;
- public displayedColumns = ['name', 'url', 'accounts', 'actions'];
- public platforms: Platform[];
-
- public constructor(
- private adminService: AdminService,
- private changeDetectorRef: ChangeDetectorRef,
- private dataService: DataService,
- private destroyRef: DestroyRef,
- private deviceDetectorService: DeviceDetectorService,
- private dialog: MatDialog,
- private notificationService: NotificationService,
- private route: ActivatedRoute,
- private router: Router,
- private userService: UserService
- ) {
+ public readonly locale = input(getLocale());
+
+ protected dataSource = new MatTableDataSource();
+ protected readonly displayedColumns = ['name', 'url', 'accounts', 'actions'];
+ protected platforms: Platform[];
+
+ private readonly deviceType = computed(
+ () => this.deviceDetectorService.deviceInfo().deviceType
+ );
+ private readonly sort = viewChild.required(MatSort);
+
+ private readonly adminService = inject(AdminService);
+ private readonly changeDetectorRef = inject(ChangeDetectorRef);
+ private readonly dataService = inject(DataService);
+ private readonly destroyRef = inject(DestroyRef);
+ private readonly deviceDetectorService = inject(DeviceDetectorService);
+ private readonly dialog = inject(MatDialog);
+ private readonly notificationService = inject(NotificationService);
+ private readonly route = inject(ActivatedRoute);
+ private readonly router = inject(Router);
+ private readonly userService = inject(UserService);
+
+ public constructor() {
this.route.queryParams
.pipe(takeUntilDestroyed(this.destroyRef))
.subscribe((params) => {
@@ -86,7 +90,9 @@ export class GfAdminPlatformComponent implements OnInit {
return id === params['platformId'];
});
- this.openUpdatePlatformDialog(platform);
+ if (platform) {
+ this.openUpdatePlatformDialog(platform);
+ }
} else {
this.router.navigate(['.'], { relativeTo: this.route });
}
@@ -97,12 +103,10 @@ export class GfAdminPlatformComponent implements OnInit {
}
public ngOnInit() {
- this.deviceType = this.deviceDetectorService.getDeviceInfo().deviceType;
-
this.fetchPlatforms();
}
- public onDeletePlatform(aId: string) {
+ protected onDeletePlatform(aId: string) {
this.notificationService.confirm({
confirmFn: () => {
this.deletePlatform(aId);
@@ -112,7 +116,7 @@ export class GfAdminPlatformComponent implements OnInit {
});
}
- public onUpdatePlatform({ id }: Platform) {
+ protected onUpdatePlatform({ id }: Platform) {
this.router.navigate([], {
queryParams: { editPlatformDialog: true, platformId: id }
});
@@ -142,7 +146,7 @@ export class GfAdminPlatformComponent implements OnInit {
this.platforms = platforms;
this.dataSource = new MatTableDataSource(platforms);
- this.dataSource.sort = this.sort;
+ this.dataSource.sort = this.sort();
this.dataSource.sortingDataAccessor = get;
this.dataService.updateInfo();
@@ -156,15 +160,9 @@ export class GfAdminPlatformComponent implements OnInit {
GfCreateOrUpdatePlatformDialogComponent,
CreateOrUpdatePlatformDialogParams
>(GfCreateOrUpdatePlatformDialogComponent, {
- data: {
- platform: {
- id: null,
- name: null,
- url: null
- }
- },
- height: this.deviceType === 'mobile' ? '98vh' : undefined,
- width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+ data: {} satisfies CreateOrUpdatePlatformDialogParams,
+ height: this.deviceType() === 'mobile' ? '98vh' : undefined,
+ width: this.deviceType() === 'mobile' ? '100vw' : '50rem'
});
dialogRef
@@ -191,15 +189,7 @@ export class GfAdminPlatformComponent implements OnInit {
});
}
- private openUpdatePlatformDialog({
- id,
- name,
- url
- }: {
- id: string;
- name: string;
- url: string;
- }) {
+ private openUpdatePlatformDialog({ id, name, url }: Platform) {
const dialogRef = this.dialog.open<
GfCreateOrUpdatePlatformDialogComponent,
CreateOrUpdatePlatformDialogParams
@@ -210,9 +200,9 @@ export class GfAdminPlatformComponent implements OnInit {
name,
url
}
- },
- height: this.deviceType === 'mobile' ? '98vh' : undefined,
- width: this.deviceType === 'mobile' ? '100vw' : '50rem'
+ } satisfies CreateOrUpdatePlatformDialogParams,
+ height: this.deviceType() === 'mobile' ? '98vh' : undefined,
+ width: this.deviceType() === 'mobile' ? '100vw' : '50rem'
});
dialogRef
diff --git a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.component.ts b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.component.ts
index 0cfe026a4..b0364f1e3 100644
--- a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.component.ts
+++ b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.component.ts
@@ -46,8 +46,8 @@ export class GfCreateOrUpdatePlatformDialogComponent {
private formBuilder: FormBuilder
) {
this.platformForm = this.formBuilder.group({
- name: [this.data.platform.name, Validators.required],
- url: [this.data.platform.url ?? 'https://', Validators.required]
+ name: [this.data.platform?.name, Validators.required],
+ url: [this.data.platform?.url ?? 'https://', Validators.required]
});
}
@@ -62,7 +62,7 @@ export class GfCreateOrUpdatePlatformDialogComponent {
url: this.platformForm.get('url')?.value
};
- if (this.data.platform.id) {
+ if (this.data.platform?.id) {
(platform as UpdatePlatformDto).id = this.data.platform.id;
await validateObjectForForm({
classDto: UpdatePlatformDto,
diff --git a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
index 50193c2cc..f923b95a6 100644
--- a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
+++ b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
@@ -4,7 +4,7 @@
(keyup.enter)="platformForm.valid && onSubmit()"
(ngSubmit)="onSubmit()"
>
- @if (data.platform.id) {
+ @if (data.platform?.id) {
Update platform
} @else {
Add platform
diff --git a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/interfaces/interfaces.ts b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/interfaces/interfaces.ts
index be4af5407..d3b9ae528 100644
--- a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/interfaces/interfaces.ts
+++ b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/interfaces/interfaces.ts
@@ -1,5 +1,5 @@
import { Platform } from '@prisma/client';
export interface CreateOrUpdatePlatformDialogParams {
- platform: Platform;
+ platform?: Platform;
}