From c8d4dfc116238795b848a3f5862c594fc36c6663 Mon Sep 17 00:00:00 2001 From: Martin Maul Date: Wed, 22 Nov 2023 12:23:28 +0100 Subject: [PATCH 1/6] feature(UI):[TRACEFOSS-2746] fixed bugs --- .../multi-select-autocomplete.component.html | 12 ++++--- .../multi-select-autocomplete.component.ts | 32 +++++++++++++++---- 2 files changed, 32 insertions(+), 12 deletions(-) diff --git a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.html b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.html index 3b6c7adcd1..38f206af7d 100644 --- a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.html +++ b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.html @@ -27,6 +27,7 @@ (change)="toggleSelectAll($event)"> @@ -41,15 +42,16 @@
{{'multiSelect.suggestionError' | i18n}}
- - {{option.display}} - + + {{option.display}} + + {{this.searchElement}} - +
{{displayValue()}}
diff --git a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.ts b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.ts index afe296d52c..54c20647d0 100644 --- a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.ts +++ b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.ts @@ -141,14 +141,10 @@ export class MultiSelectAutocompleteComponent implements OnChanges { } } else { - const filteredValues = this.getFilteredOptionsValues(); - this.selectedValue = this.selectedValue.filter( - item => !filteredValues.includes(item), - ); + this.selectedValue = []; } this.formControl.patchValue(this.selectedValue); this.selectionChange.emit(this.selectedValue); - this.searchElement = this.selectedValue; }; changeSearchTextOption() { @@ -161,6 +157,9 @@ export class MultiSelectAutocompleteComponent implements OnChanges { } displayValue() { + if(!this.searchElement.length) { + return; + } let suffix = ''; let displayValue; // add +X others label if multiple @@ -184,7 +183,12 @@ export class MultiSelectAutocompleteComponent implements OnChanges { } filterItem(value: any): void { + if(!this.searchElement.length) { + return; + } + if (!value) { + this.filteredOptions = []; return; } @@ -244,14 +248,20 @@ export class MultiSelectAutocompleteComponent implements OnChanges { } hideOption(option: any): boolean { + if(!this.searchElement.length) { + return true; + } return !(this.filteredOptions.indexOf(option) > -1); } // Returns plain strings array of filtered values getFilteredOptionsValues(): string[] { + console.log("getFiltered") const filteredValues = []; this.filteredOptions.forEach(option => { - filteredValues.push(option.value); + if(option.length) { + filteredValues.push(option.value); + } }); return filteredValues; } @@ -276,7 +286,7 @@ export class MultiSelectAutocompleteComponent implements OnChanges { this.selectedValue = []; this.startDate = null; this.endDate = null; - this.filterItem(''); + this.filteredOptions = []; } dateFilter(){ @@ -285,6 +295,9 @@ export class MultiSelectAutocompleteComponent implements OnChanges { onSelectionChange(val: any) { + if(!this.searchElement.length) { + return; + } const filteredValues = this.getFilteredOptionsValues(); const selectedCount = this.selectedValue.filter(item => filteredValues.includes(item)).length; @@ -308,4 +321,9 @@ export class MultiSelectAutocompleteComponent implements OnChanges { } } + filterKeyCommands(event: any) { + if (event.key === 'Enter' || (event.ctrlKey && event.key === 'a')) { + event.stopPropagation(); + } + } } From 6e92e3e26f824e3b145248524b0f06154f861737 Mon Sep 17 00:00:00 2001 From: Martin Maul Date: Wed, 22 Nov 2023 12:33:48 +0100 Subject: [PATCH 2/6] feature(UI):[TRACEFOSS-2746] fixed bugs --- .../multi-select-autocomplete.component.spec.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts index 3eba53a286..ea4430cb9e 100644 --- a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts +++ b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts @@ -41,6 +41,7 @@ describe('MultiSelectAutocompleteComponent', () => { const {fixture} = await renderMultiSelectAutoCompleteComponent(); const {componentInstance} = fixture; + componentInstance.searchElement = 'B' const selectedOptions = [SemanticDataModel.BATCH]; componentInstance.selectedValue = selectedOptions; fixture.detectChanges(); @@ -74,7 +75,7 @@ describe('MultiSelectAutocompleteComponent', () => { const {componentInstance} = fixture; componentInstance.selectedValue = ['TestValue']; - + componentInstance.searchElement = 'TestValue'; const result = componentInstance.displayValue(); expect(result).toBe('TestValue'); @@ -87,6 +88,7 @@ describe('MultiSelectAutocompleteComponent', () => { componentInstance.selectedValue = ['value1', 'value2', 'value3']; // Replace with your test values componentInstance.labelCount = 2; // Replace with the number of labels you expect + componentInstance.searchElement = 'v' componentInstance.options = [ {value: 'value1', display: 'Display1'}, {value: 'value2', display: 'Display2'}, @@ -105,6 +107,7 @@ describe('MultiSelectAutocompleteComponent', () => { componentInstance.selectedValue = ['value1']; // Replace with your test value + componentInstance.searchElement = 'v'; componentInstance.options = [ {value: 'value1', display: 'Display1'}, {value: 'value2', display: 'Display2'}, From 71c73afcdf38395319a288844c4c3dcfe02b706a Mon Sep 17 00:00:00 2001 From: Martin Maul Date: Wed, 22 Nov 2023 12:49:33 +0100 Subject: [PATCH 3/6] feature(UI):[TRACEFOSS-2746] fixed bugs --- .../multi-select-autocomplete.component.spec.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts index ea4430cb9e..80691b9527 100644 --- a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts +++ b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts @@ -313,4 +313,16 @@ describe('MultiSelectAutocompleteComponent', () => { expect(searchElementChangeSpy).toHaveBeenCalledWith(['test']); }) + fit('should return when calling displayValue() without searchElement', async () => { + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + + componentInstance.searchElement = ''; + componentInstance.displayValue(); + + const dValue = componentInstance.displayValue(); + expect(dValue).toEqual(undefined); + + }) + }); From dd3076fd4f9fa391b3e1084054c53df77bbc9a98 Mon Sep 17 00:00:00 2001 From: Martin Maul Date: Wed, 22 Nov 2023 14:01:21 +0100 Subject: [PATCH 4/6] feature(UI):[TRACEFOSS-2746] fixed bugs --- ...ulti-select-autocomplete.component.spec.ts | 40 ++++++++++++++++++- 1 file changed, 39 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts index 80691b9527..2f901bff92 100644 --- a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts +++ b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts @@ -61,12 +61,14 @@ describe('MultiSelectAutocompleteComponent', () => { componentInstance.selectedValue = ['initialValue']; componentInstance.startDate = new Date('2022-02-04'); componentInstance.endDate = new Date('2022-02-04'); + componentInstance.filteredOptions = ['test'] componentInstance.clickClear(); // Assert expect(componentInstance.searchElement).toBe(''); expect(componentInstance.selectedValue).toEqual([]); + expect(componentInstance.filteredOptions).toEqual([]); }); it('should return correct display string when textSearch is true', async () => { @@ -313,7 +315,7 @@ describe('MultiSelectAutocompleteComponent', () => { expect(searchElementChangeSpy).toHaveBeenCalledWith(['test']); }) - fit('should return when calling displayValue() without searchElement', async () => { + it('should return when calling displayValue() without searchElement', async () => { const {fixture} = await renderMultiSelectAutoCompleteComponent(); const {componentInstance} = fixture; @@ -322,7 +324,43 @@ describe('MultiSelectAutocompleteComponent', () => { const dValue = componentInstance.displayValue(); expect(dValue).toEqual(undefined); + }) + + it('should return when calling filterItem() without searchElement', async () => { + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + + componentInstance.searchElement = ''; + componentInstance.filterItem('') + + const option = componentInstance.filteredOptions; + expect(option).toEqual([]); + }) + + it('should return when calling filterItem() without value', async () => { + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + componentInstance.searchElement = 'test'; + componentInstance.filterItem(undefined) + + const option = componentInstance.filteredOptions; + expect(option).toEqual([]); + }) + + it('should return when calling filterItem() without value', async () => { + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + + componentInstance.searchElement = ''; // Set searchElement to an empty string + spyOn(componentInstance, 'getFilteredOptionsValues'); // Mock any necessary methods + + // Act + componentInstance.onSelectionChange({ value: 'someValue' }); + + // Assert + // Add assertions as needed, for example: + expect(componentInstance.selectedValue).toEqual(null); }) }); From 852c8e71cc652bf00296e6f980e8197e4620c603 Mon Sep 17 00:00:00 2001 From: Martin Maul Date: Wed, 22 Nov 2023 14:09:29 +0100 Subject: [PATCH 5/6] feature(UI):[TRACEFOSS-2746] fixed bugs --- ...ulti-select-autocomplete.component.spec.ts | 51 +++++++++++++++++++ 1 file changed, 51 insertions(+) diff --git a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts index 2f901bff92..d91c1091cd 100644 --- a/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts +++ b/frontend/src/app/modules/shared/components/multi-select-autocomplete/multi-select-autocomplete.component.spec.ts @@ -363,4 +363,55 @@ describe('MultiSelectAutocompleteComponent', () => { expect(componentInstance.selectedValue).toEqual(null); }) + it('should stop event propagation for Enter key and Ctrl+A combination', async() => { + // Arrange + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + const eventMock = { + key: 'Enter', + ctrlKey: false, + stopPropagation: jasmine.createSpy('stopPropagation') + }; + + // Act + componentInstance.filterKeyCommands(eventMock); + + // Assert + expect(eventMock.stopPropagation).toHaveBeenCalled(); + }); + + it('should stop event propagation for Ctrl+A combination', async() => { + // Arrange + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + const eventMock = { + key: 'a', + ctrlKey: true, + stopPropagation: jasmine.createSpy('stopPropagation') + }; + + // Act + componentInstance.filterKeyCommands(eventMock); + + // Assert + expect(eventMock.stopPropagation).toHaveBeenCalled(); + }); + + it('should not stop event propagation for other keys', async() => { + // Arrange + const {fixture} = await renderMultiSelectAutoCompleteComponent(); + const {componentInstance} = fixture; + const eventMock = { + key: 'B', + ctrlKey: false, + stopPropagation: jasmine.createSpy('stopPropagation') + }; + + // Act + componentInstance.filterKeyCommands(eventMock); + + // Assert + expect(eventMock.stopPropagation).not.toHaveBeenCalled(); + }); + }); From c3848182a99f76f7d725ad5f86c29fa6f4998e22 Mon Sep 17 00:00:00 2001 From: Martin Maul Date: Wed, 22 Nov 2023 14:46:13 +0100 Subject: [PATCH 6/6] feature(UI):[TRACEFOSS-2746] fixed bugs --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 10ee044baf..eb3b65fa79 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). ### Changed - Fixed helm repository path for backend & frontend (wrong prefix) +- Fixed several bugs in local filtering of the parts table ### Removed - apk upgrade in docker image built as requested by TRG 4.02