inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-7363] Search - Advanced Filters - visual bugs in Logic and Properties filters (#9914)

Browse Source
This commit is contained in:
jacekpluta
2024-08-05 08:59:08 +02:00
committed by GitHub
parent 686c7108d8
commit 979ded6c8f
4 changed files with 22 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.html
View File

@@ -19,6 +19,7 @@
placeholder="{{ placeholder | translate }}"
aria-controls="adf-search-chip-autocomplete"
#optionInput
#autocompleteTrigger="matAutocompleteTrigger"
[formControl]="formCtrl"
[matAutocomplete]="auto"
[matChipInputFor]="chipList"
@@ -26,7 +27,7 @@
[attr.aria-label]="placeholder | translate"
class="adf-search-properties-file-input"
(matChipInputTokenEnd)="add($event)"
(blur)="activeAnyOption = false"
(blur)="activeAnyOption = false; autocompleteTrigger.closePanel()"
data-automation-id="adf-search-chip-autocomplete-input">
</mat-chip-grid>
<mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)" id="adf-search-chip-autocomplete"

3
lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.html
View File

@@ -4,7 +4,6 @@
<input type="text"
[(ngModel)]="searchCondition[LogicalSearchFields[field]]"
placeholder="{{ ('SEARCH.LOGICAL_SEARCH.' + field + '_HINT') | translate }}"
[attr.aria-label]="('SEARCH.LOGICAL_SEARCH.' + field + '_HINT') | translate"
(change)="onInputChange()"/>
[attr.aria-label]="('SEARCH.LOGICAL_SEARCH.' + field + '_HINT') | translate"/>
</div>
</div>

6
lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.spec.ts
View File

@@ -99,13 +99,14 @@ describe('SearchLogicalFilterComponent', () => {
expect(component.hasValidValue()).toBeTrue();
});
it('should update display value after phrases changes', () => {
it('should update display value after phrases changes and user user clicks submit', () => {
spyOn(component.displayValue$, 'next');
enterNewPhrase('test2', 0);
component.submitValues();
expect(component.displayValue$.next).toHaveBeenCalledOnceWith(` SEARCH.LOGICAL_SEARCH.${Object.keys(LogicalSearchFields)[0]}: test2`);
});
it('should have correct display value after each field has at least one phrase', () => {
it('should have correct display value after each field has at least one phrase and user clicks submit', () => {
spyOn(component.displayValue$, 'next');
enterNewPhrase('test1', 0);
enterNewPhrase('test2', 1);
@@ -115,6 +116,7 @@ describe('SearchLogicalFilterComponent', () => {
const displayVal2 = ` SEARCH.LOGICAL_SEARCH.${Object.keys(LogicalSearchFields)[1]}: test2`;
const displayVal3 = ` SEARCH.LOGICAL_SEARCH.${Object.keys(LogicalSearchFields)[2]}: test3`;
const displayVal4 = ` SEARCH.LOGICAL_SEARCH.${Object.keys(LogicalSearchFields)[3]}: test4`;
component.submitValues();
expect(component.displayValue$.next).toHaveBeenCalledWith(displayVal1 + displayVal2 + displayVal4 + displayVal3);
});

28
lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts
View File

@@ -29,7 +29,7 @@ export enum LogicalSearchFields {
MATCH_EXACT = 'matchExact'
}
export type LogicalSearchConditionEnumValuedKeys = { [T in LogicalSearchFields]: string; };
export type LogicalSearchConditionEnumValuedKeys = { [T in LogicalSearchFields]: string };
// eslint-disable-next-line @typescript-eslint/no-empty-interface
export interface LogicalSearchCondition extends LogicalSearchConditionEnumValuedKeys {}
@@ -55,20 +55,16 @@ export class SearchLogicalFilterComponent implements SearchWidget, OnInit {
this.clearSearchInputs();
}
onInputChange() {
this.updateDisplayValue();
}
submitValues() {
if (this.hasValidValue() && this.id && this.context && this.settings && this.settings.field) {
this.updateDisplayValue();
const fields = this.settings.field.split(',').map((field) => field += ':');
const fields = this.settings.field.split(',').map((field) => (field += ':'));
let query = '';
Object.keys(this.searchCondition).forEach((key) => {
if (this.searchCondition[key] !== '') {
let connector = '';
let subQuery = '';
switch(key) {
switch (key) {
case LogicalSearchFields.MATCH_ALL:
case LogicalSearchFields.MATCH_EXACT:
connector = 'AND';
@@ -88,12 +84,16 @@ export class SearchLogicalFilterComponent implements SearchWidget, OnInit {
if (key === LogicalSearchFields.MATCH_EXACT) {
fieldQuery += field + '"' + this.searchCondition[key].trim() + '"';
} else {
this.searchCondition[key].split(' ').filter((condition: string) => condition !== '').forEach((phrase: string) => {
const refinedPhrase = '"' + phrase + '"';
fieldQuery += fieldQuery === '(' ?
`${key === LogicalSearchFields.EXCLUDE ? 'NOT ' : ''}${field}${refinedPhrase}` :
` ${connector} ${field}${refinedPhrase}`;
});
this.searchCondition[key]
.split(' ')
.filter((condition: string) => condition !== '')
.forEach((phrase: string) => {
const refinedPhrase = '"' + phrase + '"';
fieldQuery +=
fieldQuery === '('
? `${key === LogicalSearchFields.EXCLUDE ? 'NOT ' : ''}${field}${refinedPhrase}`
: ` ${connector} ${field}${refinedPhrase}`;
});
}
subQuery += `${fieldQuery})`;
});
@@ -103,6 +103,8 @@ export class SearchLogicalFilterComponent implements SearchWidget, OnInit {
});
this.context.queryFragments[this.id] = query;
this.context.update();
} else {
this.reset();
}
}