Use signals in publication page.

This commit is contained in:
Florian THIERRY
2024-09-25 09:07:13 +02:00
parent cfa3015a7b
commit 7f2e762a44
3 changed files with 27 additions and 26 deletions
@@ -1,14 +1,18 @@
@if (isLoading) {
@if (isLoading()) {
<h2 i18n>Publication content loading...</h2>
<mat-spinner></mat-spinner>
} @else {
@if (publication) {
@if (isPublicationUndefined()) {
<div class="loading-failed">
<h1 i18n>Publication failed to load...</h1>
</div>
} @else {
<div class="card">
<img src="/api/pictures/{{ publication.illustrationId }}" />
<img src="/api/pictures/{{ publication()?.illustrationId }}" />
<header>
<h1>{{ publication.title }}</h1>
<h2>{{ publication.description }}</h2>
@if (isAuthorAndUserEquals) {
<h1>{{ publication()?.title }}</h1>
<h2>{{ publication()?.description }}</h2>
@if (isAuthorAndUserEquals()) {
<a [routerLink]="['edit']"
class="button action"
matTooltip="Click to edit the publication"
@@ -17,18 +21,18 @@
</a>
}
</header>
<main [innerHTML]="publication.parsedText"></main>
<main [innerHTML]="publication()?.parsedText"></main>
<footer>
<div class="metadata">
<img src="/api/pictures/{{ publication.author.image }}" [matTooltip]="publication.author.name" />
<img src="/api/pictures/{{ publication()?.author?.image }}" [matTooltip]="publication()?.author?.name" />
<div class="posting-data">
<span i18n>Publication posted by {{ publication.author.name }}</span>
<span i18n>Publication posted by {{ publication()?.author?.name }}</span>
<span class="publication-date">
({{ publication.creationDate | date: 'short' }})
({{ publication()?.creationDate | date: 'short' }})
</span>
</div>
</div>
@if (isAuthorAndUserEquals) {
@if (isAuthorAndUserEquals()) {
<button type="button"
(click)="deletePublication()"
matTooltip="Click to delete the publication"
@@ -40,9 +44,5 @@
}
</footer>
</div>
} @else {
<div class="loading-failed">
<h1 i18n>Publication failed to load...</h1>
</div>
}
}