Current Form Values:
{{ form.value | json }}
diff --git a/ui/src/app/metadata-filter/container/new-filter.component.spec.ts b/ui/src/app/metadata-filter/container/new-filter.component.spec.ts
index d13e0682f..2c0653760 100644
--- a/ui/src/app/metadata-filter/container/new-filter.component.spec.ts
+++ b/ui/src/app/metadata-filter/container/new-filter.component.spec.ts
@@ -71,7 +71,7 @@ describe('New Metadata Filter Page', () => {
describe('onViewMore method', () => {
it('should dispatch a viewMoreEntityIds action', () => {
fixture.detectChanges();
- instance.onViewMore();
+ instance.onViewMore('foo');
expect(store.dispatch).toHaveBeenCalled();
});
});
diff --git a/ui/src/app/metadata-filter/container/new-filter.component.ts b/ui/src/app/metadata-filter/container/new-filter.component.ts
index 37640a82c..e3756855c 100644
--- a/ui/src/app/metadata-filter/container/new-filter.component.ts
+++ b/ui/src/app/metadata-filter/container/new-filter.component.ts
@@ -3,13 +3,14 @@ import { FormBuilder, Validators } from '@angular/forms';
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/takeWhile';
import * as fromFilter from '../reducer';
import { ProviderFormFragmentComponent } from '../../metadata-provider/component/forms/provider-form-fragment.component';
import { ProviderStatusEmitter, ProviderValueEmitter } from '../../metadata-provider/service/provider-change-emitter.service';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { SearchDialogComponent } from '../component/search-dialog.component';
-import { ViewMoreIds, CancelCreateFilter, LoadEntityIds } from '../action/filter.action';
+import { ViewMoreIds, CancelCreateFilter, QueryEntityIds } from '../action/filter.action';
import { EntityValidators } from '../../metadata-provider/service/entity-validators.service';
@@ -19,12 +20,12 @@ import { EntityValidators } from '../../metadata-provider/service/entity-validat
})
export class NewFilterComponent extends ProviderFormFragmentComponent implements OnInit, OnChanges, OnDestroy {
- entityIds$: Observable
;
ids: string[];
-
+ entityIds$: Observable;
showMore$: Observable;
selected$: Observable;
loading$: Observable;
+ processing$: Observable;
constructor(
private store: Store,
@@ -34,12 +35,11 @@ export class NewFilterComponent extends ProviderFormFragmentComponent implements
) {
super(fb, statusEmitter, valueEmitter);
- // this.form.statusChanges.subscribe(status => console.log(status));
-
this.showMore$ = this.store.select(fromFilter.getViewingMore);
this.selected$ = this.store.select(fromFilter.getSelected);
this.entityIds$ = this.store.select(fromFilter.getEntityCollection);
this.loading$ = this.store.select(fromFilter.getIsLoading);
+ this.processing$ = this.loading$.withLatestFrom(this.showMore$, (l, s) => !s && l);
this.entityIds$.subscribe(ids => this.ids = ids);
@@ -67,14 +67,17 @@ export class NewFilterComponent extends ProviderFormFragmentComponent implements
ngOnDestroy(): void {}
- searchEntityIds(query: string): void {
- if (query.length >= 4) {
- this.store.dispatch(new LoadEntityIds(query));
+ searchEntityIds(term: string): void {
+ if (term.length >= 4 && this.ids.indexOf(term) < 0) {
+ this.store.dispatch(new QueryEntityIds({
+ term,
+ limit: 10
+ }));
}
}
- onViewMore(): void {
- this.store.dispatch(new ViewMoreIds(this.ids));
+ onViewMore(query: string): void {
+ this.store.dispatch(new ViewMoreIds(query));
}
save(): void {
diff --git a/ui/src/app/metadata-filter/effect/filter.effect.ts b/ui/src/app/metadata-filter/effect/filter.effect.ts
index 766da16d6..5c5431dee 100644
--- a/ui/src/app/metadata-filter/effect/filter.effect.ts
+++ b/ui/src/app/metadata-filter/effect/filter.effect.ts
@@ -1,16 +1,19 @@
import { Injectable } from '@angular/core';
import { Effect, Actions } from '@ngrx/effects';
+import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
+import { Router } from '@angular/router';
+import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import 'rxjs/add/observable/fromPromise';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
+import 'rxjs/add/operator/withLatestFrom';
import * as filter from '../action/filter.action';
+import * as fromFilter from '../reducer';
-import { Router } from '@angular/router';
-import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { SearchDialogComponent } from '../component/search-dialog.component';
import { EntityIdService } from '../../metadata-provider/service/entity-id.service';
@@ -21,7 +24,7 @@ export class FilterEffects {
@Effect()
loadEntityIds$ = this.actions$
- .ofType(filter.LOAD_ENTITY_IDS)
+ .ofType(filter.QUERY_ENTITY_IDS)
.map(action => action.payload)
.debounceTime(this.dbounce)
.switchMap(query =>
@@ -40,17 +43,33 @@ export class FilterEffects {
viewMore$ = this.actions$
.ofType(filter.VIEW_MORE_IDS)
.map(action => action.payload)
- .switchMap(() =>
- Observable
- .fromPromise(this.modalService.open(SearchDialogComponent).result)
+ .switchMap(q => {
+ const modal = this.modalService.open(SearchDialogComponent) as NgbModalRef;
+ const res = modal.result;
+ modal.componentInstance.term = q;
+ return Observable
+ .fromPromise(res)
.map(id => new filter.SelectId(id))
- .catch(() => Observable.of(new filter.CancelViewMore()))
+ .catch(() => Observable.of(new filter.CancelViewMore()));
+ });
+ /*
+ @Effect()
+ viewMoreQuery$ = this.actions$
+ .ofType(filter.VIEW_MORE_IDS)
+ .map(action => action.payload)
+ .switchMap(query =>
+ this.idService
+ .query(query)
+ .map(ids => new filter.LoadEntityIdsSuccess(ids))
+ .catch(error => Observable.of(new filter.LoadEntityIdsError(error)))
);
+ */
constructor(
private actions$: Actions,
private router: Router,
private modalService: NgbModal,
- private idService: EntityIdService
+ private idService: EntityIdService,
+ private store: Store
) { }
}
diff --git a/ui/src/app/metadata-filter/reducer/filter.reducer.spec.ts b/ui/src/app/metadata-filter/reducer/filter.reducer.spec.ts
index 39372d4d5..54ea59a6a 100644
--- a/ui/src/app/metadata-filter/reducer/filter.reducer.spec.ts
+++ b/ui/src/app/metadata-filter/reducer/filter.reducer.spec.ts
@@ -7,7 +7,8 @@ const snapshot: fromFilter.FilterState = {
selected: null,
viewMore: false,
loading: false,
- error: null
+ error: null,
+ term: ''
};
describe('Filter Reducer', () => {
@@ -21,7 +22,7 @@ describe('Filter Reducer', () => {
describe(`${ actions.VIEW_MORE_IDS } action`, () => {
it('should set viewMore property to true', () => {
- const result = reducer(snapshot, new actions.ViewMoreIds([]));
+ const result = reducer(snapshot, new actions.ViewMoreIds('foo'));
expect(result.viewMore).toBe(true);
});
@@ -45,9 +46,9 @@ describe('Filter Reducer', () => {
});
});
- describe(`${actions.LOAD_ENTITY_IDS} action`, () => {
+ describe(`${actions.QUERY_ENTITY_IDS} action`, () => {
it('should set loading property to true', () => {
- const result = reducer(snapshot, new actions.LoadEntityIds('foo'));
+ const result = reducer(snapshot, new actions.QueryEntityIds({ term: 'foo' }));
expect(result.loading).toBe(true);
});
diff --git a/ui/src/app/metadata-filter/reducer/filter.reducer.ts b/ui/src/app/metadata-filter/reducer/filter.reducer.ts
index b4a64e1ca..ef435a7c7 100644
--- a/ui/src/app/metadata-filter/reducer/filter.reducer.ts
+++ b/ui/src/app/metadata-filter/reducer/filter.reducer.ts
@@ -9,6 +9,7 @@ export interface FilterState {
loading: boolean;
error: Error | null;
selected: string | null;
+ term: string;
}
export const initialState: FilterState = {
@@ -16,7 +17,8 @@ export const initialState: FilterState = {
selected: null,
viewMore: false,
loading: false,
- error: null
+ error: null,
+ term: ''
};
export function reducer(state = initialState, action: filter.Actions): FilterState {
@@ -40,10 +42,16 @@ export function reducer(state = initialState, action: filter.Actions): FilterSta
viewMore: false
};
}
- case filter.LOAD_ENTITY_IDS: {
+ case filter.CANCEL_CREATE_FILTER: {
+ return {
+ ...initialState
+ };
+ }
+ case filter.QUERY_ENTITY_IDS: {
return {
...state,
- loading: true
+ loading: true,
+ term: action.payload.term
};
}
case filter.LOAD_ENTITY_IDS_SUCCESS: {
@@ -72,3 +80,4 @@ export const getSelected = (state: FilterState) => state.selected;
export const getEntityIds = (state: FilterState) => state.entityIds;
export const getError = (state: FilterState) => state.error;
export const getLoading = (state: FilterState) => state.loading;
+export const getTerm = (state: FilterState) => state.term;
diff --git a/ui/src/app/metadata-filter/reducer/index.ts b/ui/src/app/metadata-filter/reducer/index.ts
index 2f9873975..230cb42ce 100644
--- a/ui/src/app/metadata-filter/reducer/index.ts
+++ b/ui/src/app/metadata-filter/reducer/index.ts
@@ -24,3 +24,4 @@ export const getSelected = createSelector(getFilterFromState, fromFilter.getSele
export const getEntityCollection = createSelector(getFilterFromState, fromFilter.getEntityIds);
export const getIsLoading = createSelector(getFilterFromState, fromFilter.getLoading);
export const getError = createSelector(getFilterFromState, fromFilter.getError);
+export const getTerm = createSelector(getFilterFromState, fromFilter.getTerm);
diff --git a/ui/src/app/metadata-provider/service/entity-id.service.ts b/ui/src/app/metadata-provider/service/entity-id.service.ts
index 4426844e9..5fb3049bf 100644
--- a/ui/src/app/metadata-provider/service/entity-id.service.ts
+++ b/ui/src/app/metadata-provider/service/entity-id.service.ts
@@ -7,14 +7,15 @@ import { Subject } from 'rxjs/Subject';
import { IDS } from '../../../data/ids.mock';
import { Storage } from '../../shared/storage';
import { environment } from '../../../environments/environment';
+import { QueryParams } from '../../core/model/query';
const MOCK_INTERVAL = 500;
@Injectable()
export class EntityIdService {
- private endpoint = '/data/ids.json';
- private base = '';
+ private endpoint = '/EntityIds/search';
+ private base = '/api';
private subj: Subject = new Subject();
@@ -22,19 +23,16 @@ export class EntityIdService {
private http: HttpClient
) { }
- query(search: string = ''): Observable {
- setTimeout(() => {
- let found = IDS.filter((option: string) => option.toLocaleLowerCase().match(search.toLocaleLowerCase()));
- this.subj.next(found);
- }, MOCK_INTERVAL);
- return this.subj.asObservable();
- /*
+ query(q: QueryParams): Observable {
+ let params: HttpParams = new HttpParams();
+ Object.keys(q).forEach(key => params = params.set(key, q[key]));
+ const opts = { params: params };
return this.http
- .get(`${this.base}${this.endpoint}s`)
+ .get(`${this.base}${this.endpoint}`, opts)
+ .map(resp => resp.entityIds)
.catch(err => {
console.log('ERROR LOADING IDS:', err);
return Observable.of([] as string[]);
});
- */
}
}
diff --git a/ui/src/app/widget/autocomplete/autocomplete.component.ts b/ui/src/app/widget/autocomplete/autocomplete.component.ts
index b97cc3561..38bbafa2a 100644
--- a/ui/src/app/widget/autocomplete/autocomplete.component.ts
+++ b/ui/src/app/widget/autocomplete/autocomplete.component.ts
@@ -155,7 +155,7 @@ export class AutoCompleteComponent implements OnInit, OnDestroy, AfterViewInit,
$event.stopPropagation();
this.handleInputBlur();
this.input.markAsTouched();
- this.more.emit();
+ this.more.emit(this.input.value);
}
handleComponentBlur(newState: any = {}): void {
@@ -163,11 +163,7 @@ export class AutoCompleteComponent implements OnInit, OnDestroy, AfterViewInit,
query = this.input.value,
change = this.matches && this.matches[selected] ? this.matches[selected] : null;
if (!change) {
- if (this.allowCustom) {
- change = query;
- } else {
- change = this.queryOption;
- }
+ change = this.allowCustom ? query : this.queryOption;
}
this.propagateChange(change);
this.propagateTouched(null);
@@ -222,7 +218,7 @@ export class AutoCompleteComponent implements OnInit, OnDestroy, AfterViewInit,
const optionsAvailable = this.matches.length > 0;
const searchForOptions = (!queryEmpty && queryLongEnough);
this.state.setState({
- menuOpen: searchForOptions,
+ menuOpen: searchForOptions && !this.matches.some(m => m === query),
selected: searchForOptions ? ((autoselect && optionsAvailable) ? 0 : -1) : null
});
if (this.allowCustom) {
diff --git a/ui/src/locale/en.xlf b/ui/src/locale/en.xlf
index 851a1a5e0..a966da2fe 100644
--- a/ui/src/locale/en.xlf
+++ b/ui/src/locale/en.xlf
@@ -2051,6 +2051,22 @@
79
+
+ Select ID
+ Select ID
+
+ app/metadata-filter/component/search-dialog.component.ts
+ 35
+
+
+
+ Search Entity Id ()
+ Search Entity Id ()
+
+ app/metadata-filter/component/search-dialog.component.ts
+ 35
+
+