fix: small Admin UI improvements (#2133)

Aam-Digital · Dec 18, 2023 · 8621859 · 8621859
1 parent b449802
commit 8621859
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 34 deletions.
diff --git a/src/app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.html b/src/app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.html
@@ -25,12 +25,7 @@
           cdkDrag
           cdkDragBoundary=".overall-container"
         >
-          <fa-icon
-            icon="grip-vertical"
-            size="xl"
-            class="drag-handle"
-            cdkDragHandle
-          ></fa-icon>
+          <fa-icon icon="grip-vertical" size="xl" class="drag-handle"></fa-icon>
 
           <button
             mat-stroked-button
@@ -95,12 +90,7 @@
         cdkDrag
         cdkDragBoundary="mat-drawer-container"
       >
-        <fa-icon
-          icon="grip-vertical"
-          size="xl"
-          class="drag-handle"
-          cdkDragHandle
-        ></fa-icon>
+        <fa-icon icon="grip-vertical" size="xl" class="drag-handle"></fa-icon>
 
         <div>
           <app-entity-field-label

diff --git a/src/app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.scss b/src/app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.scss
@@ -54,6 +54,7 @@ $toolbar-width: 300px;
   border-color: green;
   background-color: rgba(0, 255, 0, 0.05);
   font-style: italic;
+  cursor: move;
 }
 
 .drag-handle {

diff --git a/...app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.spec.ts b/...app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.spec.ts
@@ -87,6 +87,7 @@ describe("AdminEntityFormComponent", () => {
 
     const noteUserFacingFields = Array.from(Note.schema.entries())
       .filter(([key, value]) => value.label)
+      .sort(([aId, a], [bId, b]) => a.label.localeCompare(b.label))
       .map(([key]) => key);
     expect(component.availableFields).toEqual([
       component.createNewFieldPlaceholder,

diff --git a/src/app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.ts b/src/app/core/admin/admin-entity-details/admin-entity-form/admin-entity-form.component.ts
@@ -72,7 +72,10 @@ export class AdminEntityFormComponent implements OnChanges {
   ) {
     adminEntityService.entitySchemaUpdated
       .pipe(untilDestroyed(this))
-      .subscribe(() => this.initForm());
+      .subscribe(() => {
+        this.availableFields = []; // force re-init of the label components that otherwise do not detect the change
+        setTimeout(() => this.initForm());
+      });
   }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -111,6 +114,7 @@ export class AdminEntityFormComponent implements OnChanges {
           ),
       )
       .filter(([key, value]) => value.label) // no technical, internal fields
+      .sort(([aId, a], [bId, b]) => a.label.localeCompare(b.label))
       .map(([key]) => key);
 
     this.availableFields = [this.createNewFieldPlaceholder, ...unusedFields];
@@ -157,9 +161,9 @@ export class AdminEntityFormComponent implements OnChanges {
       );
     }
 
-    if (newFieldsArray === this.availableFields && event.currentIndex === 0) {
-      // ensure "create new field" is always first
-      moveItemInArray(newFieldsArray, event.currentIndex, 1);
+    if (newFieldsArray === this.availableFields) {
+      // ensure available fields have consistent order
+      this.initAvailableFields();
     }
   }
 
@@ -198,6 +202,6 @@ export class AdminEntityFormComponent implements OnChanges {
 
   removeGroup(i: number) {
     const [removedFieldGroup] = this.config.fieldGroups.splice(i, 1);
-    this.availableFields.push(...removedFieldGroup.fields);
+    this.initAvailableFields();
   }
 }
diff --git a/src/app/core/admin/admin-entity-details/admin-entity/admin-entity-details.component.ts b/src/app/core/admin/admin-entity-details/admin-entity/admin-entity-details.component.ts
@@ -102,8 +102,7 @@ export class AdminEntityDetailsComponent implements OnInit {
 
     await this.entityMapper.save(newConfig);
     this.entityActionsService.showSnackbarConfirmationWithUndo(
-      newConfig,
-      $localize`:Save config confirmation message:updated`,
+      $localize`:Save config confirmation message:Configuration updated`,
       [originalConfig],
     );
 

diff --git a/src/app/core/entity/entity-actions/entity-actions.service.ts b/src/app/core/entity/entity-actions/entity-actions.service.ts
@@ -27,17 +27,12 @@ export class EntityActionsService {
   ) {}
 
   showSnackbarConfirmationWithUndo(
-    entity: Entity,
-    action: string,
+    message: string,
     previousEntitiesForUndo: Entity[],
     navigateBackToUrl?: string,
   ) {
-    const snackBarTitle = $localize`:Entity action confirmation message:${
-      entity.getConstructor().label
-    } "${entity.toString()}" ${action}`;
-
     const snackBarRef = this.snackBar.open(
-      snackBarTitle,
+      message,
       $localize`:Undo an entity action:Undo`,
       {
         duration: 8000,
@@ -110,8 +105,9 @@ export class EntityActionsService {
     }
 
     this.showSnackbarConfirmationWithUndo(
-      result.originalEntitiesBeforeChange[0],
-      $localize`:Entity action confirmation message verb:Deleted`,
+      $localize`:Entity action confirmation message:${
+        result.originalEntitiesBeforeChange[0].getConstructor().label
+      } "${result.originalEntitiesBeforeChange[0].toString()}" deleted`,
       result.originalEntitiesBeforeChange,
       currentUrl,
     );
@@ -159,8 +155,9 @@ export class EntityActionsService {
     }
 
     this.showSnackbarConfirmationWithUndo(
-      result.originalEntitiesBeforeChange[0],
-      $localize`:Entity action confirmation message verb:Anonymized`,
+      $localize`:Entity action confirmation message:${
+        result.originalEntitiesBeforeChange[0].getConstructor().label
+      } "${result.originalEntitiesBeforeChange[0].toString()}" anonymized`,
       result.originalEntitiesBeforeChange,
     );
     return true;
@@ -177,8 +174,9 @@ export class EntityActionsService {
     await this.entityMapper.save(entity);
 
     this.showSnackbarConfirmationWithUndo(
-      originalEntity,
-      $localize`:Entity action confirmation message verb:Archived`,
+      $localize`:Entity action confirmation message:${
+        originalEntity.getConstructor().label
+      } "${originalEntity.toString()}" archived`,
       [originalEntity],
     );
     return true;
@@ -193,8 +191,9 @@ export class EntityActionsService {
     await this.entityMapper.save(entity);
 
     this.showSnackbarConfirmationWithUndo(
-      originalEntity,
-      $localize`:Entity action confirmation message verb:Reactivated`,
+      $localize`:Entity action confirmation message:${
+        originalEntity.getConstructor().label
+      } "${originalEntity.toString()}" reactivated`,
       [originalEntity],
     );
     return true;