Fixed multiple loads of fields

usnistgov · Apr 4, 2024 · 523f5ac · 523f5ac
1 parent 63cfdca
commit 523f5ac
Show file tree

Hide file tree

Showing 8 changed files with 106 additions and 103 deletions.
diff --git a/angular/src/app/adv-search/adv-search.component.ts b/angular/src/app/adv-search/adv-search.component.ts
@@ -92,40 +92,40 @@ export class AdvSearchComponent extends FormCanDeactivate implements OnInit, Aft
         this.mobWidth = (window.innerWidth);
         // Init search box size and breadcrumb position
         this.onWindowResize();
+
+        this.searchFieldsListService.watchFields(
+            (fields) =>{
+                this.fields = (fields as SelectItem[]);
+            }
+        );
     }
 
     /**
      * init
      */
     ngOnInit() {
         var i = 0;
-
-        this.searchFieldsListService.getSearchFields().subscribe(
-            (fields) => {
-                this.fields = (fields as SelectItem[]);
-                this.queries = this.searchQueryService.getQueries();
-                this.currentQueryInfo = this.searchQueryService.getCurrentQueryInfo();
-                this.currentQuery = this.currentQueryInfo.query;
-                this.dataChanged = this.currentQueryInfo.dataChanged;   //Restore status
-                this.currentQueryIndex = this.currentQueryInfo.queryIndex;
-                if(!this.currentQuery) this.currentQuery = new SDPQuery();
-                if(this.currentQuery.queryRows.length == 0) this.currentQuery.queryRows.push(new QueryRow());
-
-                this.searchValue = this.searchQueryService.buildSearchString(this.currentQuery);
-                // Update search box in the top search panel
-                this.searchService.setQueryValue(this.searchValue, '', '');
-            },
-            (err) => {
-                this.errorMessage = <any>err;
-            }
-        );
+        this.setSearchQuery();
 
         this.searchQueryService.watchQueries().subscribe(value => {
             if(value)
                 this.queries = value as SDPQuery[];
         });
     }
 
+    setSearchQuery() {
+        this.queries = this.searchQueryService.getQueries();
+        this.currentQueryInfo = this.searchQueryService.getCurrentQueryInfo();
+        this.currentQuery = this.currentQueryInfo.query;
+        this.dataChanged = this.currentQueryInfo.dataChanged;   //Restore status
+        this.currentQueryIndex = this.currentQueryInfo.queryIndex;
+        if(!this.currentQuery) this.currentQuery = new SDPQuery();
+        if(this.currentQuery.queryRows.length == 0) this.currentQuery.queryRows.push(new QueryRow());
+
+        this.searchValue = this.searchQueryService.buildSearchString(this.currentQuery);
+        // Update search box in the top search panel
+        this.searchService.setQueryValue(this.searchValue, '', '');
+    }
     /**
      *  Following functions detect screen size
      */

diff --git a/angular/src/app/app.component.ts b/angular/src/app/app.component.ts
@@ -7,6 +7,7 @@ import { concat } from 'rxjs';
 import { Title } from '@angular/platform-browser';
 import { ActivatedRoute, NavigationEnd, Router, RouterState } from '@angular/router';
 import { DOCUMENT } from '@angular/common';
+import { TaxonomyListService, SearchfieldsListService } from './shared/index';
 
 enum MenuOrientation {
   STATIC,
@@ -74,6 +75,7 @@ export class AppComponent implements AfterViewInit {
     private gaService: GoogleAnalyticsService,
     public router: Router,
     private titleService: Title,
+    public searchFieldsListService: SearchfieldsListService,
     @Inject(DOCUMENT) private document: Document) {
 
   }
@@ -106,6 +108,8 @@ export class AppComponent implements AfterViewInit {
                 this.handleRouteEvents();
             }
         );
+
+        this.searchFieldsListService.getSearchFields();
     }
 
     /**

diff --git a/angular/src/app/home/home.component.html b/angular/src/app/home/home.component.html
@@ -1,13 +1,5 @@
 <app-search-panel title='NIST Data Discovery' [subtitle]='true' [helpicon]='false' [advanceLink]='true' [homePage]='true' jumbotronHeight='35vh' jumbotronPadding='2em 3em 0em 3em'></app-search-panel>
 
-<!-- <div class="p-col" style="background-color: #F5F5F5;padding-top: 10px;">
-  <div id="feature" class="p-col-12 p-md-8 p-lg-8 featured-data"> <b>SCIENCE THEME</b>
-    <div class="feature-data-domain-divider">
-      <hr class="feature-divider">
-    </div>
-  </div>
-</div> -->
-
 <!-- First row -->
 <div style="background-color: #F5F5F5;padding-top: 2em;">
     <div class="grid" style="width: 90%; margin: auto;">

diff --git a/angular/src/app/search-panel/search-panel.component.ts b/angular/src/app/search-panel/search-panel.component.ts
@@ -130,6 +130,12 @@ export class SearchPanelComponent implements OnInit {
 
         this.mobHeight = (window.innerHeight);
         this.mobWidth = (window.innerWidth);
+
+        this.searchFieldsListService.watchFields(
+            (fields) => {
+                this.fields = fields;
+            }
+        )
     }
 
     /**
@@ -144,7 +150,7 @@ export class SearchPanelComponent implements OnInit {
             });
         };
 
-        this.observableFields = this.searchFieldsListService.getSearchFields();
+        // this.observableFields = this.searchFieldsListService.getSearchFields();
 
         this.searchService._watchQueryValue((queryObj) => {
             if (queryObj && queryObj.queryString && queryObj.queryString.trim() != '') {
@@ -160,15 +166,6 @@ export class SearchPanelComponent implements OnInit {
             }
         );
 
-        this.searchFieldsListService.getSearchFields().subscribe(
-            (fields) => {
-                this.fields = (fields as SelectItem[]);
-            },
-            (err) => {
-                console.log("Error getting fields.", err);
-            }
-        );
-
         // Init search box size and breadcrumb position
         this.onWindowResize();
         var i = 0;

diff --git a/angular/src/app/search/filters/filters.component.ts b/angular/src/app/search/filters/filters.component.ts
@@ -14,7 +14,6 @@ import { trigger, state, style, animate, transition } from '@angular/animations'
     selector: 'app-filters',
     templateUrl: './filters.component.html',
     styleUrls: ['./filters.component.css'],
-    providers: [TaxonomyListService, SearchfieldsListService],
     animations: [
         trigger('expand', [
             state('closed', style({height: '40px'})),
@@ -135,7 +134,14 @@ export class FiltersComponent implements OnInit, AfterViewInit {
         public taxonomyListService: TaxonomyListService,
         public searchFieldsListService: SearchfieldsListService
     ){ 
-
+        this.searchFieldsListService.watchFields(
+            (fields) => {
+                if(fields.length > 0){
+                    this.toSortItems(fields);
+                    this.queryAndSearch();
+                }
+            }
+        )
     }
 
     /**
@@ -158,7 +164,7 @@ export class FiltersComponent implements OnInit, AfterViewInit {
 
                 //Clear filters when we conduct a new search
                 this.clearFilters();
-                this.getFields();
+                this.queryAndSearch();
             }
         }
 
@@ -192,25 +198,19 @@ export class FiltersComponent implements OnInit, AfterViewInit {
     /**
      * Get the filterable fields and then do the search
      */
-    getFields() {
-        this.searchFieldsListService.get().subscribe(
-            fields => {
-                this.toSortItems(fields);
-                this.searchService.setQueryValue(this.searchValue, '', '');
-                this.queryStringErrorMessage = this.searchQueryService.validateQueryString(this.searchValue);
-                if(! this.queryStringErrorMessage){ 
-                    this.queryStringError = true;
-                }
+    queryAndSearch() {
+        if(this.fields) {
+            this.searchService.setQueryValue(this.searchValue, '', '');
+            this.queryStringErrorMessage = this.searchQueryService.validateQueryString(this.searchValue);
+            if(! this.queryStringErrorMessage){ 
+                this.queryStringError = true;
+            }
 
-                let lSearchValue = this.searchValue.replace(/  +/g, ' ');
+            let lSearchValue = this.searchValue? this.searchValue.replace(/  +/g, ' ') : "";
 
-                //Convert to a query then search
-                this.doSearch(this.searchQueryService.buildQueryFromString(lSearchValue, null, this.fields));
-            },
-            error => {
-                this.errorMessage = <any>error
-            }
-        );
+            //Convert to a query then search
+            this.doSearch(this.searchQueryService.buildQueryFromString(lSearchValue, null, this.fields));
+        }
     }
 
     /**

diff --git a/angular/src/app/search/results/results.component.ts b/angular/src/app/search/results/results.component.ts
@@ -68,6 +68,15 @@ export class ResultsComponent implements OnInit {
         this.appConfig.getConfig().subscribe(
             (conf) => { this.PDRAPIURL = conf.PDRAPI; },
         );
+
+        this.searchFieldsListService.watchFields(
+            (fields) => {
+                this.filterableFields = this.toSortItems(fields);
+
+                //Convert to a query then search
+                this.searchSubscription = this.search(null, 1, this.itemsPerPage);
+            }
+        )
     }
 
     ngOnInit() {
@@ -79,18 +88,6 @@ export class ResultsComponent implements OnInit {
                 this.queryStringWarning = true;
         }
 
-        this.searchFieldsListService.get().subscribe(
-            fields => {
-                this.filterableFields = this.toSortItems(fields);
-
-                //Convert to a query then search
-                this.searchSubscription = this.search(null, 1, this.itemsPerPage);
-            },
-            error => {
-                this.errorMessage = <any>error
-            }
-        );
-
         this.pageSubscription = (this.searchService.watchCurrentPage().subscribe(page => {
             if(!page) page=1;
 

diff --git a/angular/src/app/shared/search-query/search-query.service.ts b/angular/src/app/shared/search-query/search-query.service.ts
@@ -548,6 +548,8 @@ export class SearchQueryService {
      * @param queryString input query string
      */
     validateQueryString(queryString: string){
+        if(!queryString) return "";
+
         let queryStringErrorMessage = "";
         let lQueryString: string = "";
         let errorCount: number = 0;

diff --git a/angular/src/app/shared/searchfields-list/searchfields-list.service.ts b/angular/src/app/shared/searchfields-list/searchfields-list.service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { Observable, throwError } from 'rxjs';
+import { Observable, throwError, of, BehaviorSubject } from 'rxjs';
 import * as rxjsop from 'rxjs/operators';
 import { AppConfig, Config } from '../config-service/config.service';
 import { SelectItem } from 'primeng/api';
@@ -11,6 +11,7 @@ import * as _ from 'lodash-es';
 })
 export class SearchfieldsListService {
   ALL: string = 'ALL FIELDS';
+  fields: BehaviorSubject<SelectItem[]> = new BehaviorSubject<SelectItem[]>([] as SelectItem[]);
 
   /**
    * Creates a new FieldsListService with the injected Http.
@@ -25,21 +26,20 @@ export class SearchfieldsListService {
 
   }
 
-  /**
-   * Returns an Observable for the HTTP GET request for the JSON resource.
-   * @return {string[]} The Observable for the HTTP request.
-   */
-  get(): Observable<any> {
-      return this.appConfig.getConfig().pipe(
-          rxjsop.mergeMap((conf) => {
-              return this.http.get(conf.RMMAPI + 'records/fields');
-          }),
-          rxjsop.catchError((err) => {
-              console.error("Failed to download fields: " + JSON.stringify(err));
-              return throwError(err);
-          })
-      );
-  }
+    /**
+     * Watch total items (search result)
+     */
+    public watchFields(subscriber) {
+        this.fields.subscribe(subscriber);
+    }
+
+    /**
+     * Set total items (search result)
+     * @param page 
+     */
+    setFields(fields: SelectItem[]) {
+        this.fields.next(fields);
+    }
 
   /**
     * Handle HTTP error
@@ -53,25 +53,36 @@ export class SearchfieldsListService {
     return Observable.throw(errMsg);
   }
 
-  /**
-   * Get database fields for Advanced Search builder
-   */
-  getSearchFields(): Observable<SelectItem[]> {
-    return new Observable<SelectItem[]>(subscriber => {
-        this.get().subscribe(
-            (res) => {
-                let fields: SelectItem[] = this.toFieldItems(res);
-                subscriber.next(fields);
-                subscriber.complete();
+    /**
+     * Returns an Observable for the HTTP GET request for the JSON resource.
+     * @return {string[]} The Observable for the HTTP request.
+     */
+    get(url): Observable<any> {
+        return this.http.get(url);
+    }
+
+    /**
+     * Get database fields for Advanced Search builder
+     */
+    getSearchFields() {
+        this.appConfig.getConfig().subscribe({
+            next: (conf) => {
+                this.get(conf.RMMAPI + 'records/fields').subscribe({
+                    next: (res) => {
+                        this.setFields(this.toFieldItems(res));
+                    },
+                    error: (err) => {
+                        console.error(err);
+                        //display error message on screen...
+                    }
+                })
             },
-            (error) => {
-                console.log(error);
-                subscriber.next(error);
-                subscriber.complete();
+            error: (err) => {
+                console.error(err);
+                //display error message on screen...
             }
-        );
-    });
-  }
+        })
+    }
 
     /**
      * Advanced Search fields dropdown