From 7ef55e29736624123b79fa076b6509973a3ebbbc Mon Sep 17 00:00:00 2001 From: Christian Murphy Date: Wed, 20 May 2020 14:47:40 -0700 Subject: [PATCH] refactor(frontend): move utils to TypeScript (#9820) * refactor(frontend): move utils to typescript (#9101) * refactor(frontend): don't export interfaces * test(frontend): update types and test for isValidChild --- ...e_spec.js => componentIsResizable_spec.ts} | 0 ...alidChild_spec.js => isValidChild_spec.ts} | 12 ++++--- ...leOptions.js => backgroundStyleOptions.ts} | 0 ...IsResizable.js => componentIsResizable.ts} | 2 +- .../{componentTypes.js => componentTypes.ts} | 0 .../util/{constants.js => constants.ts} | 0 ...dFilterKey.js => getDashboardFilterKey.ts} | 13 ++++++-- ...{getLocationHash.js => getLocationHash.ts} | 0 ...lterScope.js => getRevertedFilterScope.ts} | 31 +++++++++++++------ ...rStyleOptions.js => headerStyleOptions.ts} | 0 .../util/{isValidChild.js => isValidChild.ts} | 13 ++++++-- ...{resizableConfig.js => resizableConfig.ts} | 0 ...PeriodicRunner.js => setPeriodicRunner.ts} | 10 ++++-- 13 files changed, 60 insertions(+), 21 deletions(-) rename superset-frontend/spec/javascripts/dashboard/util/{componentIsResizable_spec.js => componentIsResizable_spec.ts} (100%) rename superset-frontend/spec/javascripts/dashboard/util/{isValidChild_spec.js => isValidChild_spec.ts} (95%) rename superset-frontend/src/dashboard/util/{backgroundStyleOptions.js => backgroundStyleOptions.ts} (100%) rename superset-frontend/src/dashboard/util/{componentIsResizable.js => componentIsResizable.ts} (92%) rename superset-frontend/src/dashboard/util/{componentTypes.js => componentTypes.ts} (100%) rename superset-frontend/src/dashboard/util/{constants.js => constants.ts} (100%) rename superset-frontend/src/dashboard/util/{getDashboardFilterKey.js => getDashboardFilterKey.ts} (80%) rename superset-frontend/src/dashboard/util/{getLocationHash.js => getLocationHash.ts} (100%) rename superset-frontend/src/dashboard/util/{getRevertedFilterScope.js => getRevertedFilterScope.ts} (71%) rename superset-frontend/src/dashboard/util/{headerStyleOptions.js => headerStyleOptions.ts} (100%) rename superset-frontend/src/dashboard/util/{isValidChild.js => isValidChild.ts} (91%) rename superset-frontend/src/dashboard/util/{resizableConfig.js => resizableConfig.ts} (100%) rename superset-frontend/src/dashboard/util/{setPeriodicRunner.js => setPeriodicRunner.ts} (84%) diff --git a/superset-frontend/spec/javascripts/dashboard/util/componentIsResizable_spec.js b/superset-frontend/spec/javascripts/dashboard/util/componentIsResizable_spec.ts similarity index 100% rename from superset-frontend/spec/javascripts/dashboard/util/componentIsResizable_spec.js rename to superset-frontend/spec/javascripts/dashboard/util/componentIsResizable_spec.ts diff --git a/superset-frontend/spec/javascripts/dashboard/util/isValidChild_spec.js b/superset-frontend/spec/javascripts/dashboard/util/isValidChild_spec.ts similarity index 95% rename from superset-frontend/spec/javascripts/dashboard/util/isValidChild_spec.js rename to superset-frontend/spec/javascripts/dashboard/util/isValidChild_spec.ts index f8abb5abaf84d..d689f1ea76427 100644 --- a/superset-frontend/spec/javascripts/dashboard/util/isValidChild_spec.js +++ b/superset-frontend/spec/javascripts/dashboard/util/isValidChild_spec.ts @@ -31,7 +31,7 @@ import { TAB_TYPE as TAB, } from 'src/dashboard/util/componentTypes'; -const getIndentation = depth => +const getIndentation = (depth: number) => Array(depth * 3) .fill('') .join('-'); @@ -136,12 +136,14 @@ describe('isValidChild', () => { invalidExamples.forEach((example, exampleIdx) => { let childDepth = 0; example.forEach((childType, i) => { - const shouldTestChild = Array.isArray(childType); - - if (i > 0 && shouldTestChild) { + // should test child + if (i > 0 && Array.isArray(childType)) { const parentDepth = childDepth - 1; const parentType = example[i - 1]; + if (typeof parentType !== 'string') + throw TypeError('parent must be string'); + it(`(${exampleIdx})${getIndentation( childDepth, )}${parentType} (depth ${parentDepth}) > ${childType} ❌`, () => { @@ -149,7 +151,7 @@ describe('isValidChild', () => { isValidChild({ parentDepth, parentType, - childType, + childType: childType[0], }), ).toBe(false); }); diff --git a/superset-frontend/src/dashboard/util/backgroundStyleOptions.js b/superset-frontend/src/dashboard/util/backgroundStyleOptions.ts similarity index 100% rename from superset-frontend/src/dashboard/util/backgroundStyleOptions.js rename to superset-frontend/src/dashboard/util/backgroundStyleOptions.ts diff --git a/superset-frontend/src/dashboard/util/componentIsResizable.js b/superset-frontend/src/dashboard/util/componentIsResizable.ts similarity index 92% rename from superset-frontend/src/dashboard/util/componentIsResizable.js rename to superset-frontend/src/dashboard/util/componentIsResizable.ts index afff2f96bba7a..21d0ef17b7993 100644 --- a/superset-frontend/src/dashboard/util/componentIsResizable.js +++ b/superset-frontend/src/dashboard/util/componentIsResizable.ts @@ -18,6 +18,6 @@ */ import { COLUMN_TYPE, CHART_TYPE, MARKDOWN_TYPE } from './componentTypes'; -export default function componentIsResizable(entity) { +export default function componentIsResizable(entity: { type: string }) { return [COLUMN_TYPE, CHART_TYPE, MARKDOWN_TYPE].indexOf(entity.type) > -1; } diff --git a/superset-frontend/src/dashboard/util/componentTypes.js b/superset-frontend/src/dashboard/util/componentTypes.ts similarity index 100% rename from superset-frontend/src/dashboard/util/componentTypes.js rename to superset-frontend/src/dashboard/util/componentTypes.ts diff --git a/superset-frontend/src/dashboard/util/constants.js b/superset-frontend/src/dashboard/util/constants.ts similarity index 100% rename from superset-frontend/src/dashboard/util/constants.js rename to superset-frontend/src/dashboard/util/constants.ts diff --git a/superset-frontend/src/dashboard/util/getDashboardFilterKey.js b/superset-frontend/src/dashboard/util/getDashboardFilterKey.ts similarity index 80% rename from superset-frontend/src/dashboard/util/getDashboardFilterKey.js rename to superset-frontend/src/dashboard/util/getDashboardFilterKey.ts index e6307c3abc3e3..26f00b73880b7 100644 --- a/superset-frontend/src/dashboard/util/getDashboardFilterKey.js +++ b/superset-frontend/src/dashboard/util/getDashboardFilterKey.ts @@ -16,11 +16,20 @@ * specific language governing permissions and limitations * under the License. */ -export function getDashboardFilterKey({ chartId, column }) { + +interface GetDashboardFilterKeyProps { + chartId: string; + column: string; +} + +export function getDashboardFilterKey({ + chartId, + column, +}: GetDashboardFilterKeyProps) { return `${chartId}_${column}`; } -export function getChartIdAndColumnFromFilterKey(key) { +export function getChartIdAndColumnFromFilterKey(key: string) { const [chartId, ...parts] = key.split('_'); const column = parts.slice().join('_'); return { chartId: parseInt(chartId, 10), column }; diff --git a/superset-frontend/src/dashboard/util/getLocationHash.js b/superset-frontend/src/dashboard/util/getLocationHash.ts similarity index 100% rename from superset-frontend/src/dashboard/util/getLocationHash.js rename to superset-frontend/src/dashboard/util/getLocationHash.ts diff --git a/superset-frontend/src/dashboard/util/getRevertedFilterScope.js b/superset-frontend/src/dashboard/util/getRevertedFilterScope.ts similarity index 71% rename from superset-frontend/src/dashboard/util/getRevertedFilterScope.js rename to superset-frontend/src/dashboard/util/getRevertedFilterScope.ts index b31f275a80152..9dac0583aace0 100644 --- a/superset-frontend/src/dashboard/util/getRevertedFilterScope.js +++ b/superset-frontend/src/dashboard/util/getRevertedFilterScope.ts @@ -18,20 +18,33 @@ */ import { getChartIdAndColumnFromFilterKey } from './getDashboardFilterKey'; +interface FilterScopeMap { + [key: string]: number[]; +} + +interface GetRevertFilterScopeProps { + checked: string[]; + filterFields: string[]; + filterScopeMap: FilterScopeMap; +} + export default function getRevertedFilterScope({ checked = [], filterFields = [], filterScopeMap = {}, -}) { - const checkedChartIdsByFilterField = checked.reduce((map, value) => { - const [chartId, filterField] = value.split(':'); - return { - ...map, - [filterField]: (map[filterField] || []).concat(parseInt(chartId, 10)), - }; - }, {}); +}: GetRevertFilterScopeProps) { + const checkedChartIdsByFilterField = checked.reduce( + (map, value) => { + const [chartId, filterField] = value.split(':'); + return { + ...map, + [filterField]: (map[filterField] || []).concat(parseInt(chartId, 10)), + }; + }, + {}, + ); - return filterFields.reduce((map, filterField) => { + return filterFields.reduce((map, filterField) => { const { chartId } = getChartIdAndColumnFromFilterKey(filterField); // force display filter_box chart as unchecked, but show checkbox as disabled const updatedCheckedIds = ( diff --git a/superset-frontend/src/dashboard/util/headerStyleOptions.js b/superset-frontend/src/dashboard/util/headerStyleOptions.ts similarity index 100% rename from superset-frontend/src/dashboard/util/headerStyleOptions.js rename to superset-frontend/src/dashboard/util/headerStyleOptions.ts diff --git a/superset-frontend/src/dashboard/util/isValidChild.js b/superset-frontend/src/dashboard/util/isValidChild.ts similarity index 91% rename from superset-frontend/src/dashboard/util/isValidChild.js rename to superset-frontend/src/dashboard/util/isValidChild.ts index d90dc4ecc89c1..70ec4d0a697f5 100644 --- a/superset-frontend/src/dashboard/util/isValidChild.js +++ b/superset-frontend/src/dashboard/util/isValidChild.ts @@ -105,12 +105,21 @@ const parentMaxDepthLookup = { [MARKDOWN_TYPE]: {}, }; -export default function isValidChild({ parentType, childType, parentDepth }) { +interface IsValidChildProps { + parentType?: string; + childType?: string; + parentDepth?: unknown; +} + +export default function isValidChild(child: IsValidChildProps): boolean { + const { parentType, childType, parentDepth } = child; if (!parentType || !childType || typeof parentDepth !== 'number') { return false; } - const maxParentDepth = (parentMaxDepthLookup[parentType] || {})[childType]; + const maxParentDepth: number | undefined = (parentMaxDepthLookup[ + parentType + ] || {})[childType]; return typeof maxParentDepth === 'number' && parentDepth <= maxParentDepth; } diff --git a/superset-frontend/src/dashboard/util/resizableConfig.js b/superset-frontend/src/dashboard/util/resizableConfig.ts similarity index 100% rename from superset-frontend/src/dashboard/util/resizableConfig.js rename to superset-frontend/src/dashboard/util/resizableConfig.ts diff --git a/superset-frontend/src/dashboard/util/setPeriodicRunner.js b/superset-frontend/src/dashboard/util/setPeriodicRunner.ts similarity index 84% rename from superset-frontend/src/dashboard/util/setPeriodicRunner.js rename to superset-frontend/src/dashboard/util/setPeriodicRunner.ts index 95b84e6189e91..e0207e860598e 100644 --- a/superset-frontend/src/dashboard/util/setPeriodicRunner.js +++ b/superset-frontend/src/dashboard/util/setPeriodicRunner.ts @@ -16,17 +16,23 @@ * specific language governing permissions and limitations * under the License. */ -const stopPeriodicRender = refreshTimer => { +const stopPeriodicRender = (refreshTimer?: number) => { if (refreshTimer) { clearInterval(refreshTimer); } }; +interface SetPeriodicRunnerProps { + interval?: number; + periodicRender: TimerHandler; + refreshTimer?: number; +} + export default function setPeriodicRunner({ interval = 0, periodicRender, refreshTimer, -}) { +}: SetPeriodicRunnerProps) { stopPeriodicRender(refreshTimer); if (interval > 0) {