florian/codiki-hexagonal
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Fix page display after receiving data from backend.

Browse Source
This commit is contained in:
Florian THIERRY
2026-02-02 17:14:21 +01:00
parent 241f765648
commit bf7e755c28
2 changed files with 14 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/app/pages/publication/publication.component.html
View File

@@ -1,8 +1,8 @@
@if (isLoading) { @if (isLoading()) {
<h2 i18n>Publication content loading...</h2> <h2 i18n>Publication content loading...</h2>
<mat-spinner></mat-spinner> <mat-spinner></mat-spinner>
} @else { } @else {
@if (publication) { @if (publication(); as publication) {
<div class="card"> <div class="card">
<img src="/api/pictures/{{ publication.illustrationId }}" /> <img src="/api/pictures/{{ publication.illustrationId }}" />
<header> <header>

19
frontend/src/app/pages/publication/publication.component.ts
View File

@@ -1,5 +1,5 @@
import { CommonModule, Location } from '@angular/common'; import { CommonModule, Location } from '@angular/common';
import { Component, OnDestroy, OnInit, inject } from '@angular/core'; import {Component, OnDestroy, OnInit, inject, signal} from '@angular/core';
import { MatRippleModule } from '@angular/material/core'; import { MatRippleModule } from '@angular/material/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatIcon } from '@angular/material/icon'; import { MatIcon } from '@angular/material/icon';
@@ -37,9 +37,9 @@ export class PublicationComponent implements OnInit, OnDestroy {
private readonly snackBar = inject(MatSnackBar); private readonly snackBar = inject(MatSnackBar);
private paramMapSubscription?: Subscription; private paramMapSubscription?: Subscription;
private afterDialogCloseSubscription?: Subscription; private afterDialogCloseSubscription?: Subscription;
isLoading: boolean = false; isLoading = signal(false);
isAuthorAndUserEquals: boolean = false; isAuthorAndUserEquals: boolean = false;
publication?: Publication; publication = signal<Publication | null>(null);
ngOnInit(): void { ngOnInit(): void {
this.paramMapSubscription = this.activatedRoute this.paramMapSubscription = this.activatedRoute
@@ -48,12 +48,12 @@ export class PublicationComponent implements OnInit, OnDestroy {
const publicationId = params.get('publicationId'); const publicationId = params.get('publicationId');
if (publicationId) { if (publicationId) {
this.isLoading = true; this.isLoading.set(true);
this.publicationRestService.getById(publicationId) this.publicationRestService.getById(publicationId)
.then(publication => { .then(publication => {
this.publication = publication; this.publication.set(publication);
this.isAuthorAndUserEquals = this.authenticationService.getAuthenticatedUser()?.id === this.publication.author.id; this.isAuthorAndUserEquals = this.authenticationService.getAuthenticatedUser()?.id === this.publication()?.author.id;
setTimeout(() => Prism.highlightAll(), 100); setTimeout(() => Prism.highlightAll(), 100);
}) })
.catch(error => { .catch(error => {
@@ -62,7 +62,7 @@ export class PublicationComponent implements OnInit, OnDestroy {
console.error(errorMessage, error); console.error(errorMessage, error);
}) })
.finally(() => { .finally(() => {
this.isLoading = false; this.isLoading.set(false);
}); });
} }
}); });
@@ -86,8 +86,9 @@ export class PublicationComponent implements OnInit, OnDestroy {
this.afterDialogCloseSubscription = dialogRef.afterClosed() this.afterDialogCloseSubscription = dialogRef.afterClosed()
.subscribe(response => { .subscribe(response => {
if (response && this.publication?.id) { const publication = this.publication();
this.publicationRestService.delete(this.publication.id); if (response && publication?.id) {
this.publicationRestService.delete(publication.id);
this.snackBar.open($localize`Publication deleted`, $localize`Close`, { duration: 5000 }); this.snackBar.open($localize`Publication deleted`, $localize`Close`, { duration: 5000 });
this.location.back(); this.location.back();
} }