Fix/registration bugs

src/app/features/collections/components/collections-main-content/collections-main-content.component.html

@@ -31,9 +31,9 @@ <h3 class="highlight">{{ 'collections.searchResults.noResults' | translate }}</h
         </ng-template>
       </p-select>
     } @else {
-      <p-button severity="secondary" icon="fas fa-sliders" size="large" (click)="openFilters()"></p-button>
+      <p-button severity="secondary" icon="fas fa-sliders" class="btn-icon-only" (click)="openFilters()"></p-button>
 
-      <p-button severity="secondary" icon="fas fa-filter" size="large" (click)="openSorting()"></p-button>
+      <p-button severity="secondary" icon="fas fa-filter" class="btn-icon-only" (click)="openSorting()"></p-button>
     }
   </div>
 </div>

src/app/features/files/components/edit-file-metadata-dialog/edit-file-metadata-dialog.component.html

@@ -32,6 +32,7 @@
       [formControl]="resourceLanguageControl"
       [filter]="true"
       filterBy="name"
+      appendTo="body"
       [showClear]="true"
       [virtualScroll]="true"
       [virtualScrollItemSize]="35"

src/app/features/files/components/edit-file-metadata-dialog/edit-file-metadata-dialog.component.ts

@@ -1,7 +1,7 @@
 import { TranslatePipe } from '@ngx-translate/core';
 
 import { Button } from 'primeng/button';
-import { DynamicDialogRef } from 'primeng/dynamicdialog';
+import { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog';
 import { InputText } from 'primeng/inputtext';
 import { Select } from 'primeng/select';
 
@@ -10,7 +10,7 @@ import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 
 import { languageCodes, resourceTypes } from '@osf/shared/constants';
 
-import { PatchFileMetadata } from '../../models';
+import { OsfFileCustomMetadata, PatchFileMetadata } from '../../models';
 
 @Component({
   selector: 'osf-edit-file-metadata-dialog',
@@ -24,6 +24,7 @@ export class EditFileMetadataDialogComponent {
   readonly languages = languageCodes;
 
   private readonly dialogRef = inject(DynamicDialogRef);
+  readonly config = inject(DynamicDialogConfig);
 
   fileMetadataForm = new FormGroup({
     title: new FormControl<string | null>(null),
@@ -32,6 +33,17 @@ export class EditFileMetadataDialogComponent {
     resourceLanguage: new FormControl<string | null>(null),
   });
 
+  constructor() {
+    const fileMetadata = this.config.data as OsfFileCustomMetadata;
+
+    this.fileMetadataForm.patchValue({
+      title: fileMetadata.title,
+      description: fileMetadata.description,
+      resourceType: fileMetadata.resourceTypeGeneral,
+      resourceLanguage: fileMetadata.language,
+    });
+  }
+
   get titleControl(): FormControl<string | null> {
     return this.fileMetadataForm.get('title') as FormControl<string | null>;
   }

src/app/features/files/components/file-metadata/file-metadata.component.html

@@ -3,7 +3,7 @@
     <h2>{{ 'files.detail.fileMetadata.title' | translate }}</h2>
 
     <div class="flex gap-2">
-      <p-button severity="secondary" icon="fas fa-download" (click)="downloadFileMetadata()" />
+      <p-button severity="secondary" class="btn-icon-only" icon="fas fa-download" (click)="downloadFileMetadata()" />
 
       <p-button
         severity="secondary"
@@ -23,7 +23,9 @@ <h2>{{ 'files.detail.fileMetadata.title' | translate }}</h2>
       @if (fileMetadata()?.[field.key]) {
         <div class="flex flex-column gap-2">
           <h4>{{ field.label | translate }}</h4>
-          <p>{{ fileMetadata()?.[field.key] }}</p>
+          <p>
+            {{ field.key === 'language' ? getLanguageName(fileMetadata()?.[field.key]!) : fileMetadata()?.[field.key] }}
+          </p>
         </div>
       }
     }

src/app/features/files/components/file-metadata/file-metadata.component.ts

@@ -12,6 +12,9 @@ import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
 import { toSignal } from '@angular/core/rxjs-interop';
 import { ActivatedRoute } from '@angular/router';
 
+import { languageCodes } from '@osf/shared/constants';
+import { LanguageCodeModel } from '@osf/shared/models';
+
 import { FileMetadataFields } from '../../constants';
 import { PatchFileMetadata } from '../../models';
 import { FilesSelectors, SetFileMetadata } from '../../store';
@@ -36,6 +39,8 @@ export class FileMetadataComponent {
   fileMetadata = select(FilesSelectors.getFileCustomMetadata);
   isLoading = select(FilesSelectors.isFileMetadataLoading);
 
+  readonly languageCodes = languageCodes;
+
   readonly fileGuid = toSignal(this.route.params.pipe(map((params) => params['fileGuid'])) ?? of(undefined));
 
   metadataFields = FileMetadataFields;
@@ -54,6 +59,11 @@ export class FileMetadataComponent {
     }
   }
 
+  getLanguageName(languageCode: string): string {
+    const language = this.languageCodes.find((lang: LanguageCodeModel) => lang.code === languageCode);
+    return language ? language.name : languageCode;
+  }
+
   openEditFileMetadataDialog() {
     this.dialogService
       .open(EditFileMetadataDialogComponent, {
@@ -63,6 +73,7 @@ export class FileMetadataComponent {
         closeOnEscape: true,
         modal: true,
         closable: true,
+        data: this.fileMetadata(),
       })
       .onClose.pipe(filter((res: PatchFileMetadata) => !!res))
       .subscribe((res) => this.setFileMetadata(res));

src/app/features/files/pages/file-detail/file-detail.component.html

@@ -27,11 +27,23 @@
       }
 
       @if (file()?.links?.download) {
-        <p-button severity="secondary" icon="fas fa-download" (click)="downloadFile(file()?.links?.download!)" />
+        <p-button
+          severity="secondary"
+          class="btn-icon-only"
+          icon="fas fa-download"
+          [ariaLabel]="'common.buttons.download' | translate"
+          (click)="downloadFile(file()?.links?.download!)"
+        />
       }
       @if (file()?.links?.render) {
         <div class="relative">
-          <p-button severity="secondary" icon="fas fa-file-import" (click)="embedMenu.toggle($event)" />
+          <p-button
+            severity="secondary"
+            class="btn-icon-only"
+            icon="fas fa-file-import"
+            [ariaLabel]="'common.buttons.embed' | translate"
+            (click)="embedMenu.toggle($event)"
+          />
 
           <p-menu appendTo="body" [model]="embedItems" popup #embedMenu>
             <ng-template #item let-item>
@@ -42,7 +54,13 @@
       }
       @if (file()?.links?.html) {
         <div class="relative">
-          <p-button severity="secondary" icon="fas fa-share-nodes" (click)="shareMenu.toggle($event)" />
+          <p-button
+            severity="secondary"
+            class="btn-icon-only"
+            icon="fas fa-share-nodes"
+            [ariaLabel]="'common.buttons.share' | translate"
+            (click)="shareMenu.toggle($event)"
+          />
 
           <p-menu appendTo="body" [model]="shareItems" popup #shareMenu>
             <ng-template #item let-item>
@@ -52,7 +70,13 @@
         </div>
       }
       @if (file() && !isAnonymous()) {
-        <p-button severity="danger" icon="fas fa-trash" (click)="confirmDelete(file()!)" />
+        <p-button
+          severity="danger"
+          [ariaLabel]="'common.buttons.delete' | translate"
+          class="btn-icon-only"
+          icon="fas fa-trash"
+          (click)="confirmDelete(file()!)"
+        />
       }
     </div>
   </div>

src/app/features/metadata/components/metadata-description/metadata-description.component.html

@@ -11,5 +11,7 @@ <h2>{{ 'project.overview.metadata.description' | translate }}</h2>
     }
   </div>
 
-  <p class="mt-4">{{ description() || ('project.overview.metadata.noDescription' | translate) }}</p>
+  <p data-test-display-node-description class="mt-4">
+    {{ description() || ('project.overview.metadata.noDescription' | translate) }}
+  </p>
 </p-card>

src/app/features/metadata/components/metadata-funding/metadata-funding.component.html

@@ -14,10 +14,11 @@ <h2>{{ 'project.overview.metadata.fundingSupport' | translate }}</h2>
   @if (funders()?.length) {
     <div class="mt-4">
       @for (funder of funders(); track funder.funderIdentifier) {
-        <div class="mb-2 pb-3 border-bottom-1 surface-border flex flex-column gap-2">
+        <div class="surface-border flex flex-column gap-2" [ngClass]="{ 'mb-3 pb-3 border-bottom-1': !$last }">
           <p>{{ 'files.detail.resourceMetadata.fields.funder' | translate }}: {{ funder.funderName }}</p>
-
-          <p>{{ 'files.detail.resourceMetadata.fields.awardTitle' | translate }}: {{ funder.awardTitle }}</p>
+          @if (funder.awardTitle) {
+            <p>{{ 'files.detail.resourceMetadata.fields.awardTitle' | translate }}: {{ funder.awardTitle }}</p>
+          }
 
           @if (funder.awardUri) {
             <p>

src/app/features/metadata/components/metadata-funding/metadata-funding.component.ts

@@ -3,13 +3,14 @@ import { TranslatePipe } from '@ngx-translate/core';
 import { Button } from 'primeng/button';
 import { Card } from 'primeng/card';
 
+import { NgClass } from '@angular/common';
 import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';
 
 import { Funder } from '../../models';
 
 @Component({
   selector: 'osf-metadata-funding',
-  imports: [Button, Card, TranslatePipe],
+  imports: [NgClass, Button, Card, TranslatePipe],
   templateUrl: './metadata-funding.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })

src/app/features/metadata/dialogs/description-dialog/description-dialog.component.html

@@ -9,7 +9,17 @@
   ></textarea>
 
   <div class="flex justify-content-end gap-2">
-    <p-button severity="info" [label]="'common.buttons.cancel' | translate" (onClick)="cancel()" />
-    <p-button [label]="'common.buttons.save' | translate" [disabled]="descriptionControl.invalid" (onClick)="save()" />
+    <p-button
+      data-test-cancel-editing-node-description-button
+      severity="info"
+      [label]="'common.buttons.cancel' | translate"
+      (onClick)="cancel()"
+    />
+    <p-button
+      data-test-save-node-description-button
+      [label]="'common.buttons.save' | translate"
+      [disabled]="descriptionControl.invalid"
+      (onClick)="save()"
+    />
   </div>
 </form>

src/app/features/metadata/dialogs/funding-dialog/funding-dialog.component.html

@@ -47,7 +47,7 @@
           <input pInputText [id]="'awardNumber-' + $index" formControlName="awardNumber" class="w-full" />
         </div>
 
-        @if (fundingEntries.length > 1) {
+        @if (configFunders.length || fundingEntries.length > 1) {
           <div class="flex justify-content-end">
             <p-button
               severity="danger"
@@ -72,6 +72,11 @@
 
   <div class="flex justify-content-end gap-2">
     <p-button severity="info" [label]="'common.buttons.cancel' | translate" (onClick)="cancel()" />
-    <p-button type="submit" [label]="'common.buttons.save' | translate" [disabled]="fundingForm.invalid" />
+    <p-button
+      data-test-save-funding-metadata-button
+      type="submit"
+      [label]="'common.buttons.save' | translate"
+      [disabled]="fundingForm.invalid"
+    />
   </div>
 </form>

src/app/features/metadata/dialogs/funding-dialog/funding-dialog.component.ts

@@ -39,6 +39,8 @@ export class FundingDialogComponent implements OnInit {
 
   private searchSubject = new Subject<string>();
 
+  configFunders = this.config.data?.funders;
+
   constructor() {
     effect(() => {
       const funders = this.fundersList() || [];
@@ -66,9 +68,8 @@ export class FundingDialogComponent implements OnInit {
   ngOnInit(): void {
     this.actions.getFundersList();
 
-    const configFunders = this.config.data?.funders;
-    if (configFunders?.length > 0) {
-      configFunders.forEach((funder: Funder) => {
+    if (this.configFunders?.length > 0) {
+      this.configFunders.forEach((funder: Funder) => {
         this.addFundingEntry({
           funderName: funder.funderName || '',
           funderIdentifier: funder.funderIdentifier || '',
@@ -104,11 +105,10 @@ export class FundingDialogComponent implements OnInit {
       }),
       awardTitle: new FormControl(supplement?.title || supplement?.awardTitle || '', {
         nonNullable: true,
-        validators: [Validators.required],
       }),
       awardUri: new FormControl(supplement?.url || supplement?.awardUri || '', {
         nonNullable: true,
-        validators: [CustomValidators.linkValidator(), CustomValidators.requiredTrimmed()],
+        validators: [CustomValidators.linkValidator()],
       }),
       awardNumber: new FormControl(supplement?.awardNumber || '', {
         nonNullable: true,
@@ -124,6 +124,11 @@ export class FundingDialogComponent implements OnInit {
   removeFundingEntry(index: number): void {
     if (this.fundingEntries.length > 1) {
       this.fundingEntries.removeAt(index);
+    } else {
+      const result: FundingDialogResult = {
+        fundingEntries: [],
+      };
+      this.dialogRef.close(result);
     }
   }
 

src/app/features/metadata/dialogs/resource-information-dialog/resource-information-dialog.component.html

@@ -31,10 +31,12 @@
       optionValue="value"
       [placeholder]="'common.buttons.select' | translate"
       appendTo="body"
+      [virtualScroll]="true"
+      [virtualScrollItemSize]="35"
       class="w-full"
     >
       <ng-template #item let-option>
-        <span class="w-25rem">{{ option.label }}</span>
+        <span>{{ option.label }}</span>
       </ng-template>
     </p-select>
   </div>

src/styles/overrides/button.scss

@@ -31,7 +31,7 @@
 }
 
 .btn-icon-only .p-button {
-  padding: mix.rem(13px) mix.rem(20px);
+  padding: mix.rem(13px) mix.rem(21px);
 }
 
 .btn-full-width {