CenterForOpenScience · Vlad0n20 · Apr 30, 2026
diff --git a/src/app/features/collections/components/add-to-collection/add-to-collection.component.ts b/src/app/features/collections/components/add-to-collection/add-to-collection.component.ts
@@ -207,7 +207,7 @@ export class AddToCollectionComponent implements CanDeactivateComponent {
     const payload = {
       collectionId: this.primaryCollectionId() || '',
       projectId: this.selectedProject()?.id || '',
-      collectionMetadata: this.isCedarMode() ? {} : this.collectionMetadataForm.value || {},
+      collectionMetadata: this.collectionMetadataForm.value || {},
       userId: this.currentUser()?.id || '',
     };
 
@@ -234,15 +234,17 @@ export class AddToCollectionComponent implements CanDeactivateComponent {
           },
         });
     } else {
-      this.customDialogService
-        .open(AddToCollectionConfirmationDialogComponent, {
-          header: 'collections.addToCollection.confirmationDialogHeader',
-          width: '500px',
-          data: { payload, project: this.selectedProject() },
-        })
-        .onClose.pipe(
-          filter((res) => !!res),
-          switchMap(() => this.saveCedarRecordIfNeeded()),
+      this.saveCedarRecordIfNeeded()
+        .pipe(
+          switchMap(() =>
+            this.customDialogService
+              .open(AddToCollectionConfirmationDialogComponent, {
+                header: 'collections.addToCollection.confirmationDialogHeader',
+                width: '500px',
+                data: { payload, project: this.selectedProject() },
+              })
+              .onClose.pipe(filter((res) => !!res))
+          ),
           takeUntilDestroyed(this.destroyRef)
         )
         .subscribe({

diff --git a/...onents/add-to-collection/collection-metadata-step/collection-metadata-step.component.html b/...onents/add-to-collection/collection-metadata-step/collection-metadata-step.component.html
@@ -20,16 +20,16 @@ <h3>{{ 'collections.addToCollection.collectionMetadata' | translate }}</h3>
                   [instanceObject]="cedarFormData()"
                 ></cedar-artifact-viewer>
               }
-            } @else {
-              @for (filterEntry of availableFilterEntries(); track filterEntry.key) {
-                <div>
-                  <p class="font-bold">{{ filterEntry.labelKey | translate }}</p>
+            }
 
-                  <p class="mt-2">
-                    {{ collectionMetadataForm().get(filterEntry.key)?.value }}
-                  </p>
-                </div>
-              }
+            @for (filterEntry of availableFilterEntries(); track filterEntry.key) {
+              <div>
+                <p class="font-bold">{{ filterEntry.labelKey | translate }}</p>
+
+                <p class="mt-2">
+                  {{ collectionMetadataForm().get(filterEntry.key)?.value }}
+                </p>
+              </div>
             }
           }
 
@@ -46,6 +46,21 @@ <h3>{{ 'collections.addToCollection.collectionMetadata' | translate }}</h3>
 
   <p-step-panel [value]="targetStepValue()" class="p-0">
     <ng-template class="m-0" #content let-activateCallback="activateCallback">
+      <form [formGroup]="collectionMetadataForm()" class="grid row-gap-2 mt-3">
+        @for (filterEntry of availableFilterEntries(); track filterEntry.key) {
+          <div class="flex flex-column gap-1 col-12 md:col-6">
+            <label [for]="filterEntry.key">{{ filterEntry.labelKey | translate }}</label>
+            <p-select
+              [id]="filterEntry.key"
+              [options]="filterEntry.options"
+              [formControlName]="filterEntry.key"
+              [placeholder]="filterEntry.labelKey | translate"
+              appendTo="body"
+            ></p-select>
+          </div>
+        }
+      </form>
+
       @if (isCedarMode()) {
         @if (cedarTemplate()) {
           <div class="cedar-editor-container mt-3">
@@ -65,27 +80,16 @@ <h3>{{ 'collections.addToCollection.collectionMetadata' | translate }}</h3>
               [label]="'common.buttons.discardChanges' | translate"
               (onClick)="handleDiscardChanges()"
             />
-            <p-button [label]="'common.buttons.saveAndContinue' | translate" (onClick)="handleSaveCedarMetadata()" />
+            <p-button
+              [label]="'common.buttons.saveAndContinue' | translate"
+              [disabled]="!collectionMetadataForm().valid"
+              (onClick)="handleSaveCedarMetadata()"
+            />
           </div>
         } @else {
           <p class="mt-3">{{ 'collections.addToCollection.cedarFormNotAvailable' | translate }}</p>
         }
       } @else {
-        <form [formGroup]="collectionMetadataForm()" class="grid row-gap-2 mt-3">
-          @for (filterEntry of availableFilterEntries(); track filterEntry.key) {
-            <div class="flex flex-column gap-1 col-12 md:col-6">
-              <label [for]="filterEntry.key">{{ filterEntry.labelKey | translate }}</label>
-              <p-select
-                [id]="filterEntry.key"
-                [options]="filterEntry.options"
-                [formControlName]="filterEntry.key"
-                [placeholder]="filterEntry.labelKey | translate"
-                appendTo="body"
-              ></p-select>
-            </div>
-          }
-        </form>
-
         <div class="flex justify-content-end gap-3 mt-4">
           <p-button
             severity="info"

diff --git a/...mponents/add-to-collection/collection-metadata-step/collection-metadata-step.component.ts b/...mponents/add-to-collection/collection-metadata-step/collection-metadata-step.component.ts
@@ -149,6 +149,7 @@ export class CollectionMetadataStepComponent {
     };
 
     this.collectionMetadataSaved.set(true);
+    this.metadataSaved.emit(this.collectionMetadataForm());
     this.cedarDataSaved.emit(cedarData);
     this.stepChange.emit(AddToCollectionSteps.Complete);
   }
@@ -207,7 +208,7 @@ export class CollectionMetadataStepComponent {
 
     effect(() => {
       const filterEntries = this.availableFilterEntries();
-      if (filterEntries.length && !this.isCedarMode()) {
+      if (filterEntries.length) {
         this.buildCollectionMetadataForm();
       }
     });
@@ -223,8 +224,7 @@ export class CollectionMetadataStepComponent {
         form.controls &&
         Object.keys(form.controls).length > 0 &&
         filterEntries.length > 0 &&
-        !alreadyPopulated &&
-        !this.isCedarMode()
+        !alreadyPopulated
       ) {
         this.populateFormFromSubmission(submission.submission);
         this.formPopulatedFromSubmission.set(true);
@@ -233,10 +233,8 @@ export class CollectionMetadataStepComponent {
 
     effect(() => {
       if (!this.collectionMetadataSaved() && this.stepperActiveValue() !== AddToCollectionSteps.CollectionMetadata) {
-        if (!this.isCedarMode()) {
-          this.collectionMetadataForm().reset();
-          this.formPopulatedFromSubmission.set(false);
-        }
+        this.collectionMetadataForm().reset();
+        this.formPopulatedFromSubmission.set(false);
       }
     });
   }

diff --git a/src/app/shared/mappers/collections/collections.mapper.ts b/src/app/shared/mappers/collections/collections.mapper.ts
@@ -71,7 +71,7 @@ export class CollectionsMapper {
             backgroundColor: response.embeds.brand.data.attributes.background_color,
           }
         : null,
-      requiredMetadataTemplate: response.embeds.required_metadata_template?.data ?? null,
+      requiredMetadataTemplate: null,
     };
   }
 

diff --git a/src/app/shared/models/collections/collections-json-api.model.ts b/src/app/shared/models/collections/collections-json-api.model.ts
@@ -1,4 +1,3 @@
-import { CedarMetadataDataTemplateJsonApi } from '@osf/features/metadata/models';
 import { CollectionSubmissionReviewState } from '@osf/shared/enums/collection-submission-review-state.enum';
 
 import { BrandDataJsonApi } from '../brand/brand.json-api.model';
@@ -15,9 +14,6 @@ export interface CollectionProviderResponseJsonApi {
     brand: {
       data?: BrandDataJsonApi;
     };
-    required_metadata_template?: {
-      data?: CedarMetadataDataTemplateJsonApi | null;
-    };
   };
   relationships: {
     primary_collection: {
@@ -26,6 +22,12 @@ export interface CollectionProviderResponseJsonApi {
         type: string;
       };
     };
+    required_metadata_template?: {
+      data?: {
+        id: string;
+        type: string;
+      } | null;
+    };
   };
 }
 

diff --git a/src/app/shared/services/collections.service.ts b/src/app/shared/services/collections.service.ts
@@ -41,13 +41,15 @@ import { ReviewActionPayloadJsonApi } from '../models/review-action/review-actio
 import { SetTotalSubmissions } from '../stores/collections/collections.actions';
 
 import { JsonApiService } from './json-api.service';
+import { MetadataService } from './metadata.service';
 
 @Injectable({
   providedIn: 'root',
 })
 export class CollectionsService {
   private readonly jsonApiService = inject(JsonApiService);
   private readonly environment = inject(ENVIRONMENT);
+  private readonly metadataService = inject(MetadataService);
 
   get apiUrl() {
     return `${this.environment.apiDomainUrl}/v2`;
@@ -56,11 +58,22 @@ export class CollectionsService {
   private actions = createDispatchMap({ setTotalSubmissions: SetTotalSubmissions });
 
   getCollectionProvider(collectionName: string): Observable<CollectionProvider> {
-    const url = `${this.apiUrl}/providers/collections/${collectionName}/?embed=brand,required_metadata_template`;
+    const url = `${this.apiUrl}/providers/collections/${collectionName}/?embed=brand`;
 
-    return this.jsonApiService
-      .get<JsonApiResponse<CollectionProviderResponseJsonApi, null>>(url)
-      .pipe(map((response) => CollectionsMapper.fromGetCollectionProviderResponse(response.data)));
+    return this.jsonApiService.get<JsonApiResponse<CollectionProviderResponseJsonApi, null>>(url).pipe(
+      switchMap((response) => {
+        const provider = CollectionsMapper.fromGetCollectionProviderResponse(response.data);
+        const templateId = response.data.relationships.required_metadata_template?.data?.id;
+
+        if (!templateId) {
+          return of(provider);
+        }
+
+        return this.metadataService
+          .getCedarMetadataTemplateDetail(templateId)
+          .pipe(map((template) => ({ ...provider, requiredMetadataTemplate: template })));
+      })
+    );
   }
 
   getCollectionDetails(collectionId: string): Observable<CollectionDetails> {

diff --git a/src/app/shared/services/metadata.service.ts b/src/app/shared/services/metadata.service.ts
@@ -6,6 +6,7 @@ import { inject, Injectable } from '@angular/core';
 import { ENVIRONMENT } from '@core/provider/environment.provider';
 import { CedarRecordsMapper, MetadataMapper, RorMapper } from '@osf/features/metadata/mappers';
 import {
+  CedarMetadataDataTemplateJsonApi,
   CedarMetadataRecord,
   CedarMetadataRecordJsonApi,
   CedarMetadataTemplateJsonApi,
@@ -102,6 +103,12 @@ export class MetadataService {
     );
   }
 
+  getCedarMetadataTemplateDetail(templateId: string): Observable<CedarMetadataDataTemplateJsonApi> {
+    return this.jsonApiService
+      .get<{ data: CedarMetadataDataTemplateJsonApi }>(`${this.apiDomainUrl}/_/cedar_metadata_templates/${templateId}/`)
+      .pipe(map((response) => response.data));
+  }
+
   getMetadataCedarRecords(
     resourceId: string,
     resourceType: ResourceType,
-Original file line number
+Diff line change
@@ Expand Up / @@ -71,7 +71,7 @@ export class CollectionsMapper { @@
                 backgroundColor: response.embeds.brand.data.attributes.background_color,
               }
             : null,
-          requiredMetadataTemplate: response.embeds.required_metadata_template?.data ?? null,
+          requiredMetadataTemplate: null,
         };
       }
@@ Expand Down @@