Merge pull request #418 from medizininformatik-initiative/415-preload-filter-and-criteria-search-results-before-page-load

415 preload filter and criteria search results before page load

Author: Shayan1375

src/app/modules/data-selection/components/search/search.component.ts

@@ -22,6 +22,7 @@ import { TreeNode } from 'src/app/shared/models/TreeNode/TreeNodeInterface';
 import { DataSelectionProfile } from 'src/app/model/DataSelection/Profile/DataSelectionProfile';
 import { DataSelectionProviderService } from '../../services/DataSelectionProvider.service';
 import { NavigationHelperService } from 'src/app/service/NavigationHelper.service';
+import { ActivatedRoute } from '@angular/router';
 
 @Component({
   selector: 'num-search-data-selection',
@@ -55,7 +56,8 @@ export class SearchDataSelectionComponent implements OnInit, AfterViewInit, OnDe
     private dataSelectionProviderService: DataSelectionProviderService,
     private activeDataSelectionService: ActiveDataSelectionService,
     private selectedDataSelectionProfileService: SelectedDataSelectionProfileService,
-    private navigationHelperService: NavigationHelperService
+    private navigationHelperService: NavigationHelperService,
+    private activeRoute: ActivatedRoute
   ) {}
 
   ngOnInit(): void {
@@ -66,13 +68,9 @@ export class SearchDataSelectionComponent implements OnInit, AfterViewInit, OnDe
       this.selectedDataSelectionProfileService.getSelectedProfiles();
 
     this.handleSelectedItemsSubscription();
-    this.dataSelectionProfileTreeSubscription = this.dataSelectionProfileTreeService
-      .fetchProfileTree()
-      .subscribe((tree) => {
-        const treeNodes = tree.getTreeNode();
-        const rootNode = DataSelectionTreeAdapter.fromTree(tree.getTreeNode());
-        this.trees = rootNode;
-      });
+    const tree = this.activeRoute.snapshot.data.preLoadDataSelectionData;
+    const rootNode = DataSelectionTreeAdapter.fromTree(tree.getTreeNode());
+    this.trees = rootNode;
   }
 
   /**

src/app/modules/data-selection/data-selection-routing.module.ts

@@ -3,6 +3,7 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { SearchDataSelectionComponent } from './components/search/search.component';
 import { PathSegments } from 'src/app/app-paths';
+import { DataSelectionProfileResolverService } from 'src/app/service/Resolver/DataSelectionProfileResolver.servcie';
 
 const routes: Routes = [
   {
@@ -14,6 +15,9 @@ const routes: Routes = [
   {
     path: PathSegments.search,
     component: SearchDataSelectionComponent,
+    resolve: {
+      preLoadDataSelectionData: DataSelectionProfileResolverService,
+    },
     data: { animation: 'Data_Selection_Search', title: 'TAB_TITLE.DATA_SELECTION.SEARCH' },
   },
   {

src/app/modules/feasibility-query/components/search/search.component.html

@@ -23,7 +23,7 @@
     <ng-container #outlet [ngTemplateOutlet]="content"></ng-container>
     <ng-template #content>
       <num-search-filter
-        *ngFor="let searchFilter of searchFilters$ | async"
+        *ngFor="let searchFilter of searchFilters"
         [filter]="searchFilter"
         (selectedFilterChanged)="setElasticSearchFilter($event)"
       ></num-search-filter>

src/app/modules/feasibility-query/components/search/search.component.ts

@@ -2,7 +2,6 @@ import { CriteriaSearchFilterAdapter } from 'src/app/shared/models/SearchFilter/
 import { FilterProvider } from 'src/app/service/Search/Filter/SearchFilterProvider.service';
 import { InterfaceTableDataRow } from 'src/app/shared/models/TableData/InterfaceTableDataRows';
 import { MatDrawer } from '@angular/material/sidenav';
-import { SearchFilter } from 'src/app/shared/models/SearchFilter/InterfaceSearchFilter';
 import { SearchFilterService } from 'src/app/service/Search/Filter/SearchFilter.service';
 import { SearchResultProvider } from 'src/app/service/Search/Result/SearchResultProvider';
 import { SearchService } from 'src/app/service/Search/Search.service';
@@ -26,8 +25,8 @@ import {
   ViewContainerRef,
   TemplateRef,
 } from '@angular/core';
-import { DataSelectionMainProfileInitializerService } from 'src/app/service/DataSelectionMainProfileInitializerService';
-import { DataSelectionProviderService } from 'src/app/modules/data-selection/services/DataSelectionProvider.service';
+import { ActivatedRoute } from '@angular/router';
+import { SearchFilter } from 'src/app/shared/models/SearchFilter/InterfaceSearchFilter';
 
 @Component({
   selector: 'num-feasibility-query-search',
@@ -42,14 +41,15 @@ export class FeasibilityQuerySearchComponent implements OnInit, OnDestroy, After
   searchtext = '';
   adaptedData: TableData;
   private subscription: Subscription;
-  private isInitialized = false;
   isOpen = false;
 
+  private isInitialized = false;
+
   elasticSearchEnabled = false;
 
   selectedDetails$: Observable<SearchTermDetails>;
 
-  searchFilters$: Observable<SearchFilter[]>;
+  searchFilters: SearchFilter[] = [];
 
   searchText$: Observable<string>;
 
@@ -69,8 +69,7 @@ export class FeasibilityQuerySearchComponent implements OnInit, OnDestroy, After
     private searchTermDetailsService: SearchTermDetailsService,
     private searchResultProviderService: SearchResultProvider,
     private searchTermDetailsProviderService: SearchTermDetailsProviderService,
-    private dataSelectionMainProfileInitializerService: DataSelectionMainProfileInitializerService,
-    private dataSelectionProviderService: DataSelectionProviderService
+    private activatedRoute: ActivatedRoute
   ) {
     this.subscription = this.searchResultProviderService
       .getCriteriaSearchResults()
@@ -101,6 +100,8 @@ export class FeasibilityQuerySearchComponent implements OnInit, OnDestroy, After
   }
 
   ngOnInit() {
+    const t = this.activatedRoute.snapshot.data.preLoadCriteriaData;
+    console.log('Preloaded data:', t);
     this.selectedDetails$ = this.searchTermDetailsProviderService.getSearchTermDetails$();
     this.handleSelectedItemsSubscription();
     this.getElasticSearchFilter();
@@ -184,16 +185,16 @@ export class FeasibilityQuerySearchComponent implements OnInit, OnDestroy, After
   }
 
   public getElasticSearchFilter(): void {
-    this.searchFilters$ = this.filterService.fetchFilters().pipe(
-      map((searchFilters: SearchTermFilter[]) =>
-        searchFilters.map((searchFilter) => {
-          searchFilter.setSelectedValues(
-            this.searchFilterProvider.getSelectedValuesOfType(searchFilter.getName())
-          );
-          return CriteriaSearchFilterAdapter.convertToFilterValues(searchFilter);
-        })
-      )
-    );
+    const searchFilters: Array<SearchTermFilter> =
+      this.activatedRoute.snapshot.data.preLoadCriteriaFilter;
+    if (searchFilters && searchFilters.length > 0) {
+      this.searchFilters = searchFilters.map((searchFilter: SearchTermFilter) => {
+        searchFilter.setSelectedValues(
+          this.searchFilterProvider.getSelectedValuesOfType(searchFilter.getName())
+        );
+        return CriteriaSearchFilterAdapter.convertToFilterValues(searchFilter);
+      });
+    }
   }
 
   public setElasticSearchFilter(filter: any) {

src/app/modules/feasibility-query/feasibility-query-routing.module.ts

@@ -4,12 +4,15 @@ import { NgModule } from '@angular/core';
 import { PathSegments } from 'src/app/app-paths';
 import { ResultComponent } from './components/result/result.component';
 import { RouterModule, Routes } from '@angular/router';
+import { CriteriaSearchDataResolverService } from 'src/app/service/Resolver/CriteriaSearchDataResolver.service';
+import { CriteriaSearchFilterResolverService } from 'src/app/service/Resolver/CriteriaSearchFilterResolver.service';
 
 const routes: Routes = [
   {
     path: '',
     redirectTo: PathSegments.search,
     pathMatch: 'full',
+
     data: {
       animation: 'Feasibility_Search',
       title: 'TAB_TITLE.FEASIBILITY_QUERY.SEARCH',
@@ -34,6 +37,10 @@ const routes: Routes = [
   {
     path: PathSegments.search,
     component: FeasibilityQuerySearchComponent,
+    resolve: {
+      preLoadCriteriaData: CriteriaSearchDataResolverService,
+      preLoadCriteriaFilter: CriteriaSearchFilterResolverService,
+    },
     data: {
       animation: 'Feasibility_Search',
       title: 'TAB_TITLE.FEASIBILITY_QUERY.SEARCH',

src/app/service/Resolver/CriteriaSearchDataResolver.service.ts

@@ -0,0 +1,15 @@
+import { Injectable } from '@angular/core';
+import { SearchService } from '../Search/Search.service';
+import { SearchTermResultList } from 'src/app/model/ElasticSearch/ElasticSearchResult/ElasticSearchList/ResultList/SearchTermResultList';
+import { Observable } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class CriteriaSearchDataResolverService {
+  constructor(private searchService: SearchService) {}
+
+  public resolve(): Observable<SearchTermResultList> {
+    return this.searchService.searchCriteria('');
+  }
+}

src/app/service/Resolver/CriteriaSearchFilterResolver.service.ts

@@ -0,0 +1,15 @@
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { SearchFilterService } from '../Search/Filter/SearchFilter.service';
+import { SearchTermFilter } from 'src/app/model/ElasticSearch/ElasticSearchFilter/SearchTermFilter';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class CriteriaSearchFilterResolverService {
+  constructor(private searchFilterService: SearchFilterService) {}
+
+  public resolve(): Observable<Array<SearchTermFilter>> {
+    return this.searchFilterService.fetchFilters();
+  }
+}

src/app/service/Resolver/DataSelectionProfileResolver.servcie.ts

@@ -0,0 +1,15 @@
+import { DataSelectionProfileTree } from 'src/app/model/DataSelection/ProfileTree/DataSelectionProfileTree';
+import { DataSelectionProfileTreeService } from '../DataSelection/CreateDataselectionProfileTree';
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DataSelectionProfileResolverService {
+  constructor(private dataSelectionProfileTreeService: DataSelectionProfileTreeService) {}
+
+  public resolve(): Observable<DataSelectionProfileTree> {
+    return this.dataSelectionProfileTreeService.fetchProfileTree();
+  }
+}