Skip to content

Commit

Permalink
feat(addon): provide grid menu labels for all built-in commands
Browse files Browse the repository at this point in the history 
- prior to the change, we couldn't change the label, we would only be able to change the translation key but we couldn't change the text when we're not using translations. This PR provides both way of customizing these labels, via its label and/or with a label translation key
  • Loading branch information
@ghiscoding
ghiscoding committed May 6, 2021
1 parent 6eba7bb commit b8b5aa2
Show file tree
Hide file tree
Showing 7 changed files with 126 additions and 41 deletions.
34 changes: 23 additions & 11 deletions src/app/modules/angular-slickgrid/extensions/__tests__/gridMenuExtension.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,17 @@ describe('gridMenuExtension', () => {
postProcess: jest.fn(),
},
gridMenu: {
commandLabels: {
clearAllFiltersCommandKey: 'CLEAR_ALL_FILTERS',
clearAllSortingCommandKey: 'CLEAR_ALL_SORTING',
clearFrozenColumnsCommandKey: 'CLEAR_PINNING',
exportCsvCommandKey: 'EXPORT_TO_CSV',
exportExcelCommandKey: 'EXPORT_TO_EXCEL',
exportTextDelimitedCommandKey: 'EXPORT_TO_TAB_DELIMITED',
refreshDatasetCommandKey: 'REFRESH_DATASET',
toggleFilterCommandKey: 'TOGGLE_FILTER_ROW',
togglePreHeaderCommandKey: 'TOGGLE_PRE_HEADER_ROW',
},
customItems: [],
hideClearAllFiltersCommand: false,
hideClearFrozenColumnsCommand: true,
Expand Down Expand Up @@ -408,7 +419,7 @@ describe('gridMenuExtension', () => {
});

it('should expect menu related to "Unfreeze Columns/Rows"', () => {
const copyGridOptionsMock = { ...gridOptionsMock, gridMenu: { hideClearFrozenColumnsCommand: false, } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: false, } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -430,7 +441,7 @@ describe('gridMenuExtension', () => {
});

it('should have only 1 menu "clear-filter" when all other menus are defined as hidden & when "enableFilering" is set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideToggleFilterCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideToggleFilterCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -440,7 +451,7 @@ describe('gridMenuExtension', () => {
});

it('should have only 1 menu "toggle-filter" when all other menus are defined as hidden & when "enableFilering" is set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -450,7 +461,7 @@ describe('gridMenuExtension', () => {
});

it('should have only 1 menu "refresh-dataset" when all other menus are defined as hidden & when "enableFilering" is set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideToggleFilterCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideToggleFilterCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -470,7 +481,7 @@ describe('gridMenuExtension', () => {
});

it('should not have the "toggle-preheader" menu command when "showPreHeaderPanel" and "hideTogglePreHeaderCommand" are set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, showPreHeaderPanel: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideTogglePreHeaderCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, showPreHeaderPanel: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideTogglePreHeaderCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
expect((SharedService.prototype.gridOptions.gridMenu as GridMenu).customItems).toEqual([]);
Expand All @@ -487,14 +498,14 @@ describe('gridMenuExtension', () => {
});

it('should not have the "clear-sorting" menu command when "enableSorting" and "hideClearAllSortingCommand" are set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableSorting: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideClearAllSortingCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableSorting: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllSortingCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
expect((SharedService.prototype.gridOptions.gridMenu as GridMenu).customItems).toEqual([]);
});

it('should have the "export-csv" menu command when "enableExport" is set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -504,14 +515,14 @@ describe('gridMenuExtension', () => {
});

it('should not have the "export-csv" menu command when "enableExport" and "hideExportCsvCommand" are set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
expect((SharedService.prototype.gridOptions.gridMenu as GridMenu).customItems).toEqual([]);
});

it('should have the "export-excel" menu command when "enableExport" is set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableExcelExport: true, enableExport: false, gridMenu: { hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: false } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableExcelExport: true, enableExport: false, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: false } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -521,7 +532,7 @@ describe('gridMenuExtension', () => {
});

it('should have the "export-text-delimited" menu command when "enableExport" is set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
extension.register(); // calling 2x register to make sure it doesn't duplicate commands
Expand All @@ -531,7 +542,7 @@ describe('gridMenuExtension', () => {
});

it('should not have the "export-text-delimited" menu command when "enableExport" and "hideExportCsvCommand" are set', () => {
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption;
const copyGridOptionsMock = { ...gridOptionsMock, enableExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption;
jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock);
extension.register();
expect((SharedService.prototype.gridOptions.gridMenu as GridMenu).customItems).toEqual([]);
Expand All @@ -552,6 +563,7 @@ describe('gridMenuExtension', () => {
...gridOptionsMock,
enableExport: true,
gridMenu: {
commandLabels: gridOptionsMock.gridMenu!.commandLabels,
customItems: customItemsMock,
hideClearFrozenColumnsCommand: true,
hideExportCsvCommand: false,
Expand Down
21 changes: 12 additions & 9 deletions src/app/modules/angular-slickgrid/extensions/extensionUtility.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { Injectable, Optional } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';

import { Constants } from '../constants';
import { Column } from '../models/index';
import { Column, Locale } from '../models/index';
import { SharedService } from '../services/shared.service';
import { getTranslationPrefix } from '../services/utilities';

Expand Down Expand Up @@ -125,20 +125,23 @@ export class ExtensionUtility {

/**
* When "enabledTranslate" is set to True, we will try to translate if the Translate Service exist or use the Locales when not
* @param translationKey
* @param localeKey
* @param {String} translationKey
* @param {String} localeKey
* @param {String} textToUse - optionally provide a static text to use (that will completely override the other arguments of the method)
*/
translateWhenEnabledAndServiceExist(translationKey: string, localeKey: string): string {
translateWhenEnabledAndServiceExist(translationKey: string, localeKey: string, textToUse?: string): string {
let text = '';
const gridOptions = this.sharedService && this.sharedService.gridOptions;
const gridOptions = this.sharedService?.gridOptions;

// get locales provided by user in main file or else use default English locales via the Constants
const locales = gridOptions && gridOptions.locales || Constants.locales;
const locales = gridOptions?.locales ?? Constants.locales;

if (gridOptions.enableTranslate && this.translate && this.translate.currentLang && this.translate.instant) {
if (textToUse) {
text = textToUse;
} else if (gridOptions.enableTranslate && this.translate?.instant) {
text = this.translate.instant(translationKey || ' ');
} else if (locales && locales.hasOwnProperty(localeKey)) {
text = (locales as any)[localeKey];
} else if (localeKey in locales) {
text = locales[localeKey as keyof Locale] as string;
} else {
text = localeKey;
}
Expand Down

0 comments on commit b8b5aa2

Please sign in to comment.