Clear url parameters for entity search tabs (#2734)

* 110878: Entity search - clear params on tab switch

* 110878: Properly clear browse-by values when navigating

* 132230: Related entity tab switching: only keep query & scope, reset page to 1

---------

Co-authored-by: Nona Luypaert <nona.luypaert@atmire.com>

src/app/browse-by/browse-by-metadata/browse-by-metadata.component.ts

@@ -248,6 +248,8 @@ export class BrowseByMetadataComponent implements OnInit, OnChanges, OnDestroy {
 
         if (typeof params.startsWith === 'string') {
           this.startsWith = params.startsWith.trim();
+        } else {
+          this.startsWith = '';
         }
 
         if (isNotEmpty(this.value)) {

src/app/item-page/simple/related-entities/tabbed-related-entities-search/tabbed-related-entities-search.component.spec.ts

@@ -44,6 +44,12 @@ describe('TabbedRelatedEntitiesSearchComponent', () => {
           provide: ActivatedRoute,
           useValue: {
             queryParams: of({ tab: mockRelationType }),
+            snapshot: {
+              queryParams: {
+                scope: 'collection-uuid',
+                query: 'test',
+              },
+            },
           },
         },
         { provide: Router, useValue: router },
@@ -89,8 +95,10 @@ describe('TabbedRelatedEntitiesSearchComponent', () => {
         relativeTo: (comp as any).route,
         queryParams: {
           tab: event.nextId,
+          query: 'test',
+          scope: 'collection-uuid',
+          'spc.page': 1,
         },
-        queryParamsHandling: 'merge',
       });
     });
   });

src/app/item-page/simple/related-entities/tabbed-related-entities-search/tabbed-related-entities-search.component.ts

@@ -89,8 +89,10 @@ export class TabbedRelatedEntitiesSearchComponent implements OnInit {
       relativeTo: this.route,
       queryParams: {
         tab: event.nextId,
+        query: this.route.snapshot.queryParams.query,
+        scope: this.route.snapshot.queryParams.scope,
+        'spc.page': 1,
       },
-      queryParamsHandling: 'merge',
     });
   }
 

src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.html

@@ -1,6 +1,6 @@
 <div class="d-flex flex-row">
   @if (linkType !== linkTypes.None) {
-    <a [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[]" [queryParams]="queryParams$ | async" [queryParamsHandling]="'merge'" class="lead" role="link" tabindex="0">
+    <a [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[]" [queryParams]="queryParams$ | async" class="lead" role="link" tabindex="0">
       {{object.value}}
     </a>
   }

src/app/shared/starts-with/date/starts-with-date.component.spec.ts

@@ -100,7 +100,7 @@ describe('StartsWithDateComponent', () => {
     });
 
     it('should add a startsWith query parameter', () => {
-      expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue });
+      expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue }, undefined, { queryParamsHandling: '' });
     });
 
     it('should automatically fill in the input field', () => {
@@ -122,7 +122,7 @@ describe('StartsWithDateComponent', () => {
       });
 
       it('should add a startsWith query parameter', () => {
-        expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue });
+        expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue }, undefined, { queryParamsHandling: '' });
       });
 
       it('should automatically fill in the input field', () => {
@@ -146,7 +146,7 @@ describe('StartsWithDateComponent', () => {
       });
 
       it('should add a startsWith query parameter', () => {
-        expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue });
+        expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue }, undefined, { queryParamsHandling: '' });
       });
 
       it('should automatically fill in the input field', () => {
@@ -171,7 +171,7 @@ describe('StartsWithDateComponent', () => {
     });
 
     it('should add a startsWith query parameter', () => {
-      expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue });
+      expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue }, undefined, { queryParamsHandling: '' });
     });
   });
 

src/app/shared/starts-with/starts-with-abstract.component.ts

@@ -92,11 +92,10 @@ export abstract class StartsWithAbstractComponent implements OnInit, OnDestroy {
       this.startsWith = undefined;
     }
     if (resetPage) {
-      this.paginationService.updateRoute(this.paginationId, { page: 1 }, { startsWith: this.startsWith });
+      this.paginationService.updateRoute(this.paginationId, { page: 1 }, { startsWith: this.startsWith }, undefined, { queryParamsHandling: '' });
     } else {
       void this.router.navigate([], {
         queryParams: Object.assign({ startsWith: this.startsWith }),
-        queryParamsHandling: 'merge',
       });
     }
   }

src/app/shared/starts-with/text/starts-with-text.component.spec.ts

@@ -74,8 +74,8 @@ describe('StartsWithTextComponent', () => {
       expect(comp.startsWith).toEqual(expectedValue);
     });
 
-    it('should add a startsWith query parameter', () => {
+    it('should add a startsWith query parameter and clear all others', () => {
-      expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue });
+      expect(paginationService.updateRoute).toHaveBeenCalledWith('page-id', { page: 1 }, { startsWith: expectedValue }, undefined, { queryParamsHandling: '' });
     });
   });