@zeedhi/teknisa-components-common 1.130.0 → 1.132.0

package/tests/unit/components/tek-grid/grid-filter-button.spec.ts

@@ -84,6 +84,27 @@ describe('TekGridFilterButton', () => {
 
       expect(filterButton.grid).toEqual(instance);
     });
+
+    it('should load grid by gridName after the filter button is created', () => {
+      const filterButton = new TekGridFilterButton({
+        name: 'external-filter-button',
+        component: 'TekGridFilterButton',
+        gridName: 'grid-created-after-filter-button',
+      });
+
+      expect(filterButton.grid).toBeUndefined();
+
+      const instance = new TekGrid({
+        name: 'grid-created-after-filter-button',
+        component: 'TekGrid',
+      });
+      instance.onCreated();
+
+      filterButton.loadGrid();
+
+      expect(filterButton.grid).toEqual(instance);
+      expect((instance as any).gridBase.filterButton).toBe(filterButton);
+    });
   });
 
   describe('filterClick()', () => {
@@ -117,6 +138,85 @@ describe('TekGridFilterButton', () => {
       spyMetadata.mockReset();
     });
 
+    it('should open the filter modal from an external button when grid filterButton is false', () => {
+      const instance = new TekGrid({
+        name: 'grid_external_filter_button',
+        component: 'TekGrid',
+        filterButton: false,
+        columns: [
+          { name: 'id' },
+          { name: 'name', filterable: true, filterProps: [{ name: 'name_edit', label: 'name' }] },
+        ],
+      });
+
+      let formElements: any = [];
+      const spy = jest.spyOn(ModalService, 'create').mockImplementation((modal: IModal) => {
+        const form = getChild<IForm>(modal.children || [], `${instance.name}-filter-form`);
+        formElements = form.children;
+
+        return new Modal(modal);
+      });
+      instance.onCreated();
+
+      const button = new TekGridFilterButton({
+        name: 'external-filter-button',
+        component: 'TekGridFilterButton',
+        gridName: instance.name,
+      });
+      setClick(button);
+
+      expect(button.grid).toEqual(instance);
+      expect((instance as any).gridBase.filterButton).toBe(button);
+      expect(formElements[0].name).toBe(`${instance.name}-filter-AND-CONTAINS-name-0`);
+
+      spy.mockReset();
+    });
+
+    it('should not open the filter modal when click cannot resolve a grid', () => {
+      const spy = jest.spyOn(ModalService, 'create');
+      const button = new TekGridFilterButton({
+        name: 'external-filter-button-without-grid',
+        component: 'TekGridFilterButton',
+        gridName: 'missing-grid',
+      });
+
+      setClick(button);
+
+      expect(button.grid).toBeUndefined();
+      expect(spy).not.toBeCalled();
+
+      spy.mockReset();
+    });
+
+    it('should close the owning filter modal from the header close button', () => {
+      const instance = new TekGrid({
+        name: 'grid_filter_close_button',
+        component: 'TekGrid',
+      });
+
+      let closeButton: IButton = { name: 'close', component: 'ZdButton' };
+      const spy = jest.spyOn(ModalService, 'create').mockImplementation((modal: IModal) => {
+        const header = getChild(modal.children || [], `${instance.name}-filter-header-container`);
+        closeButton = getChild(header.children || [], `${instance.name}-filter-close-button`);
+
+        return new Modal(modal);
+      });
+      instance.onCreated();
+
+      const buttonProps = getChild<ITekGridFilterButton>(instance.toolbarSlot, `${instance.name}_filterButton`);
+      const button = new TekGridFilterButton(buttonProps);
+      setClick(button);
+
+      const hideSpy = jest.spyOn((button as any).filterModal, 'hide');
+      const closeButtonObject = new Button(closeButton);
+      setClick(closeButtonObject);
+
+      expect(closeButton.component).toBe('ZdButton');
+      expect(hideSpy).toBeCalled();
+
+      spy.mockReset();
+    });
+
     it('should call events', () => {
       let filterClickCalled = false;
       const instance = new TekGrid({
@@ -207,6 +307,49 @@ describe('TekGridFilterButton', () => {
       spy.mockReset();
     });
 
+    it('should create filter form elements without dataValueOut from componentProps', () => {
+      const instance = new TekGrid({
+        name: 'grid_filterClick_dataValueOut',
+        component: 'TekGrid',
+        columns: [
+          {
+            name: 'name',
+            filterable: true,
+            componentProps: {
+              name: 'name_edit',
+              component: 'ZdSelect',
+              dataText: 'description',
+              dataValueOut: 'id',
+            },
+            filterProps: [{ name: 'name_filter', label: 'name' }],
+          },
+          {
+            name: 'description',
+            filterable: true,
+            filterProps: [{ name: 'description_filter', label: 'description' }],
+          },
+        ],
+      });
+
+      let formElements: any = [];
+      const spy = jest.spyOn(ModalService, 'create').mockImplementation((modal: IModal) => {
+        const form = getChild<IForm>(modal.children || [], `${instance.name}-filter-form`);
+        formElements = form.children;
+
+        return new Modal(modal);
+      });
+      instance.onCreated();
+      (instance.columns[1] as any).componentProps = undefined;
+      clickOnFilterButton(instance);
+
+      expect(formElements[0].component).toBe('ZdSelect');
+      expect(formElements[0].dataText).toBe('description');
+      expect(formElements[0].dataValueOut).toBeUndefined();
+      expect(formElements[1].name).toBe(`${instance.name}-filter-AND-CONTAINS-description-0`);
+
+      spy.mockReset();
+    });
+
     it('when creating a SelectMultiple filter, default should not add showCheckboxAll prop', () => {
       const instance = new TekGrid({
         name: 'grid_filterClick5',
@@ -318,7 +461,7 @@ describe('TekGridFilterButton', () => {
       formObject.value['grid_filterClick5-filter-AND-CONTAINS-id-0'] = ['example'];
       setClick(applyButtonObject);
 
-      expect(instance.datasource.filter).toEqual({});
+      expect(instance.datasource.filter).toEqual({ id: ['example'] });
 
       selectObject.checkboxAll = true;
       setClick(applyButtonObject);
@@ -327,7 +470,7 @@ describe('TekGridFilterButton', () => {
 
       (Config as any).set({ selectAllCompatibilityMode: true });
       setClick(applyButtonObject);
-      expect(instance.datasource.filter).toEqual({});
+      expect(instance.datasource.filter).toEqual({ id: 'T' });
 
       spy.mockReset();
     });
@@ -952,10 +1095,10 @@ describe('TekGridFilterButton', () => {
       };
       const applyButtonObject = new Button(applyButton);
       setClick(applyButtonObject);
-      expect(instance.datasource.filter).toEqual({});
+      expect(instance.datasource.filter).toEqual({ id: '1;2;3', name: 'teste', salary: '1000' });
       expect(beforeApplyFilterCalled).toBeTruthy();
       expect(changeLayoutCalled).toBeTruthy();
-      expect(instance.columnHasFilterData({ name: 'name' } as TekGridColumn)).toBe(undefined);
+      expect(instance.columnHasFilterData({ name: 'name' } as TekGridColumn)).toBe(true);
 
       setClick(applyButtonObject, { defaultPrevented: true });
       expect(spyDatasourceGet).toBeCalledTimes(1);

package/tests/unit/components/tek-grid/grid.spec.ts

@@ -15,7 +15,7 @@ import {
   ITekGrid,
   ITekGridFilterButton,
   ITekGridGroupFooter,
-  TekGrid, TekGridColumn, TekGridFilterButton, TekRestDatasource,
+  TekGrid, TekGridColumn, TekGridExportButton, TekGridFilterButton, TekRestDatasource,
 } from '../../../../src';
 import { ReportFilter } from '../../../../src/utils';
 import { setClick, getChild } from '../../../__helpers__';
@@ -232,12 +232,19 @@ describe('TekGrid', () => {
         ],
       });
 
-      expect((instance as any).gridBase.exportConfigButtons[0].label).toBeUndefined();
-      expect((instance as any).gridBase.exportConfigButtons[0].iconName).toBe('icon');
-      expect((instance as any).gridBase.exportConfigButtons[0].name).toBe('grid_export_pdf_landscape');
-      expect((instance as any).gridBase.exportConfigButtons[0].component).toBe('ZdButton');
-      expect((instance as any).gridBase.exportConfigButtons[0].flat).toBeTruthy();
-      expect((instance as any).gridBase.exportConfigButtons[0].events).toBeDefined();
+      const exportButton = new TekGridExportButton({
+        name: 'grid_export_dropdown',
+        component: 'TekGridExportButton',
+        grid: instance,
+      });
+      const exportConfigButton = exportButton.children![0];
+
+      expect(exportConfigButton.label).toBeUndefined();
+      expect(exportConfigButton.iconName).toBe('icon');
+      expect(exportConfigButton.name).toBe('grid_export_pdf_landscape');
+      expect(exportConfigButton.component).toBe('ZdButton');
+      expect(exportConfigButton.flat).toBeTruthy();
+      expect(exportConfigButton.events).toBeDefined();
     });
 
     it('should create new TekGrid with accessor datasource', () => {
@@ -1032,6 +1039,10 @@ describe('TekGrid', () => {
 
       await flushPromises();
 
+      instance.navigateDatasource(false);
+      expect(instance.datasource.currentRow).toEqual(instance.groupedData[0]);
+      instance.datasource.currentRow = {};
+
       dispatchEvent('arrowdown', {}); // arrow down
       expect(instance.datasource.currentRow).toEqual(instance.groupedData[0]);
 
@@ -1198,11 +1209,10 @@ describe('TekGrid', () => {
       spyMetadata.mockReset();
     });
 
-    it('when using cellSelection, should use viewNavigate', async () => {
+    it('when grouped, should use viewNavigate', async () => {
       const instance = new TekGrid({
         name: 'grid_navigation_1',
         component: 'TekGrid',
-        cellSelection: true,
         columns: [
           {
             name: 'name',
@@ -1854,6 +1864,46 @@ describe('TekGrid', () => {
       httpSpy.mockReset();
     });
 
+    it('should not call loadAfterTasks when initialized with lazyLoad datasource', async () => {
+      const instance = createAndMount({
+        name: 'grid_grouping_lazy_load',
+        component: 'TekGrid',
+        columns: [
+          {
+            name: 'id',
+            label: 'id',
+          },
+          {
+            name: 'name',
+            label: 'name',
+          },
+          {
+            name: 'department',
+            label: 'department',
+            grouped: true,
+          },
+        ],
+        datasource: {
+          uniqueKey: 'id',
+          route: '/zeedhi',
+          type: 'tek-rest',
+          limit: 10,
+          watchUrl: false,
+          lazyLoad: true,
+        },
+      });
+
+      const updateGroupedDataSpy = jest.spyOn(instance, 'updateGroupedData');
+      const loadAfterTasksSpy = jest.spyOn(instance, 'loadAfterTasks');
+
+      jest.runAllTimers();
+
+      expect(updateGroupedDataSpy).toHaveBeenCalled();
+      expect(loadAfterTasksSpy).not.toHaveBeenCalled();
+
+      loadAfterTasksSpy.mockRestore();
+    });
+
     it('editedRows should return cleaned rows', async () => {
       const instance = new TekGrid({
         name: 'grid_grouping_4',
@@ -2286,6 +2336,126 @@ describe('TekGrid', () => {
 
       expect(grid.columnHasFilterData(column)).toBe(true);
     });
+
+    it('should search only in columns listed in searchIn when searchIn is non-empty', async () => {
+      const instance = new TekGrid({
+        name: 'grid_search',
+        component: 'TekGrid',
+        columns: [
+          { name: 'id' },
+          {
+            name: 'employee_id',
+            componentProps: {
+              name: 'ZdSelect',
+              dataText: ['name'],
+              datasource: {
+                type: 'tek-rest',
+                uniqueKey: 'id',
+                route: '/zeedhi',
+                lazyLoad: false,
+              },
+            },
+          },
+          {
+            name: 'department_id',
+            componentProps: {
+              name: 'ZdSelect',
+              dataText: ['name'],
+              datasource: {
+                type: 'tek-rest',
+                uniqueKey: 'id',
+                route: '/departments',
+                lazyLoad: false,
+              },
+            },
+          },
+        ],
+        datasource: {
+          type: 'tek-rest',
+          lazyLoad: true,
+          route: '/grid',
+          searchIn: ['employee_id'],
+        } as any,
+      });
+
+      await instance.setSearch('1');
+
+      expect(instance.datasource).toBeInstanceOf(TekRestDatasource);
+      expect((instance.datasource as TekRestDatasource).searchJoin).toEqual({ employee_id: [1, 15] });
+      expect(httpSpy).toHaveBeenCalledTimes(2);
+    });
+
+    it('should search all lookup columns when searchIn is empty', async () => {
+      const instance = new TekGrid({
+        name: 'grid_search_empty_searchin',
+        component: 'TekGrid',
+        columns: [
+          { name: 'id' },
+          {
+            name: 'employee_id',
+            componentProps: {
+              name: 'ZdSelect',
+              dataText: ['name'],
+              datasource: {
+                type: 'tek-rest',
+                uniqueKey: 'id',
+                route: '/zeedhi',
+                lazyLoad: false,
+              },
+            },
+          },
+        ],
+        datasource: {
+          type: 'tek-rest',
+          lazyLoad: true,
+          route: '/grid',
+          searchIn: [],
+        } as any,
+      });
+
+      await instance.setSearch('1');
+
+      expect(instance.datasource).toBeInstanceOf(TekRestDatasource);
+      expect((instance.datasource as TekRestDatasource).searchJoin).toEqual({ employee_id: [1, 15] });
+      expect(httpSpy).toHaveBeenCalledTimes(2);
+    });
+
+    it('should fall back to empty array when datasource.searchIn is null', async () => {
+      const instance = new TekGrid({
+        name: 'grid_search_null_searchin',
+        component: 'TekGrid',
+        columns: [
+          { name: 'id' },
+          {
+            name: 'employee_id',
+            componentProps: {
+              name: 'ZdSelect',
+              dataText: ['name'],
+              datasource: {
+                type: 'tek-rest',
+                uniqueKey: 'id',
+                route: '/zeedhi',
+                lazyLoad: false,
+              },
+            },
+          },
+        ],
+        datasource: {
+          type: 'tek-rest',
+          lazyLoad: true,
+          route: '/grid',
+          searchIn: [],
+        } as any,
+      });
+
+      (instance.datasource as any).searchIn = null;
+
+      await instance.setSearch('1');
+
+      expect(instance.datasource).toBeInstanceOf(TekRestDatasource);
+      expect((instance.datasource as TekRestDatasource).searchJoin).toEqual({ employee_id: [1, 15] });
+      expect(httpSpy).toHaveBeenCalledTimes(2);
+    });
   });
 
   describe('rowClick', () => {
@@ -3372,6 +3542,9 @@ describe('TekGrid', () => {
       expect(toolbarSlot.find((c: IComponentRender) => c.name?.includes('_title'))).toBeUndefined();
       expect(toolbarSlot.find((c: IComponentRender) => c.name?.includes('_hideTooltip'))).toBeUndefined();
       expect(toolbarSlot[0].name).toBe('grid_toolbarDiv');
+      expect(getChild<any>(toolbarSlot, 'grid_columnsButton').gridName).toBe('grid');
+      expect(getChild<any>(toolbarSlot, 'grid_columnsButton').iterableComponentName).toBeUndefined();
+      expect(getChild<IComponentRender>(toolbarSlot, 'grid_layout_options').gridName).toBe('grid');
     });
   });
 });