#1484 - clean search result when nothing is typed in the search input (#1502)

This commit is contained in:
Vito 2017-01-19 03:52:06 -08:00 committed by Eugenio Romano
parent 4653b9ad23
commit dcee6abc35
8 changed files with 35 additions and 13 deletions

View File

@ -11,6 +11,6 @@
</button>
</li>
<div *ngIf="userList?.length === 0" id="no-user-found">
No user found to involve
{{'PEOPLE.SEARCH.NO_USERS' | translate }}
</div>
</ul>

View File

@ -83,7 +83,7 @@ describe('ActivitiPeopleSearch', () => {
fixture.whenStable()
.then(() => {
expect(element.querySelector('#no-user-found')).not.toBeNull();
expect(element.querySelector('#no-user-found').textContent).toContain('No user found to involve');
expect(element.querySelector('#no-user-found').textContent).toContain('PEOPLE.SEARCH.NO_USERS');
});
});

View File

@ -58,9 +58,11 @@ export class ActivitiPeopleSearch implements OnInit, AfterViewInit {
this.searchUser
.valueChanges
.debounceTime(200)
.subscribe((event) => {
if (event) {
.subscribe((event: string) => {
if (event && event.trim()) {
this.onSearch.emit(event);
} else {
this.userList = [];
}
});
}
@ -98,8 +100,4 @@ export class ActivitiPeopleSearch implements OnInit, AfterViewInit {
let lastName = user.lastName && user.lastName !== 'null' ? user.lastName : 'N/A';
return firstName + ' - ' + lastName;
}
cleanSearch() {
this.searchUser.reset();
}
}

View File

@ -29,7 +29,7 @@
</activiti-people-search>
</div>
<div class="mdl-dialog__actions">
<button type="button" id="close-people-dialog" (click)="activitipeoplesearch.cleanSearch();cancel()" class="mdl-button close">
<button type="button" id="close-people-dialog" (click)="closeDialog()" class="mdl-button close">
{{'PEOPLE.DIALOG_CLOSE' | translate }}
</button>
</div>

View File

@ -111,10 +111,24 @@ describe('ActivitiPeople', () => {
it('should close dialog when clicked on cancel', () => {
activitiPeopleComponent.showDialog();
expect(element.querySelector('#addPeople')).not.toBeNull();
activitiPeopleComponent.cancel();
activitiPeopleComponent.closeDialog();
let dialogWindow = <HTMLElement> element.querySelector('#add-people-dialog');
expect(dialogWindow.getAttribute('open')).toBeNull();
});
it('should reset search input when the dialog is closed', () => {
let userInputSearch: HTMLInputElement;
activitiPeopleComponent.showDialog();
expect(element.querySelector('#addPeople')).not.toBeNull();
userInputSearch = <HTMLInputElement> element.querySelector('#userSearchText');
userInputSearch.value = 'fake-search-value';
activitiPeopleComponent.closeDialog();
activitiPeopleComponent.showDialog();
userInputSearch = <HTMLInputElement> element.querySelector('#userSearchText');
expect(userInputSearch).not.toBeNull();
expect(userInputSearch.value).toBeFalsy();
});
});
describe('when there are involved people', () => {

View File

@ -48,6 +48,9 @@ export class ActivitiPeople {
@ViewChild('dialog')
dialog: any;
@ViewChild('activitipeoplesearch')
activitipeoplesearch: any;
private peopleSearchObserver: Observer<User[]>;
peopleSearch$: Observable<User[]>;
@ -74,10 +77,11 @@ export class ActivitiPeople {
}
}
public cancel() {
public closeDialog() {
if (this.dialog) {
this.dialog.nativeElement.close();
this.peopleSearchObserver.next([]);
this.activitipeoplesearch.searchUser.reset();
}
}

View File

@ -78,6 +78,9 @@
}
},
"PEOPLE": {
"DIALOG_CLOSE": "CLOSE"
"DIALOG_CLOSE": "CLOSE",
"SEARCH": {
"NO_USERS": "No user found to involve"
}
}
}

View File

@ -34,6 +34,9 @@
}
},
"PEOPLE": {
"DIALOG_CLOSE": "CHIUDI"
"DIALOG_CLOSE": "CHIUDI",
"SEARCH": {
"NO_USERS": "Nessun utente trovato"
}
}
}