Add icon to Settlement items

CentreForDigitalHumanities · Jan 21, 2025 · 7d60bea · 7d60bea
1 parent 2d99fba
commit 7d60bea
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 11 deletions.
diff --git a/...data-entry/location-form/location-settlements-form/location-settlements-form.component.ts b/...data-entry/location-form/location-settlements-form/location-settlements-form.component.ts
@@ -22,6 +22,7 @@ import { FormControl, FormGroup } from "@angular/forms";
 import { formStatusSubject } from "../../shared/utils";
 import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
 import { MutationResult } from "apollo-angular";
+import { MultiselectOption } from "../../shared/multiselect/multiselect.component";
 
 type LocationSettlementsSpaceDescription = Required<
     Pick<DataEntryUpdateLocationMutationVariables["spaceData"], "settlements">
@@ -51,16 +52,18 @@ export class LocationSettlementsFormComponent implements OnInit, OnDestroy {
         share()
     );
 
-    public settlementOptions$ = this.settlementsQuery.fetch().pipe(
-        map((result) => result.data.settlements),
-        map((settlements) =>
-            settlements.map((settlement) => ({
-                value: settlement.id,
-                label: settlement.name,
-                dropdownLabel: this.formatDropdownLabel(settlement),
-            }))
-        )
-    );
+    public settlementOptions$: Observable<MultiselectOption[]> =
+        this.settlementsQuery.fetch().pipe(
+            map((result) => result.data.settlements),
+            map((settlements) =>
+                settlements.map((settlement) => ({
+                    value: settlement.id,
+                    label: settlement.name,
+                    icon: "city",
+                    dropdownLabel: this.formatDropdownLabel(settlement),
+                }))
+            )
+        );
 
     public form = new FormGroup<LocationSettlementsForm>({
         settlements: new FormControl<string[]>([], {

diff --git a/...p/data-entry/location-form/location-structures-form/location-structures-form.component.ts b/...p/data-entry/location-form/location-structures-form/location-structures-form.component.ts
@@ -23,6 +23,7 @@ import {
 } from "rxjs";
 import { FormService } from "../../shared/form.service";
 import { formStatusSubject } from "../../shared/utils";
+import { MultiselectOption } from "../../shared/multiselect/multiselect.component";
 
 type LocationStructuresSpaceDescription = Required<
     Pick<DataEntryUpdateLocationMutationVariables["spaceData"], "structures">
@@ -60,7 +61,7 @@ export class LocationStructuresFormComponent implements OnInit, OnDestroy {
         share()
     );
 
-    public structureOptions$ = this.structuresQuery.fetch().pipe(
+    public structureOptions$: Observable<MultiselectOption[]> = this.structuresQuery.fetch().pipe(
         map((result) => result.data.structures),
         map((structures) =>
             structures.map((structure) => ({

diff --git a/frontend/src/assets/icons/city.svg b/frontend/src/assets/icons/city.svg