From 8252a8bc5e45e2ef4734beb06fd51e747982ce83 Mon Sep 17 00:00:00 2001 From: KenTandrian Date: Sun, 24 May 2026 11:03:33 +0700 Subject: [PATCH] feat(client): resolve errors --- ...reate-or-update-access-dialog.component.ts | 28 ++++++++++----- .../interfaces/interfaces.ts | 2 +- .../user-account-access.component.ts | 34 +++++++++---------- 3 files changed, 38 insertions(+), 26 deletions(-) diff --git a/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/create-or-update-access-dialog.component.ts b/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/create-or-update-access-dialog.component.ts index 97bd272d4..06fd8db2f 100644 --- a/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/create-or-update-access-dialog.component.ts +++ b/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/create-or-update-access-dialog.component.ts @@ -69,21 +69,25 @@ export class GfCreateOrUpdateAccessDialogComponent implements OnInit { private readonly notificationService = inject(NotificationService); public constructor() { - this.mode = this.data.access?.id ? 'update' : 'create'; + this.mode = this.data.access ? 'update' : 'create'; } public ngOnInit() { - const isPublic = this.data.access.type === 'PUBLIC'; + const access = this.data?.access; + const isPublic = access?.type === 'PUBLIC'; this.accessForm = this.formBuilder.group({ - alias: [this.data.access.alias], + alias: [access?.alias ?? ''], granteeUserId: [ - this.data.access.grantee, + access?.grantee ?? null, isPublic ? null : Validators.required ], - permissions: [this.data.access.permissions[0], Validators.required], + permissions: [ + access?.permissions[0] ?? 'READ_RESTRICTED', + Validators.required + ], type: [ - { disabled: this.mode === 'update', value: this.data.access.type }, + { disabled: this.mode === 'update', value: access?.type ?? 'PRIVATE' }, Validators.required ] }); @@ -100,7 +104,9 @@ export class GfCreateOrUpdateAccessDialogComponent implements OnInit { } else { granteeUserIdControl?.clearValidators(); granteeUserIdControl?.setValue(null); - permissionsControl?.setValue(this.data.access.permissions[0]); + permissionsControl?.setValue( + access?.permissions[0] ?? 'READ_RESTRICTED' + ); } granteeUserIdControl?.updateValueAndValidity(); @@ -158,10 +164,16 @@ export class GfCreateOrUpdateAccessDialogComponent implements OnInit { } private async updateAccess() { + const accessId = this.data.access?.id; + + if (!accessId) { + return; + } + const access: UpdateAccessDto = { alias: this.accessForm.get('alias')?.value, granteeUserId: this.accessForm.get('granteeUserId')?.value, - id: this.data.access.id, + id: accessId, permissions: [this.accessForm.get('permissions')?.value] }; diff --git a/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/interfaces/interfaces.ts b/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/interfaces/interfaces.ts index b7850fb38..8d1ac0ba9 100644 --- a/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/interfaces/interfaces.ts +++ b/apps/client/src/app/components/user-account-access/create-or-update-access-dialog/interfaces/interfaces.ts @@ -1,5 +1,5 @@ import { Access } from '@ghostfolio/common/interfaces'; export interface CreateOrUpdateAccessDialogParams { - access: Access; + access?: Access; } diff --git a/apps/client/src/app/components/user-account-access/user-account-access.component.ts b/apps/client/src/app/components/user-account-access/user-account-access.component.ts index e6686e80f..3ac0bd8ff 100644 --- a/apps/client/src/app/components/user-account-access/user-account-access.component.ts +++ b/apps/client/src/app/components/user-account-access/user-account-access.component.ts @@ -17,7 +17,12 @@ import { OnInit } from '@angular/core'; import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; -import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms'; +import { + FormControl, + FormGroup, + ReactiveFormsModule, + Validators +} from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; import { MatDialog, MatDialogModule } from '@angular/material/dialog'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -60,8 +65,11 @@ export class GfUserAccountAccessComponent implements OnInit { public hasPermissionToDeleteAccess: boolean; public hasPermissionToUpdateOwnAccessToken: boolean; public isAccessTokenHidden = true; - public updateOwnAccessTokenForm = this.formBuilder.group({ - accessToken: ['', Validators.required] + public updateOwnAccessTokenForm = new FormGroup({ + accessToken: new FormControl('', { + nonNullable: true, + validators: [Validators.required] + }) }); public user: User; @@ -71,7 +79,6 @@ export class GfUserAccountAccessComponent implements OnInit { private destroyRef: DestroyRef, private deviceDetectorService: DeviceDetectorService, private dialog: MatDialog, - private formBuilder: FormBuilder, private notificationService: NotificationService, private route: ActivatedRoute, private router: Router, @@ -144,7 +151,8 @@ export class GfUserAccountAccessComponent implements OnInit { confirmFn: () => { this.dataService .updateOwnAccessToken({ - accessToken: this.updateOwnAccessTokenForm.get('accessToken').value + accessToken: + this.updateOwnAccessTokenForm.controls.accessToken.value }) .pipe( catchError(() => { @@ -184,15 +192,7 @@ export class GfUserAccountAccessComponent implements OnInit { GfCreateOrUpdateAccessDialogComponent, CreateOrUpdateAccessDialogParams >(GfCreateOrUpdateAccessDialogComponent, { - data: { - access: { - alias: '', - grantee: null, - id: null, - permissions: ['READ_RESTRICTED'], - type: 'PRIVATE' - } - }, + data: {} satisfies CreateOrUpdateAccessDialogParams, height: this.deviceType === 'mobile' ? '98vh' : undefined, width: this.deviceType === 'mobile' ? '100vw' : '50rem' }); @@ -222,12 +222,12 @@ export class GfUserAccountAccessComponent implements OnInit { data: { access: { alias: access.alias, - grantee: access.grantee === 'Public' ? null : access.grantee, + grantee: access.grantee === 'Public' ? undefined : access.grantee, id: access.id, permissions: access.permissions, type: access.type } - }, + } satisfies CreateOrUpdateAccessDialogParams, height: this.deviceType === 'mobile' ? '98vh' : undefined, width: this.deviceType === 'mobile' ? '100vw' : '50rem' }); @@ -244,9 +244,9 @@ export class GfUserAccountAccessComponent implements OnInit { private update() { this.accessesGet = this.user.access.map(({ alias, id, permissions }) => { return { - alias, id, permissions, + alias: alias ?? '', grantee: $localize`Me`, type: 'PRIVATE' };