Skip to content
Permalink
Browse files
refactor(fulltext-search): persist fulltext search term in input field (
DSP-1674) (#539)

* refactor(fulltext-search): persists fulltext search term in the input field on page refresh. If a gravsearch query is performed, the input field is cleared

* fix: quick fix to decode the search term string

* refactor: only persists search term if user refreshes the full text search results page
  • Loading branch information
mdelez committed Sep 21, 2021
1 parent e3e5138 commit 67a52a32ef8285e16b37f6cd069a72ded763deab
@@ -36,5 +36,6 @@ export class EmitEvent {

// possible events that can be emitted.
export enum Events {
loginSuccess
loginSuccess,
gravSearchExecuted
}
@@ -2,6 +2,7 @@ import { Component, EventEmitter, Inject, Input, OnChanges, Output } from '@angu
import { PageEvent } from '@angular/material/paginator';
import { ApiResponseError, CountQueryResponse, IFulltextSearchParams, KnoraApiConnection, ReadResourceSequence } from '@dasch-swiss/dsp-js';
import { DspApiConnectionToken } from 'src/app/main/declarations/dsp-api-tokens';
import { ComponentCommunicationEventService, EmitEvent, Events } from 'src/app/main/services/component-communication-event.service';
import { NotificationService } from 'src/app/main/services/notification.service';
import { AdvancedSearchParamsService } from '../../search/services/advanced-search-params.service';

@@ -117,7 +118,8 @@ export class ListViewComponent implements OnChanges {
constructor(
@Inject(DspApiConnectionToken) private _dspApiConnection: KnoraApiConnection,
private _advancedSearchParamsService: AdvancedSearchParamsService,
private _notification: NotificationService
private _notification: NotificationService,
private _componentCommsService: ComponentCommunicationEventService,
) { }

ngOnChanges(): void {
@@ -207,6 +209,8 @@ export class ListViewComponent implements OnChanges {
);

} else if (this.search.mode === 'gravsearch') {
// emit 'gravSearchExecuted' event to the fulltext-search component in order to clear the input field
this._componentCommsService.emit(new EmitEvent(Events.gravSearchExecuted, true));

// search mode: gravsearch
if (this.pageEvent.pageIndex === 0) {
@@ -7,6 +7,7 @@ import {
Inject,
Input,
OnChanges,
OnDestroy,
OnInit,
Output,
TemplateRef,
@@ -23,7 +24,9 @@ import {
ProjectsResponse,
ReadProject
} from '@dasch-swiss/dsp-js';
import { Subscription } from 'rxjs';
import { DspApiConnectionToken } from 'src/app/main/declarations/dsp-api-tokens';
import { ComponentCommunicationEventService, Events } from 'src/app/main/services/component-communication-event.service';
import { NotificationService } from 'src/app/main/services/notification.service';
import { SortingService } from 'src/app/main/services/sorting.service';
import { SearchParams } from '../../results/list-view/list-view.component';
@@ -41,7 +44,7 @@ const resolvedPromise = Promise.resolve(null);
templateUrl: './fulltext-search.component.html',
styleUrls: ['./fulltext-search.component.scss']
})
export class FulltextSearchComponent implements OnInit, OnChanges {
export class FulltextSearchComponent implements OnInit, OnChanges, OnDestroy {

/**
*
@@ -105,6 +108,8 @@ export class FulltextSearchComponent implements OnInit, OnChanges {

projectIri: string;

componentCommsSubscription: Subscription;

// in case of an (api) error
error: any;

@@ -128,10 +133,20 @@ export class FulltextSearchComponent implements OnInit, OnChanges {
private _notification: NotificationService,
private _sortingService: SortingService,
private _overlay: Overlay,
private _viewContainerRef: ViewContainerRef
private _viewContainerRef: ViewContainerRef,
private _componentCommsService: ComponentCommunicationEventService,
) { }

ngOnInit(): void {

// on page refresh, split the url into an array of strings and assign the `searchQuery` to the last element of this array of strings
// this persists the search term in the search input field
const urlArray = window.location.pathname.split('/');
const currentSearchTerm = urlArray[urlArray.length - 1];
if(urlArray[urlArray.length - 2] === 'fulltext') {
this.searchQuery = decodeURI(decodeURI(currentSearchTerm));
}

// filterbyproject is set as deprecated. To avoid breaking changes we still support it
if (this.filterbyproject) {
this.limitToProject = this.filterbyproject;
@@ -152,6 +167,12 @@ export class FulltextSearchComponent implements OnInit, OnChanges {
if (this.projectfilter) {
this.getAllProjects();
}

// in the event of a grav search (advanced or expert search), clear the input field
this.componentCommsSubscription = this._componentCommsService.on(
Events.gravSearchExecuted, () => {
this.searchQuery = null;
});
}

ngOnChanges() {
@@ -168,6 +189,13 @@ export class FulltextSearchComponent implements OnInit, OnChanges {
});
}

ngOnDestroy() {
// unsubscribe from the componentCommsSubscription when component is destroyed
if (this.componentCommsSubscription !== undefined) {
this.componentCommsSubscription.unsubscribe();
}
}

/**
* get all public projects from DSP-API
*/

0 comments on commit 67a52a3

Please sign in to comment.