feat(es2): Add waffle flags; revert changes and use cedar editor

Author: adlius

src/app/features/collections/components/add-to-collection/add-to-collection.component.ts

@@ -43,6 +43,7 @@ import { LoaderService } from '@osf/shared/services/loader.service';
 import { ToastService } from '@osf/shared/services/toast.service';
 import { CollectionsSelectors, GetCollectionProvider } from '@osf/shared/stores/collections';
 import { ProjectsSelectors, SetSelectedProject } from '@osf/shared/stores/projects';
+import { COLLECTION_SUBMISSION_WITH_CEDAR } from '@shared/constants/feature-flags.const';
 
 import { AddToCollectionSteps } from '../../enums';
 import { RemoveCollectionSubmissionPayload } from '../../models/remove-collection-submission-payload.model';
@@ -105,6 +106,7 @@ export class AddToCollectionComponent implements CanDeactivateComponent {
   requiredMetadataTemplate = select(CollectionsSelectors.getRequiredMetadataTemplate);
   selectedProject = select(ProjectsSelectors.getSelectedProject);
   currentUser = select(UserSelectors.getCurrentUser);
+  activeFlags = select(UserSelectors.getActiveFlags);
   currentCollectionSubmission = select(AddToCollectionSelectors.getCurrentCollectionSubmission);
   cedarRecords = select(MetadataSelectors.getCedarRecords);
 
@@ -123,7 +125,9 @@ export class AddToCollectionComponent implements CanDeactivateComponent {
   isCollectionMetadataDisabled = computed(
     () => !this.selectedProject() || !this.projectMetadataSaved() || !this.projectContributorsSaved()
   );
-  isCedarMode = computed(() => this.environment.collectionSubmissionWithCedar && !!this.requiredMetadataTemplate());
+  isCedarMode = computed(
+    () => this.activeFlags().includes(COLLECTION_SUBMISSION_WITH_CEDAR) && !!this.requiredMetadataTemplate()
+  );
   existingCedarRecord = computed<CedarMetadataRecordData | null>(() => {
     const records = this.cedarRecords();
     const templateId = this.requiredMetadataTemplate()?.id;

src/app/features/collections/components/collections-discover/collections-discover.component.html

@@ -37,7 +37,7 @@ <h1 class="collections-heading flex align-items-center">{{ collectionProvider()?
     </div>
 
     <div class="content-container flex-1">
-      @if (useShareTroveSearch) {
+      @if (useShareTroveSearch()) {
         @if (defaultSearchFiltersInitialized()) {
           <osf-global-search [searchControlInput]="searchControl" />
         }

src/app/features/collections/components/collections-discover/collections-discover.component.spec.ts

@@ -8,6 +8,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ActivatedRoute } from '@angular/router';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
+import { UserSelectors } from '@core/store/user';
 import { GlobalSearchComponent } from '@osf/shared/components/global-search/global-search.component';
 import { LoadingSpinnerComponent } from '@osf/shared/components/loading-spinner/loading-spinner.component';
 import { SearchInputComponent } from '@osf/shared/components/search-input/search-input.component';
@@ -99,6 +100,10 @@ function setup(options: SetupOptions = {}) {
           { selector: CollectionsSelectors.getSearchText, value: '' },
           { selector: CollectionsSelectors.getPageNumber, value: '1' },
           { selector: CollectionsSelectors.getCollectionProviderLoading, value: false },
+          {
+            selector: UserSelectors.getActiveFlags,
+            value: collectionSubmissionWithCedar ? ['collection_submission_with_cedar'] : [],
+          },
         ],
       }),
     ],
@@ -130,7 +135,7 @@ describe('CollectionsDiscoverComponent', () => {
     });
 
     it('should set useShareTroveSearch to false', () => {
-      expect(component.useShareTroveSearch).toBe(false);
+      expect(component.useShareTroveSearch()).toBe(false);
     });
 
     it('should initialize with default values', () => {
@@ -199,7 +204,7 @@ describe('CollectionsDiscoverComponent', () => {
   describe('shtrove mode (collectionSubmissionWithCedar = true)', () => {
     it('should set useShareTroveSearch to true', () => {
       const { component } = setup({ collectionSubmissionWithCedar: true });
-      expect(component.useShareTroveSearch).toBe(true);
+      expect(component.useShareTroveSearch()).toBe(true);
     });
 
     it('should initialize default search filters', () => {

src/app/features/collections/components/collections-discover/collections-discover.component.ts

@@ -22,6 +22,7 @@ import { FormControl } from '@angular/forms';
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
+import { UserSelectors } from '@core/store/user';
 import { GlobalSearchComponent } from '@osf/shared/components/global-search/global-search.component';
 import { LoadingSpinnerComponent } from '@osf/shared/components/loading-spinner/loading-spinner.component';
 import { SearchInputComponent } from '@osf/shared/components/search-input/search-input.component';
@@ -41,6 +42,7 @@ import {
   SetSearchValue,
 } from '@osf/shared/stores/collections';
 import { ResetSearchState, SetDefaultFilterValue, SetExtraFilters } from '@osf/shared/stores/global-search';
+import { COLLECTION_SUBMISSION_WITH_CEDAR } from '@shared/constants/feature-flags.const';
 
 import { CollectionsQuerySyncService } from '../../services';
 import { CollectionsHelpDialogComponent } from '../collections-help-dialog/collections-help-dialog.component';
@@ -78,7 +80,8 @@ export class CollectionsDiscoverComponent {
   providerId = signal<string>('');
   defaultSearchFiltersInitialized = signal(false);
 
-  readonly useShareTroveSearch = this.environment.collectionSubmissionWithCedar;
+  activeFlags = select(UserSelectors.getActiveFlags);
+  readonly useShareTroveSearch = computed(() => this.activeFlags().includes(COLLECTION_SUBMISSION_WITH_CEDAR));
 
   collectionProvider = select(CollectionsSelectors.getCollectionProvider);
   collectionDetails = select(CollectionsSelectors.getCollectionDetails);
@@ -106,20 +109,16 @@ export class CollectionsDiscoverComponent {
   constructor() {
     this.initializeProvider();
     this.setupBrandingEffect();
-
-    if (this.useShareTroveSearch) {
-      this.setupShareTroveSearchEffect();
-    } else {
-      this.setupCollectionDetailsEffect();
-      this.setupUrlSyncEffect();
-      this.setupLegacySearchEffect();
-      this.setupSearchBinding();
-    }
+    this.setupShareTroveSearchEffect();
+    this.setupCollectionDetailsEffect();
+    this.setupUrlSyncEffect();
+    this.setupLegacySearchEffect();
+    this.setupSearchBinding();
 
     this.destroyRef.onDestroy(() => {
       if (this.isBrowser) {
         this.actions.clearCollections();
-        if (this.useShareTroveSearch) {
+        if (this.useShareTroveSearch()) {
           this.actions.resetSearchState();
         }
         this.headerStyleHelper.resetToDefaults();
@@ -133,7 +132,7 @@ export class CollectionsDiscoverComponent {
   }
 
   onSearchTriggered(searchValue: string): void {
-    if (!this.useShareTroveSearch) {
+    if (!this.useShareTroveSearch()) {
       this.actions.setSearchValue(searchValue);
       this.actions.setPageNumber('1');
     }
@@ -166,7 +165,7 @@ export class CollectionsDiscoverComponent {
       const provider = this.collectionProvider();
       const collectionId = this.primaryCollectionId();
 
-      if (!provider || !collectionId || this.defaultSearchFiltersInitialized()) return;
+      if (!this.useShareTroveSearch() || !provider || !collectionId || this.defaultSearchFiltersInitialized()) return;
 
       const collectionIri = `${this.environment.apiDomainUrl}/v2/collections/${collectionId}/`;
       this.actions.setDefaultFilterValue('isContainedBy', collectionIri);
@@ -184,6 +183,8 @@ export class CollectionsDiscoverComponent {
 
   private setupCollectionDetailsEffect(): void {
     effect(() => {
+      if (this.useShareTroveSearch()) return;
+
       const collectionId = this.primaryCollectionId();
       if (collectionId) {
         this.actions.getCollectionDetails(collectionId);
@@ -192,9 +193,10 @@ export class CollectionsDiscoverComponent {
   }
 
   private setupUrlSyncEffect(): void {
-    this.querySyncService.initializeFromUrl();
-
     effect(() => {
+      if (this.useShareTroveSearch()) return;
+      this.querySyncService.initializeFromUrl();
+
       const searchText = this.searchText();
       const sortBy = this.sortBy();
       const selectedFilters = this.selectedFilters();
@@ -208,6 +210,8 @@ export class CollectionsDiscoverComponent {
 
   private setupLegacySearchEffect(): void {
     effect(() => {
+      if (this.useShareTroveSearch()) return;
+
       const searchText = this.searchText();
       const sortBy = this.sortBy();
       const selectedFilters = this.selectedFilters();

src/app/features/metadata/metadata.component.html

@@ -73,7 +73,7 @@
             [isProjectSubmissionsLoading]="isProjectSubmissionsLoading()"
             [cedarRecords]="cedarRecords()"
             [cedarTemplates]="cedarTemplates()?.data ?? null"
-            [isCedarMode]="collectionSubmissionWithCedar"
+            [isCedarMode]="collectionSubmissionWithCedar()"
           />
         }
       </div>

src/app/features/metadata/metadata.component.ts

@@ -19,6 +19,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { ActivatedRoute, Router } from '@angular/router';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
+import { UserSelectors } from '@core/store/user';
 import { MetadataTabsComponent } from '@osf/shared/components/metadata-tabs/metadata-tabs.component';
 import { SubHeaderComponent } from '@osf/shared/components/sub-header/sub-header.component';
 import { MetadataResourceEnum } from '@osf/shared/enums/metadata-resource.enum';
@@ -47,6 +48,7 @@ import {
   SubjectsSelectors,
   UpdateResourceSubjects,
 } from '@osf/shared/stores/subjects';
+import { COLLECTION_SUBMISSION_WITH_CEDAR } from '@shared/constants/feature-flags.const';
 import { MetadataTabsModel } from '@shared/models/metadata-tabs.model';
 import { SubjectModel } from '@shared/models/subject/subject.model';
 
@@ -128,7 +130,10 @@ export class MetadataComponent implements OnInit, OnDestroy {
   private readonly environment = inject(ENVIRONMENT);
   private readonly signpostingService = inject(SignpostingService);
 
-  readonly collectionSubmissionWithCedar = this.environment.collectionSubmissionWithCedar;
+  activeFlags = select(UserSelectors.getActiveFlags);
+  readonly collectionSubmissionWithCedar = computed(() =>
+    this.activeFlags().includes(COLLECTION_SUBMISSION_WITH_CEDAR)
+  );
 
   private resourceId = '';
 

src/app/shared/constants/feature-flags.const.ts

@@ -0,0 +1 @@
+export const COLLECTION_SUBMISSION_WITH_CEDAR = 'collection_submission_with_cedar';

src/app/shared/services/collections.service.ts

@@ -56,7 +56,7 @@ 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&embed=required_metadata_template`;
 
     return this.jsonApiService
       .get<JsonApiResponse<CollectionProviderResponseJsonApi, null>>(url)