Implementation of categoryId edition.

frontend/src/app/components/publication-edition/publication-edition.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule, Location } from "@angular/common";
-import { Component, EventEmitter, inject, Input, OnChanges, OnDestroy, Output } from "@angular/core";
+import { Component, EventEmitter, inject, Input, OnChanges, OnDestroy, OnInit, Output } from "@angular/core";
 import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms";
 import { MatDialogModule } from "@angular/material/dialog";
 import { MatIconModule } from "@angular/material/icon";
@@ -7,11 +7,14 @@ import { MatInputModule } from "@angular/material/input";
 import { MatProgressSpinnerModule } from "@angular/material/progress-spinner";
 import { MatTabsModule } from "@angular/material/tabs";
 import { MatTooltipModule } from "@angular/material/tooltip";
-import { map, Observable, of, Subscription } from "rxjs";
+import { filter, map, Observable, of, Subscription } from "rxjs";
 import { Publication } from "../../core/rest-services/publications/model/publication";
 import { PictureSelectionDialog } from "./picture-selection-dialog/picture-selection-dialog.component";
 import { SubmitButtonComponent } from "../submit-button/submit-button.component";
 import { PublicationEditionService } from "./publication-edition.service";
+import { MatSelectModule } from "@angular/material/select";
+import { CategoryService } from "../../core/service/category.service";
+import { Category } from "../../core/rest-services/category/model/category";
 
 @Component({
     selector: 'app-publication-edition',
@@ -24,6 +27,7 @@ import { PublicationEditionService } from "./publication-edition.service";
         MatIconModule,
         MatInputModule,
         MatProgressSpinnerModule,
+        MatSelectModule,
         MatTabsModule,
         MatTooltipModule,
         PictureSelectionDialog,
@@ -42,6 +46,7 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
     @Output()
     publicationSave = new EventEmitter<Publication>();
 
+    private readonly categoryService = inject(CategoryService);
     private readonly formBuilder = inject(FormBuilder);
     private readonly location = inject(Location);
     private readonly publicationEditionService = inject(PublicationEditionService);
@@ -64,6 +69,30 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
         return this.publicationEditionService.isPreviewing$;
     }
 
+    get categories$(): Observable<Category[]> {
+        return this.categoryService.categories$
+            .pipe(
+                map(categories =>
+                    categories.filter(category => category.subCategories.length == 0)
+                    .sort(this.byNameAscComparator())
+                )
+            );
+    }
+
+    private byNameAscComparator(): (categoryA: Category, categoryB: Category) => number {
+        return (categoryA, categoryB) => this.compareStrings(categoryA.name, categoryB.name);
+    }
+
+    private compareStrings(stringA: string, stringB: string): number {
+        if (stringA < stringB) {
+            return -1;
+        }
+        if (stringA > stringB) {
+            return 1;
+        }
+        return 0;
+    }
+
     ngOnChanges(): void {
         this.ngOnDestroy();
 
@@ -93,6 +122,12 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
             this.subscriptions.push(fieldSubscription);
         });
 
+        const categoryIdChangeSubscription = this.publicationEditionForm.controls['categoryId'].valueChanges
+            .subscribe(newCategoryId => {
+                this.publicationEditionService.editCategoryId(newCategoryId);
+            });
+        this.subscriptions.push(categoryIdChangeSubscription);
+
         const publicationSubscription = this.publicationEditionService.state$.subscribe(state => {
             this.publicationInEdition = state.publication;
             this.publicationEditionForm.controls['title'].setValue(this.publication.title, { emitEvent: false });