fix: redraw all open row details whenever the grid is re-rendered

ghiscoding · Sep 29, 2024 · fbb5383 · fbb5383
1 parent bffc3ee
commit fbb5383
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 8 deletions.
diff --git a/src/app/modules/angular-slickgrid/extensions/__tests__/slickRowDetailView.spec.ts b/src/app/modules/angular-slickgrid/extensions/__tests__/slickRowDetailView.spec.ts
@@ -76,7 +76,7 @@ const gridStub = {
   getSelectionModel: jest.fn(),
   setSelectionModel: jest.fn(),
   sanitizeHtmlString: (s: string) => s,
-  onColumnsReordered: new SlickEvent(),
+  onRendered: new SlickEvent(),
   onSelectedRowsChanged: new SlickEvent(),
   onSort: new SlickEvent(),
 } as unknown as SlickGrid;
@@ -184,7 +184,7 @@ describe('SlickRowDetailView', () => {
         columnsMock = [{ id: 'field1', field: 'field1', width: 100, cssClass: 'red' }];
         jest.spyOn(gridStub, 'getOptions').mockReturnValue(gridOptionsMock);
         jest.clearAllMocks();
-        gridStub.onColumnsReordered = new SlickEvent();
+        gridStub.onRendered = new SlickEvent();
         gridStub.onSort = new SlickEvent();
       });
 
@@ -379,7 +379,7 @@ describe('SlickRowDetailView', () => {
         expect(onRowBackViewSpy).toHaveBeenCalledWith(expect.anything(), { item: columnsMock[0], rowId: 0, rowIndex: 0, expandedRows: [columnsMock[0] as any], rowIdsOutOfViewport: [], grid: gridStub });
       });
 
-      it('should call Angular Util "createAngularComponentAppendToDom" when grid "onColumnsReordered" is triggered', (done) => {
+      it('should call Angular Util "createAngularComponentAppendToDom" when grid "onRendered" is triggered', (done) => {
         const mockColumn = { id: 'field1', field: 'field1', width: 100, cssClass: 'red', __collapsed: true };
         const handlerSpy = jest.spyOn(plugin.eventHandler, 'subscribe');
         const appendSpy = jest.spyOn(angularUtilServiceStub, 'createAngularComponentAppendToDom').mockReturnValue({ componentRef: { instance: jest.fn() } } as any);
@@ -388,7 +388,7 @@ describe('SlickRowDetailView', () => {
         plugin.onBeforeRowDetailToggle = new SlickEvent();
         plugin.register();
         plugin.eventHandler.subscribe(plugin.onBeforeRowDetailToggle, () => {
-          gridStub.onColumnsReordered.notify({ impactedColumns: [mockColumn] } as any, new SlickEventData(), gridStub);
+          gridStub.onRendered.notify({ impactedColumns: [mockColumn] } as any, new SlickEventData(), gridStub);
           expect(appendSpy).toHaveBeenCalledWith(TestComponent, expect.objectContaining({ className: 'container_field1' }), {
             model: mockColumn,
             addon: expect.anything(),

diff --git a/src/app/modules/angular-slickgrid/extensions/slickRowDetailView.ts b/src/app/modules/angular-slickgrid/extensions/slickRowDetailView.ts
@@ -191,8 +191,8 @@ export class SlickRowDetailView extends UniversalSlickRowDetailView {
         // --
         // hook some events needed by the Plugin itself
 
-        // we need to redraw the open detail views if we change column position (column reorder)
-        this.eventHandler.subscribe(this._grid.onColumnsReordered, this.redrawAllViewComponents.bind(this));
+        // redraw anytime the grid is re-rendered
+        this.eventHandler.subscribe(this._grid.onRendered, this.redrawAllViewComponents.bind(this));
 
         // on row selection changed, we also need to redraw
         if (this.gridOptions.enableRowSelection || this.gridOptions.enableCheckboxSelector) {
@@ -205,8 +205,7 @@ export class SlickRowDetailView extends UniversalSlickRowDetailView {
         // on filter changed, we need to re-render all Views
         this._subscriptions.push(
           this.eventPubSubService?.subscribe('onFilterChanged', this.redrawAllViewComponents.bind(this)),
-          this.eventPubSubService?.subscribe('onGridMenuClearAllFilters', () => window.setTimeout(() => this.redrawAllViewComponents())),
-          this.eventPubSubService?.subscribe('onGridMenuClearAllSorting', () => window.setTimeout(() => this.redrawAllViewComponents())),
+          this.eventPubSubService?.subscribe(['onGridMenuClearAllFilters', 'onGridMenuClearAllSorting'], () => window.setTimeout(() => this.redrawAllViewComponents())),
         );
       }
     }