fix(gridMenu): command "Togge Filter" disappeared, fixes #438 (#448)

- this command "Toggle Filter Row" disappeared if it happens to have the filter row hidden when calling translate. This PR fixes it but while fixing this, it was also found that the Filter row MUST be visible BEFORE calling the translation service else the filters don't get recreated and that is even worst.

Co-authored-by: Ghislain Beaulac <ghislain.beaulac@se.com>

src/app/modules/angular-slickgrid/components/angular-slickgrid.component.ts

@@ -435,6 +435,11 @@ export class AngularSlickgridComponent implements AfterViewInit, OnDestroy, OnIn
       this.subscriptions.push(
         this.translate.onLangChange.subscribe(() => {
           if (gridOptions.enableTranslate) {
+            if (!this._hideHeaderRowAfterPageLoad) {
+              // before translating, make sure the filter row is visible to avoid having other problems,
+              // because if it's not shown prior to translating then the filters won't be recreated after translating
+              this.grid.setHeaderRowVisibility(true);
+            }
             this.extensionService.translateCellMenu();
             this.extensionService.translateColumnHeaders();
             this.extensionService.translateColumnPicker();
@@ -768,6 +773,7 @@ export class AngularSlickgridComponent implements AfterViewInit, OnDestroy, OnIn
     // if that is the case, we need to hide the headerRow ONLY AFTER all filters got created & dataView exist
     if (this._hideHeaderRowAfterPageLoad) {
       this.showHeaderRow(false);
+      this.sharedService.hideHeaderRowAfterPageLoad = this._hideHeaderRowAfterPageLoad;
     }
 
     // after the DataView is created & updated execute some processes
@@ -936,6 +942,8 @@ export class AngularSlickgridComponent implements AfterViewInit, OnDestroy, OnIn
     if (!options.enableFiltering && options.enablePagination && this._isLocalGrid) {
       options.enableFiltering = true;
       options.showHeaderRow = false;
+      this._hideHeaderRowAfterPageLoad = true;
+      this.sharedService.hideHeaderRowAfterPageLoad = true;
     }
     return options;
   }

src/app/modules/angular-slickgrid/extensions/gridMenuExtension.ts

@@ -198,7 +198,7 @@ export class GridMenuExtension implements Extension {
     const backendApi = this.sharedService.gridOptions.backendServiceApi || null;
     const gridMenuCustomItems: Array<GridMenuItem | 'divider'> = [];
 
-    if (this.sharedService.gridOptions && (this.sharedService.gridOptions.enableFiltering && this.sharedService.gridOptions.showHeaderRow)) {
+    if (this.sharedService.gridOptions && (this.sharedService.gridOptions.enableFiltering && !this.sharedService.hideHeaderRowAfterPageLoad)) {
       // show grid menu: Clear all Filters
       if (this.sharedService.gridOptions && this.sharedService.gridOptions.gridMenu && !this.sharedService.gridOptions.gridMenu.hideClearAllFiltersCommand) {
         const commandName = 'clear-filter';

src/app/modules/angular-slickgrid/services/__tests__/shared.service.spec.ts

@@ -208,4 +208,14 @@ describe('Shared Service', () => {
     expect(setSpy).toHaveBeenCalled();
     expect(columns).toEqual(mockColumns);
   });
+
+  it('should call "hideHeaderRowAfterPageLoad" GETTER and expect a boolean value to be returned', () => {
+    const flag = service.hideHeaderRowAfterPageLoad;
+    expect(flag).toEqual(false);
+  });
+
+  it('should call "hideHeaderRowAfterPageLoad" GETTER and SETTER expect same value to be returned', () => {
+    service.hideHeaderRowAfterPageLoad = true;
+    expect(service.hideHeaderRowAfterPageLoad).toEqual(true);
+  });
 });

src/app/modules/angular-slickgrid/services/shared.service.ts

@@ -9,6 +9,7 @@ export class SharedService {
   private _grid: any;
   private _gridOptions: GridOption;
   private _currentPagination: CurrentPagination;
+  private _hideHeaderRowAfterPageLoad = false;
   private _visibleColumns: Column[];
   onColumnsChanged = new Subject<Column[]>();
 
@@ -76,6 +77,15 @@ export class SharedService {
     this._groupItemMetadataProvider = groupItemMetadataProvider;
   }
 
+  /** Getter to know if user want to hide header row after 1st page load */
+  get hideHeaderRowAfterPageLoad(): boolean {
+    return this._hideHeaderRowAfterPageLoad;
+  }
+  /** Setter for knowing if user want to hide header row after 1st page load */
+  set hideHeaderRowAfterPageLoad(hideHeaderRowAfterPageLoad: boolean) {
+    this._hideHeaderRowAfterPageLoad = hideHeaderRowAfterPageLoad;
+  }
+
   /** Getter for the Visible Columns in the grid */
   get visibleColumns(): Column[] {
     return this._visibleColumns;