changed the scope to activate on change instead of on form submit

src/app/+search-page/search-page.component.ts

@@ -63,7 +63,9 @@ export class SearchPageComponent implements OnInit {
     );
     this.scopeListRD$ = this.filterService.getCurrentScope().pipe(
       flatMap((scopeId) => this.service.getScopes(scopeId))
-    )
+    );
+
+    this.resultsRD$.subscribe((v) => console.log('this.resultsRD$', v.state));
   }
 
   public closeSidebar(): void {

src/app/shared/search-form/search-form.component.html

@@ -1,6 +1,6 @@
 <form #form="ngForm" (ngSubmit)="onSubmit(form.value)" class="row" action="/search">
 <div *ngIf="isNotEmpty(scopes)" class="col-12 col-sm-3">
-  <select [(ngModel)]="selectedId" name="scope" class="form-control" aria-label="Search scope">
+  <select [(ngModel)]="selectedId" name="scope" class="form-control" aria-label="Search scope" (change)="onScopeChange($event.target.value)">
     <option value>{{'search.form.search_dspace' | translate}}</option>
     <option *ngFor="let scopeOption of scopes" [value]="scopeOption.id">{{scopeOption?.name ? scopeOption.name : 'search.form.search_dspace' | translate}}</option>
   </select>

src/app/shared/search-form/search-form.component.ts

@@ -33,14 +33,14 @@ export class SearchFormComponent {
     this.updateSearch(data);
   }
 
+  onScopeChange(scope: string) {
+    this.updateSearch({ scope });
+  }
+
   updateSearch(data: any) {
     const newUrl = hasValue(this.currentUrl) ? this.currentUrl : 'search';
     this.router.navigate([newUrl], {
-      queryParams: {
-        query: data.query,
-        scope: data.scope || undefined,
-        page: data.page || 1
-      },
+      queryParams: Object.assign({}, { page: 1 }, data),
       queryParamsHandling: 'merge'
     });
   }