diff --git a/packages/superset-ui-legacy-preset-chart-big-number/package.json b/packages/superset-ui-legacy-preset-chart-big-number/package.json
index 45d4ad3b1..abd4e9ff6 100644
--- a/packages/superset-ui-legacy-preset-chart-big-number/package.json
+++ b/packages/superset-ui-legacy-preset-chart-big-number/package.json
@@ -29,8 +29,8 @@
},
"dependencies": {
"@data-ui/xy-chart": "^0.0.84",
+ "@types/shortid": "0.0.29",
"d3-color": "^1.2.3",
- "prop-types": "^15.6.2",
"shortid": "^2.2.14"
},
"peerDependencies": {
diff --git a/packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/BigNumber.jsx b/packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/BigNumber.tsx
similarity index 60%
rename from packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/BigNumber.jsx
rename to packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/BigNumber.tsx
index 6df74a9aa..2608797ef 100644
--- a/packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/BigNumber.jsx
+++ b/packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/BigNumber.tsx
@@ -16,18 +16,20 @@
* specific language governing permissions and limitations
* under the License.
*/
-/* eslint-disable react/forbid-prop-types */
-/* eslint-disable react/jsx-sort-default-props */
-/* eslint-disable react/sort-prop-types */
import React from 'react';
-import PropTypes from 'prop-types';
import shortid from 'shortid';
+import { t } from '@superset-ui/translation';
+import { NumberFormatFunction } from '@superset-ui/number-format/lib/types';
+import { getNumberFormatter } from '@superset-ui/number-format';
import { XYChart, AreaSeries, CrossHair, LinearGradient } from '@data-ui/xy-chart';
import { BRAND_COLOR } from '@superset-ui/color';
-import { smartDateVerboseFormatter } from '@superset-ui/time-format';
import { computeMaxFontSize } from '@superset-ui/dimension';
import './BigNumber.css';
+import { smartDateVerboseFormatter } from '@superset-ui/time-format';
+import { TimeFormatFunction } from '@superset-ui/time-format/lib/types';
+
+const defaultNumberFormatter = getNumberFormatter(undefined);
const CHART_MARGIN = {
top: 4,
@@ -42,68 +44,67 @@ const PROPORTION = {
TRENDLINE: 0.3,
};
-export function renderTooltipFactory(formatValue) {
- function renderTooltip({ datum }) {
- const { x: rawDate, y: rawValue } = datum;
- const formattedDate = smartDateVerboseFormatter(rawDate);
- const value = formatValue(rawValue);
+type TimeSeriesDatum = {
+ x: number; // timestamp as a number
+ y: number | null;
+};
+export function renderTooltipFactory(
+ formatDate = smartDateVerboseFormatter.formatFunc,
+ formatValue = defaultNumberFormatter,
+) {
+ return function renderTooltip({ datum: { x, y } }: { datum: TimeSeriesDatum }) {
+ // even though `formatDate` supports timestamp as numbers, we need
+ // `new Date` to pass type check
return (
- {formattedDate}
+ {formatDate(new Date(x))}
- {value}
+ {y === null ? t('N/A') : formatValue(y)}
);
- }
-
- renderTooltip.propTypes = {
- datum: PropTypes.shape({
- x: PropTypes.instanceOf(Date),
- y: PropTypes.number,
- }).isRequired,
};
-
- return renderTooltip;
-}
-
-function identity(x) {
- return x;
}
-const propTypes = {
- className: PropTypes.string,
- width: PropTypes.number.isRequired,
- height: PropTypes.number.isRequired,
- bigNumber: PropTypes.number.isRequired,
- formatBigNumber: PropTypes.func,
- headerFontSize: PropTypes.number,
- subheader: PropTypes.string,
- subheaderFontSize: PropTypes.number,
- showTrendLine: PropTypes.bool,
- startYAxisAtZero: PropTypes.bool,
- trendLineData: PropTypes.array,
- mainColor: PropTypes.string,
- renderTooltip: PropTypes.func,
-};
-const defaultProps = {
- className: '',
- formatBigNumber: identity,
- headerFontSize: PROPORTION.HEADER,
- subheader: '',
- subheaderFontSize: PROPORTION.SUBHEADER,
- showTrendLine: false,
- startYAxisAtZero: true,
- trendLineData: null,
- mainColor: BRAND_COLOR,
- renderTooltip: renderTooltipFactory(identity),
+type BigNumberVisProps = {
+ className?: string;
+ width: number;
+ height: number;
+ bigNumber: number;
+ formatNumber: NumberFormatFunction;
+ formatTime: TimeFormatFunction;
+ fromDatetime: number;
+ toDatetime: number;
+ headerFontSize: number;
+ subheader: string;
+ subheaderFontSize: number;
+ showTrendLine: boolean;
+ startYAxisAtZero: boolean;
+ trendLineData?: TimeSeriesDatum[];
+ mainColor: string;
+ renderTooltip: ({ datum }: { datum: TimeSeriesDatum }) => React.Component;
+ useFixedTimeRange: boolean;
};
-class BigNumberVis extends React.PureComponent {
- constructor(props) {
- super(props);
- this.gradientId = shortid.generate();
- }
+class BigNumberVis extends React.PureComponent {
+ private gradientId: string = shortid.generate();
+
+ static defaultProps = {
+ className: '',
+ formatNumber: (num: number) => String(num),
+ formatTime: smartDateVerboseFormatter.formatFunc,
+ fromDatetime: null,
+ headerFontSize: PROPORTION.HEADER,
+ mainColor: BRAND_COLOR,
+ renderTooltip: renderTooltipFactory(),
+ showTrendLine: false,
+ startYAxisAtZero: true,
+ subheader: '',
+ subheaderFontSize: PROPORTION.SUBHEADER,
+ toDatetime: null,
+ trendLineData: null,
+ useFixedTimeRange: false,
+ };
getClassName() {
const { className, showTrendLine } = this.props;
@@ -119,14 +120,14 @@ class BigNumberVis extends React.PureComponent {
const container = document.createElement('div');
container.className = this.getClassName();
container.style.position = 'absolute'; // so it won't disrupt page layout
- container.style.opacity = 0; // and not visible
+ container.style.opacity = '0'; // and not visible
return container;
}
- renderHeader(maxHeight) {
- const { bigNumber, formatBigNumber, width } = this.props;
- const text = bigNumber === null ? 'No data' : formatBigNumber(bigNumber);
+ renderHeader(maxHeight: number) {
+ const { bigNumber, formatNumber, width } = this.props;
+ const text = bigNumber === null ? 'No data' : formatNumber(bigNumber);
const container = this.createTemporaryContainer();
document.body.append(container);
@@ -152,7 +153,7 @@ class BigNumberVis extends React.PureComponent {
);
}
- renderSubheader(maxHeight) {
+ renderSubheader(maxHeight: number) {
const { bigNumber, subheader, width } = this.props;
let fontSize = 0;
@@ -186,7 +187,7 @@ class BigNumberVis extends React.PureComponent {
);
}
- renderTrendline(maxHeight) {
+ renderTrendline(maxHeight: number) {
const {
width,
trendLineData,
@@ -194,13 +195,38 @@ class BigNumberVis extends React.PureComponent {
subheader,
renderTooltip,
startYAxisAtZero,
+ fromDatetime,
+ toDatetime,
+ useFixedTimeRange,
} = this.props;
+ // Apply a fixed X range if a time range is specified.
+ //
+ // XYChart checks the existence of `domain` property decide whether to apply
+ // a domain or not, so it must not be `null` or `undefined`
+ const xScale: { type: string; domain?: number[] } = { type: 'timeUtc' };
+ const tooltipData = trendLineData?.sort(datum => datum.x);
+ if (tooltipData && useFixedTimeRange && fromDatetime && toDatetime) {
+ // xScale.domain = [fromDatetime, toDatetime];
+ if (tooltipData[0].x > fromDatetime) {
+ tooltipData.unshift({
+ x: fromDatetime,
+ y: null,
+ });
+ }
+ if (tooltipData[tooltipData.length - 1].x < toDatetime) {
+ tooltipData.unshift({
+ x: toDatetime,
+ y: null,
+ });
+ }
+ }
+
return (
-
+
a[TIME_COLUMN] - b[TIME_COLUMN]);
bigNumber = sortedData.length === 0 ? null : sortedData[sortedData.length - 1][metricName];
@@ -85,28 +89,35 @@ export default function transformProps(chartProps) {
}
if (!yAxisFormat && chartProps.datasource && chartProps.datasource.metrics) {
- chartProps.datasource.metrics.forEach(metricEntry => {
- if (metricEntry.metric_name === metric && metricEntry.d3format) {
- yAxisFormat = metricEntry.d3format;
- }
- });
+ chartProps.datasource.metrics.forEach(
+ // eslint-disable-next-line camelcase
+ (metricEntry: { metric_name?: string; d3format: string }) => {
+ if (metricEntry.metric_name === metric && metricEntry.d3format) {
+ yAxisFormat = metricEntry.d3format;
+ }
+ },
+ );
}
- const formatValue = getNumberFormatter(yAxisFormat);
+ const formatNumber = getNumberFormatter(yAxisFormat);
+ const formatTime = getTimeFormatterForGranularity(granularity);
return {
width,
height,
bigNumber,
className,
- formatBigNumber: formatValue,
+ formatNumber,
+ formatTime,
headerFontSize,
subheaderFontSize,
mainColor,
- renderTooltip: renderTooltipFactory(formatValue),
showTrendLine: supportAndShowTrendLine,
startYAxisAtZero,
subheader: formattedSubheader,
trendLineData,
+ fromDatetime,
+ toDatetime,
+ useFixedTimeRange,
};
}
diff --git a/packages/superset-ui-legacy-preset-chart-big-number/src/BigNumberTotal/index.js b/packages/superset-ui-legacy-preset-chart-big-number/src/BigNumberTotal/index.ts
similarity index 100%
rename from packages/superset-ui-legacy-preset-chart-big-number/src/BigNumberTotal/index.js
rename to packages/superset-ui-legacy-preset-chart-big-number/src/BigNumberTotal/index.ts
diff --git a/packages/superset-ui-legacy-preset-chart-big-number/src/index.js b/packages/superset-ui-legacy-preset-chart-big-number/src/index.ts
similarity index 100%
rename from packages/superset-ui-legacy-preset-chart-big-number/src/index.js
rename to packages/superset-ui-legacy-preset-chart-big-number/src/index.ts
diff --git a/packages/superset-ui-legacy-preset-chart-big-number/src/preset.js b/packages/superset-ui-legacy-preset-chart-big-number/src/preset.ts
similarity index 100%
rename from packages/superset-ui-legacy-preset-chart-big-number/src/preset.js
rename to packages/superset-ui-legacy-preset-chart-big-number/src/preset.ts
diff --git a/packages/superset-ui-legacy-preset-chart-big-number/src/types/external.d.ts b/packages/superset-ui-legacy-preset-chart-big-number/src/types/external.d.ts
new file mode 100644
index 000000000..e69639741
--- /dev/null
+++ b/packages/superset-ui-legacy-preset-chart-big-number/src/types/external.d.ts
@@ -0,0 +1,20 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+declare module '@data-ui/xy-chart';
+declare module '*.png';
diff --git a/packages/superset-ui-legacy-preset-chart-big-number/src/utils/getTimeFormatterForGranularity.ts b/packages/superset-ui-legacy-preset-chart-big-number/src/utils/getTimeFormatterForGranularity.ts
new file mode 100644
index 000000000..42a65417f
--- /dev/null
+++ b/packages/superset-ui-legacy-preset-chart-big-number/src/utils/getTimeFormatterForGranularity.ts
@@ -0,0 +1,70 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { getTimeFormatter, TimeFormats, smartDateVerboseFormatter } from '@superset-ui/time-format';
+
+// Translate time granularity to d3-format
+const MINUTE = '%Y-%m-%d %H:%M';
+const SUNDAY_BASED_WEEK = '%Y W%U';
+const MONDAY_BASED_WEEK = '%Y W%W';
+const { DATABASE_DATE, DATABASE_DATETIME } = TimeFormats;
+
+// search for `builtin_time_grains` in incubator-superset/superset/db_engine_specs/base.py
+const formats = {
+ date: DATABASE_DATE,
+ PT1S: DATABASE_DATETIME, // second
+ PT1M: MINUTE, // minute
+ PT5M: MINUTE, // 5 minute
+ PT10M: MINUTE, // 10 minute
+ PT15M: MINUTE, // 15 minute
+ 'PT0.5H': MINUTE, // half hour
+ PT1H: '%Y-%m-%d %H:00', // hour
+ P1D: DATABASE_DATE, // day
+ P1W: SUNDAY_BASED_WEEK, // week
+ P1M: 'smart_date_verbose', // month
+ 'P0.25Y': '%Y Q%q', // quarter
+ P1Y: '%Y', // year
+ // d3-time-format weeks does not support weeks start on Sunday
+ '1969-12-28T00:00:00Z/P1W': SUNDAY_BASED_WEEK, // 'week_start_sunday'
+ '1969-12-29T00:00:00Z/P1W': MONDAY_BASED_WEEK, // 'week_start_monday'
+ 'P1W/1970-01-03T00:00:00Z': SUNDAY_BASED_WEEK, // 'week_ending_saturday'
+ 'P1W/1970-01-04T00:00:00Z': MONDAY_BASED_WEEK, // 'week_ending_sunday'
+};
+
+type TimeGranularity =
+ | 'date'
+ | 'PT1S'
+ | 'PT1M'
+ | 'PT5M'
+ | 'PT10M'
+ | 'PT15M'
+ | 'PT0.5H'
+ | 'PT1H'
+ | 'P1D'
+ | 'P1W'
+ | 'P0.25Y'
+ | 'P1Y'
+ | '1969-12-28T00:00:00Z/P1W'
+ | '1969-12-29T00:00:00Z/P1W'
+ | 'P1W/1970-01-03T00:00:00Z';
+
+export default function getTimeFormatterForGranularity(granularity: TimeGranularity) {
+ return granularity in formats
+ ? getTimeFormatter(formats[granularity])
+ : smartDateVerboseFormatter.format;
+}
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/index.js b/packages/superset-ui-plugins-demo/storybook/stories/index.js
index 79581ecc2..93362ec48 100644
--- a/packages/superset-ui-plugins-demo/storybook/stories/index.js
+++ b/packages/superset-ui-plugins-demo/storybook/stories/index.js
@@ -47,7 +47,7 @@ const EMPTY_EXAMPLES = [
* { storyPath: string, storyName: string, renderStory: fn() => node }
*
*/
-const requireContext = require.context('./', /* subdirs= */ true, /index\.jsx?$/);
+const requireContext = require.context('./', /* subdirs= */ true, /index\.(js|ts)x?$/);
requireContext.keys().forEach(packageName => {
const packageExport = requireContext(packageName);
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/Stories.tsx b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/Stories.tsx
index 66bc69f79..f386f1f16 100644
--- a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/Stories.tsx
+++ b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/Stories.tsx
@@ -1,7 +1,55 @@
-/* eslint-disable no-magic-numbers, sort-keys */
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
import React from 'react';
import { SuperChart } from '@superset-ui/chart';
-import data from './data';
+import testData from './data';
+
+const TIME_COLUMN = '__timestamp';
+
+const formData = {
+ colorPicker: {
+ r: 0,
+ g: 122,
+ b: 135,
+ a: 1,
+ },
+ compareLag: 1,
+ compareSuffix: 'over 10Y',
+ metric: 'sum__SP_POP_TOTL',
+ showTrendLine: true,
+ startYAxisAtZero: true,
+ vizType: 'big_number',
+ yAxisFormat: '.3s',
+};
+
+/**
+ * Add null values to trendline data
+ * @param data input data
+ */
+function withNulls(origData: object[], nullPosition: number = 3) {
+ const data = [...origData];
+ data[nullPosition] = {
+ ...data[nullPosition],
+ sum__SP_POP_TOTL: null,
+ };
+ return data;
+}
export default [
{
@@ -10,25 +58,44 @@ export default [
chartType="big-number"
width={400}
height={400}
- queryData={{ data }}
+ queryData={{ data: testData }}
+ formData={formData}
+ />
+ ),
+ storyName: 'Basic with Trendline',
+ storyPath: 'legacy-|preset-chart-big-number|BigNumberChartPlugin',
+ },
+ {
+ renderStory: () => (
+
+ ),
+ storyName: 'Null in the middle',
+ storyPath: 'legacy-|preset-chart-big-number|BigNumberChartPlugin',
+ },
+ {
+ renderStory: () => (
+
),
- storyName: 'Basic',
+ storyName: 'Missing range start (fix time range)',
storyPath: 'legacy-|preset-chart-big-number|BigNumberChartPlugin',
},
{
@@ -37,25 +104,18 @@ export default [
chartType="big-number"
width={400}
height={400}
- queryData={{ data: [] }}
+ queryData={{
+ data: testData.slice(0, 9),
+ from_dttm: testData[testData.length - 1][TIME_COLUMN],
+ to_dttm: testData[0][TIME_COLUMN],
+ }}
formData={{
- colorPicker: {
- r: 0,
- g: 122,
- b: 135,
- a: 1,
- },
- compareLag: 1,
- compareSuffix: 'over 10Y',
- metric: 'sum__SP_POP_TOTL',
- showTrendLine: true,
- startYAxisAtZero: true,
- vizType: 'big_number',
- yAxisFormat: '.3s',
+ ...formData,
+ useFixedTimeRange: false,
}}
/>
),
- storyName: 'No Data',
+ storyName: `Missing range start (don't fix range)`,
storyPath: 'legacy-|preset-chart-big-number|BigNumberChartPlugin',
},
];
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/data.js b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/data.ts
similarity index 96%
rename from packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/data.js
rename to packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/data.ts
index 72770149b..cf0c78bb0 100644
--- a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/data.js
+++ b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/data.ts
@@ -54,6 +54,6 @@ export default [
},
{
__timestamp: 978307200000.0,
- sum__SP_POP_TOTL: 6173339411.0,
+ sum__SP_POP_TOTL: 617333941.0,
},
];
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/index.js b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/index.js
deleted file mode 100644
index efd17ed48..000000000
--- a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/index.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import { BigNumberChartPlugin } from '../../../../../superset-ui-legacy-preset-chart-big-number';
-import Stories from './Stories';
-
-new BigNumberChartPlugin().configure({ key: 'big-number' }).register();
-
-export default {
- examples: [...Stories],
-};
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/index.ts b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/index.ts
new file mode 100644
index 000000000..8976cf5d2
--- /dev/null
+++ b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumber/index.ts
@@ -0,0 +1,26 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { BigNumberChartPlugin } from '../../../../../superset-ui-legacy-preset-chart-big-number/src';
+import Stories from './Stories';
+
+new BigNumberChartPlugin().configure({ key: 'big-number' }).register();
+
+export default {
+ examples: [...Stories],
+};
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/Stories.tsx b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/Stories.tsx
index 8991554b4..2fca55ae3 100644
--- a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/Stories.tsx
+++ b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/Stories.tsx
@@ -1,4 +1,21 @@
-/* eslint-disable no-magic-numbers */
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
import React from 'react';
import { SuperChart } from '@superset-ui/chart';
import data from './data';
@@ -37,7 +54,7 @@ export default [
}}
/>
),
- storyName: 'No Data',
+ storyName: 'Basic No Data',
storyPath: 'legacy-|preset-chart-big-number|BigNumberTotalChartPlugin',
},
];
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/data.js b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/data.ts
similarity index 63%
rename from packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/data.js
rename to packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/data.ts
index 78d96901c..919630768 100644
--- a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/data.js
+++ b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/data.ts
@@ -1,4 +1,3 @@
-/* eslint-disable sort-keys */
export default [
{
sum__num: 32546308,
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/index.js b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/index.js
deleted file mode 100644
index 910402e2d..000000000
--- a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/index.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import { BigNumberTotalChartPlugin } from '../../../../../superset-ui-legacy-preset-chart-big-number';
-import Stories from './Stories';
-
-new BigNumberTotalChartPlugin().configure({ key: 'big-number-total' }).register();
-
-export default {
- examples: [...Stories],
-};
diff --git a/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/index.ts b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/index.ts
new file mode 100644
index 000000000..229c30d27
--- /dev/null
+++ b/packages/superset-ui-plugins-demo/storybook/stories/legacy-preset-chart-big-number/BigNumberTotal/index.ts
@@ -0,0 +1,26 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { BigNumberTotalChartPlugin } from '../../../../../superset-ui-legacy-preset-chart-big-number/src';
+import Stories from './Stories';
+
+new BigNumberTotalChartPlugin().configure({ key: 'big-number-total' }).register();
+
+export default {
+ examples: [...Stories],
+};
diff --git a/yarn.lock b/yarn.lock
index 4e30da1f5..e3ba2e31d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3954,6 +3954,11 @@
"@types/prop-types" "*"
csstype "^2.2.0"
+"@types/shortid@0.0.29":
+ version "0.0.29"
+ resolved "https://registry.yarnpkg.com/@types/shortid/-/shortid-0.0.29.tgz#8093ee0416a6e2bf2aa6338109114b3fbffa0e9b"
+ integrity sha1-gJPuBBam4r8qpjOBCRFLP7/6Dps=
+
"@types/sizzle@*":
version "2.3.2"
resolved "https://registry.yarnpkg.com/@types/sizzle/-/sizzle-2.3.2.tgz#a811b8c18e2babab7d542b3365887ae2e4d9de47"