Add publication edition form.

2024-08-04 15:54:00 +02:00
parent 42c4f76c0d
commit 32ab1d79c8
10 changed files with 4040 additions and 1978 deletions
--- a/frontend/src/app/pages/publication-edition/publication-edition.component.ts
+++ b/frontend/src/app/pages/publication-edition/publication-edition.component.ts
@@ -0,0 +1,88 @@
+import { CommonModule, Location } from '@angular/common';
+import { Component, inject, OnDestroy, OnInit } from '@angular/core';
+import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import { MatInputModule } from '@angular/material/input';
+import { MatProgressSpinner } from '@angular/material/progress-spinner';
+import { MatTabsModule } from '@angular/material/tabs';
+import { debounceTime, map, Observable, Subscription } from 'rxjs';
+import { Publication } from '../../core/rest-services/publications/model/publication';
+import { PublicationEditionService } from './publication-edition.service';
+
+@Component({
+  selector: 'app-publication-edition',
+  standalone: true,
+  imports: [ReactiveFormsModule, MatInputModule, MatProgressSpinner, MatTabsModule, CommonModule],
+  templateUrl: './publication-edition.component.html',
+  styleUrl: './publication-edition.component.scss',
+  providers: [PublicationEditionService]
+})
+export class PublicationEditionComponent implements OnInit, OnDestroy {
+  private formBuilder = inject(FormBuilder);
+  private location = inject(Location);
+  private publicationEditionService = inject(PublicationEditionService);
+
+  private subscriptions: Subscription[] = [];
+  publication!: Publication;
+  publicationEditionForm: FormGroup = this.formBuilder.group({
+    title: new FormControl<string | undefined>('', [Validators.required]),
+    description: new FormControl<string | undefined>('', [Validators.required]),
+    text: new FormControl<string | undefined>('', [Validators.required]),
+    illustrationId: new FormControl<string | undefined>('', [Validators.required]),
+    categoryId: new FormControl<string | undefined>('', [Validators.required])
+  });
+
+  get isLoading$(): Observable<boolean> {
+    return this.publicationEditionService.isLoading$;
+  }
+
+  ngOnInit(): void {
+    ['title', 'description', 'text'].forEach(fieldName => {
+      const fieldSubscription = this.publicationEditionForm.controls[fieldName].valueChanges
+        .pipe(
+          debounceTime(300),
+          map(value => value?.length ? value as string : '')
+        )
+        .subscribe(fieldValue => {
+          switch (fieldName) {
+            case 'title':
+              this.publicationEditionService.editTitle(fieldValue);
+              break;
+            case 'description':
+              this.publicationEditionService.editDescription(fieldValue);
+              break;
+            case 'text':
+              this.publicationEditionService.editText(fieldValue);
+              break;
+            default:
+              break;
+          }
+          this.publicationEditionService
+        });
+      this.subscriptions.push(fieldSubscription);
+    });
+
+    const publicationSubscription = this.publicationEditionService.publication$.subscribe(publication => {
+      this.publication = publication;
+      this.publicationEditionForm.controls['title'].setValue(publication.title, { emitEvent: false });
+      this.publicationEditionForm.controls['description'].setValue(publication.description, { emitEvent: false });
+      this.publicationEditionForm.controls['text'].setValue(publication.text, { emitEvent: false });
+      this.publicationEditionForm.controls['illustrationId'].setValue(publication.illustrationId, { emitEvent: false });
+      this.publicationEditionForm.controls['categoryId'].setValue(publication.categoryId, { emitEvent: false });
+    });
+    this.subscriptions.push(publicationSubscription);
+
+    this.publicationEditionService.loadPublication();
+  }
+
+  ngOnDestroy(): void {
+    this.subscriptions.forEach(subscription => subscription?.unsubscribe());
+  }
+
+  goPreviousLocation(): void {
+    this.location.back();
+  }
+
+  save(): void {
+
+  }
+}