[Fix] metadata updates after testing

src/app/components/index.ts

@@ -1,5 +1,5 @@
 export { ActionbarComponent } from './actionbar/actionbar.component';
-export { AuthDialogComponent } from './auth-dialog/auth-dialog.component';
+export { AuthDialogComponent } from '../dialogs/auth-dialog/auth-dialog.component';
 export { CompilationDetailComponent } from './compilation-detail/compilation-detail.component';
 export { DetailEntityComponent } from './entity-detail/detail-entity/detail-entity.component';
 export { EntityDetailComponent } from './entity-detail/entity-detail.component';

src/app/components/metadata/agents/agents.component.html

@@ -242,7 +242,7 @@
 
 <p class="sub-headers">{{ 'Assigned role(s)' | translate }}</p>
 <div class="role-selection">
-  @for (role of availableRoles; track role) {
+  @for (role of availableRoles(); track role) {
     <mat-checkbox color="primary" [(ngModel)]="role.checked">
       {{ role.value }}
     </mat-checkbox>

src/app/components/metadata/agents/agents.component.ts

@@ -9,7 +9,6 @@ import {
   signal,
   SimpleChanges,
   viewChild,
-  ViewChild,
 } from '@angular/core';
 import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
 
@@ -26,7 +25,7 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatInputModule } from '@angular/material/input';
 import { MatTabChangeEvent, MatTabGroup, MatTabsModule } from '@angular/material/tabs';
 
-import { Address, AnyEntity, ContactReference, Institution, Person, Tag } from 'src/app/metadata';
+import { Address, AnyEntity, ContactReference, Institution, Person } from 'src/app/metadata';
 import { TranslatePipe } from '../../../pipes/translate.pipe';
 
 import {
@@ -44,7 +43,6 @@ import { AccountService, BackendService } from 'src/app/services';
 import { MetadataCommunicationService } from 'src/app/services/metadata-communication.service';
 import { AgentListComponent } from './agent-list/agent-list.component';
 import {
-  Collection,
   IInstitution,
   IPerson,
   isAddress,
@@ -284,10 +282,10 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
 
   selectedTabIndex = 0;
 
-  availableRoles = [
+  availableRoles = signal([
     { type: 'RIGHTS_OWNER', value: 'Rightsowner', checked: false },
     { type: 'CONTACT_PERSON', value: 'Contact person', checked: false },
-  ];
+  ]);
 
   newCustomRole = { value: '', checked: false };
 
@@ -323,7 +321,7 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
 
   get atLeastOneRoleSelected(): boolean {
     return (
-      this.availableRoles.some(role => role.checked) ||
+      this.availableRoles().some(role => role.checked) ||
       (this.newCustomRole.checked && this.newCustomRole.value != '')
     );
   }
@@ -333,7 +331,7 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
   }
 
   get currentRoleSelection(): string[] {
-    const availableRoleTypes = this.availableRoles
+    const availableRoleTypes = this.availableRoles()
       .filter(role => role.checked)
       .map(role => role.type);
 
@@ -422,11 +420,13 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
     if (this.isUpdating()) {
       this.clearRoleSelection();
 
-      for (const role of agent.roles[this.entityId()] ?? []) {
-        for (const roleOption of this.availableRoles) {
-          if (roleOption.type === role) roleOption.checked = true;
-        }
-      }
+      const rolesToActivate = agent.roles[this.entityId()] ?? [];
+
+      this.availableRoles.update(roles =>
+        roles.map(role =>
+          rolesToActivate.includes(role.type) ? { ...role, checked: true } : role,
+        ),
+      );
     }
   }
 
@@ -511,13 +511,13 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
   private addRoleIfNotExists(newRoleName: string) {
     const entity = this.entity();
     const cleanedUpRoleName = entity.formatRoleLabel(newRoleName);
-    if (!cleanedUpRoleName || this.availableRoles.some(r => r.value === cleanedUpRoleName)) return;
+    if (!cleanedUpRoleName || this.availableRoles().some(r => r.value === cleanedUpRoleName))
+      return;
 
-    this.availableRoles.push({
-      type: cleanedUpRoleName,
-      value: cleanedUpRoleName,
-      checked: false,
-    });
+    this.availableRoles.update(roles => [
+      ...roles,
+      { type: cleanedUpRoleName, value: cleanedUpRoleName, checked: false },
+    ]);
   }
 
   public updateAgent() {
@@ -592,9 +592,7 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
   }
 
   clearRoleSelection() {
-    this.availableRoles.forEach(role => {
-      role.checked = false;
-    });
+    this.availableRoles.update(roles => roles.map(role => ({ ...role, checked: false })));
     this.newCustomRole = { value: '', checked: false };
   }
 
@@ -615,7 +613,7 @@ export class AgentsComponent implements OnDestroy, OnChanges, OnInit {
   }
 
   ngOnInit(): void {
-    const fixedRoles = this.availableRoles.map(r => r.type);
+    const fixedRoles = this.availableRoles().map(r => r.type);
     const allAgents = [...this.entity().persons, ...this.entity().institutions];
 
     for (const agent of allAgents) {

src/app/components/metadata/optional/creation/creation.component.html

@@ -37,7 +37,7 @@
     <button
       mat-flat-button
       color="primary"
-      [disabled]="!isFormValid"
+      [disabled]="!isFormValid()"
       (click)="addNewCreationData()"
     >
       {{ 'Add' | translate }}

src/app/components/metadata/optional/creation/creation.component.ts

@@ -54,6 +54,7 @@ export class CreationComponent implements OnInit {
 
   addNewCreationData() {
     const value = this.form.value;
+    if (!this.isFormValid()) return;
 
     let formattedDate = '';
     if (value.start && value.end) {

src/app/components/metadata/optional/optional-card-list/optional-card-list.component.html

@@ -1,7 +1,7 @@
 <div>
   @for (data of optionalData(); track $index) {
     <div class="card-wrapper">
-      <div class="card">
+      <div class="card" [class.is-editable]="propertyType() === 'biblio'">
         @switch (propertyType()) {
           @case ('dimension') {
             @if (data | isDimensionTuple) {

src/app/components/metadata/optional/optional-card-list/optional-card-list.component.scss

@@ -3,6 +3,11 @@
   border-radius: 1rem !important;
   justify-items: center;
   justify-content: center;
+  padding-right: 45px;
+}
+
+.card.is-editable {
+  padding-right: 90px;
 }
 
 div.card .actions {