Merge pull request #371 from UiPath/fix/ui-grid-filters

fix(grid): search filters initial value

Author: CalinaCristian

CHANGELOG.md

@@ -1,3 +1,6 @@
+# v14.8.5 (2023-07-10)
+* **grid** search filters initial value
+
 # v14.8.4 (2023-06-20)
 * **grid** select by clicking the row
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-components",
-  "version": "14.8.4",
+  "version": "14.8.5",
   "author": {
     "name": "UiPath Inc",
     "url": "https://uipath.com"

package.json

@@ -123,8 +123,16 @@ export class UiGridSearchFilterDirective<T> extends UiGridFilterDirective<T> imp
         this.filterChange.complete();
     }
 
+    private checkAlreadyExisting(value: ISuggestValue, isSelected?: boolean) {
+        if (this.multiple) {
+            return (isSelected && (this.value as ISuggestValue[] ?? []).find(item => item.id === value.id));
+        }
+
+        return false;
+    }
+
     private handleMultiple(value?: ISuggestValue, isSelected?: boolean) {
-        if (!value) {
+        if (!value || this.checkAlreadyExisting(value, isSelected)) {
             return;
         }
 

projects/angular/components/ui-grid/src/filters/ui-grid-search-filter.directive.ts

@@ -38,6 +38,7 @@ import {
     ResizeStrategy,
 } from '@uipath/angular/components/ui-grid';
 import {
+    ISuggestValueData,
     ISuggestValues,
     UiSuggestComponent,
 } from '@uipath/angular/components/ui-suggest';
@@ -1327,7 +1328,7 @@ describe('Component: UiGrid', () => {
                                 [searchable]="true"
                                 title="String Header"
                                 width="50%">
-                    <ui-grid-search-filter [searchSourceFactory]="searchFactory"></ui-grid-search-filter>
+                    <ui-grid-search-filter [searchSourceFactory]="searchFactory" [value]="value" [multiple]="multiple"></ui-grid-search-filter>
                 </ui-grid-column>
             </ui-grid>
         `,
@@ -1343,6 +1344,9 @@ describe('Component: UiGrid', () => {
         showAllOption?: boolean;
         search?: boolean;
 
+        value?: ISuggestValueData<ITestEntity>[];
+        multiple = false;
+
         searchFactory = (): Observable<ISuggestValues<any>> => of({
             data: this.dropdownItemList
                 .map(
@@ -1372,7 +1376,7 @@ describe('Component: UiGrid', () => {
             fixture = TestBed.createComponent(TestFixtureGridHeaderWithFilterComponent);
             component = fixture.componentInstance;
             grid = component.grid;
-            grid.data = generateListFactory(generateEntity)();
+            component.data = generateListFactory(generateEntity)();
         });
 
         afterEach(() => {
@@ -1614,6 +1618,26 @@ describe('Component: UiGrid', () => {
 
                 expect(searchFilter.items.length).toEqual(0);
             }));
+
+            it('should correctly set the initial value', () => {
+                component.multiple = true;
+                component.value = [{
+                    id: component.data?.[0]?.id ?? '',
+                    text: component.data?.[0]?.myString ?? '',
+                }];
+
+                fixture.detectChanges();
+
+                expect(grid.filterManager.filter$.value).toEqual([{
+                    method: undefined as any,
+                    property: 'myString',
+                    value: [component.data?.[0]?.id ?? ''] as any,
+                    meta: [{
+                        id: component.data?.[0]?.id ?? '',
+                        text: component.data?.[0]?.myString ?? '',
+                    }],
+                }]);
+            });
         });
 
         describe('Event: dropdown filter change', () => {

projects/angular/components/ui-grid/src/ui-grid.component.spec.ts

@@ -1,6 +1,6 @@
 {
     "name": "@uipath/angular",
-    "version": "14.8.4",
+    "version": "14.8.5",
     "license": "MIT",
     "author": {
         "name": "UiPath Inc",