chore(explore): Migrate BigNumber to v1 api [ID-28][ID-55] (#17587)

* chore(explore): Migrate BigNumber to v1 api * Move to echarts * Use Echarts trendline * Fix imports * Fix parsing dates as strings * Add from_dttm and to_dttm to v1 chart response * Fix post processing * Fix timeRangeFixed * Fix tests * Remove from and to dttm from cache * Cleanup date formatting * Fix storybook * Fix missing types * Fix timestamp with timezone * Add types to demo's tsconfig * bug fix * fix import * Fix cypress tests * add sort * add resample to handle missing values properly * Sync ChartDataResponseResult schema with ts interface * Lint fix * Add migration * Fix migration * Remove pass * Re-raise the exception in migration * Typo fix * Update revision Co-authored-by: Ville Brofeldt <[email protected]>
apache · Dec 15, 2021 · 124af4c · 124af4c
1 parent 142b5bc
commit 124af4c
Show file tree

Hide file tree

Showing 45 changed files with 763 additions and 581 deletions.
diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js
@@ -16,6 +16,8 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+import { interceptChart } from 'cypress/utils';
+
 describe('Visualization > Big Number with Trendline', () => {
   const BIG_NUMBER_FORM_DATA = {
     datasource: '2__table',
@@ -42,21 +44,21 @@ describe('Visualization > Big Number with Trendline', () => {
   function verify(formData) {
     cy.visitChartByParams(JSON.stringify(formData));
     cy.verifySliceSuccess({
-      waitAlias: '@getJson',
+      waitAlias: '@chartData',
       chartSelector: '.superset-legacy-chart-big-number',
     });
   }
 
   beforeEach(() => {
     cy.login();
-    cy.intercept('POST', '/superset/explore_json/**').as('getJson');
+    interceptChart({ legacy: false }).as('chartData');
   });
 
   it('should work', () => {
     verify(BIG_NUMBER_FORM_DATA);
     cy.get('.chart-container .header-line');
     cy.get('.chart-container .subheader-line');
-    cy.get('.chart-container svg path.vx-linepath');
+    cy.get('.chart-container canvas');
   });
 
   it('should work without subheader', () => {
@@ -66,7 +68,7 @@ describe('Visualization > Big Number with Trendline', () => {
     });
     cy.get('.chart-container .header-line');
     cy.get('.chart-container .subheader-line').should('not.exist');
-    cy.get('.chart-container svg path.vx-linepath');
+    cy.get('.chart-container canvas');
   });
 
   it('should not render trendline when hidden', () => {
@@ -76,6 +78,6 @@ describe('Visualization > Big Number with Trendline', () => {
     });
     cy.get('[data-test="chart-container"] .header-line');
     cy.get('[data-test="chart-container"] .subheader-line');
-    cy.get('[data-test="chart-container"] svg').should('not.exist');
+    cy.get('[data-test="chart-container"] canvas').should('not.exist');
   });
 });
diff --git a/...frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js b/...frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js
@@ -16,6 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+import { interceptChart } from 'cypress/utils';
 import { FORM_DATA_DEFAULTS, NUM_METRIC } from './shared.helper';
 
 describe('Visualization > Big Number Total', () => {
@@ -26,15 +27,15 @@ describe('Visualization > Big Number Total', () => {
 
   beforeEach(() => {
     cy.login();
-    cy.intercept('POST', '/superset/explore_json/**').as('getJson');
+    interceptChart({ legacy: false }).as('chartData');
   });
 
   it('Test big number chart with adhoc metric', () => {
     const formData = { ...BIG_NUMBER_DEFAULTS, metric: NUM_METRIC };
 
-    cy.visitChartByParams(JSON.stringify(formData));
+    cy.visitChartByParams(formData);
     cy.verifySliceSuccess({
-      waitAlias: '@getJson',
+      waitAlias: '@chartData',
       querySubstring: NUM_METRIC.label,
     });
   });
@@ -58,8 +59,8 @@ describe('Visualization > Big Number Total', () => {
       adhoc_filters: filters,
     };
 
-    cy.visitChartByParams(JSON.stringify(formData));
-    cy.verifySliceSuccess({ waitAlias: '@getJson' });
+    cy.visitChartByParams(formData);
+    cy.verifySliceSuccess({ waitAlias: '@chartData' });
   });
 
   it('Test big number chart ignores groupby', () => {
@@ -69,11 +70,11 @@ describe('Visualization > Big Number Total', () => {
       groupby: ['state'],
     };
 
-    cy.visitChartByParams(JSON.stringify(formData));
-    cy.wait(['@getJson']).then(async ({ response }) => {
+    cy.visitChartByParams(formData);
+    cy.wait(['@chartData']).then(async ({ response }) => {
       cy.verifySliceContainer();
       const responseBody = response?.body;
-      expect(responseBody.query).not.contains(formData.groupby[0]);
+      expect(responseBody.result[0].query).not.contains(formData.groupby[0]);
     });
   });
 });
diff --git a/superset-frontend/cypress-base/cypress/utils/vizPlugins.ts b/superset-frontend/cypress-base/cypress/utils/vizPlugins.ts
@@ -40,6 +40,8 @@ const V1_PLUGINS = [
   'word_cloud',
   'pie',
   'table',
+  'big_number',
+  'big_number_total',
 ];
 export const DASHBOARD_CHART_ALIAS_PREFIX = 'getChartData_';
 

diff --git a/superset-frontend/package-lock.json b/superset-frontend/package-lock.json
diff --git a/superset-frontend/package.json b/superset-frontend/package.json
@@ -101,7 +101,6 @@
     "@superset-ui/legacy-plugin-chart-sunburst": "^0.18.25",
     "@superset-ui/legacy-plugin-chart-treemap": "^0.18.25",
     "@superset-ui/legacy-plugin-chart-world-map": "^0.18.25",
-    "@superset-ui/legacy-preset-chart-big-number": "^0.18.25",
     "@superset-ui/legacy-preset-chart-deckgl": "^0.4.13",
     "@superset-ui/legacy-preset-chart-nvd3": "^0.18.25",
     "@superset-ui/plugin-chart-echarts": "^0.18.25",
@@ -258,6 +257,7 @@
     "@types/redux-localstorage": "^1.0.8",
     "@types/redux-mock-store": "^1.0.2",
     "@types/rison": "0.0.6",
+    "@types/shortid": "^0.0.29",
     "@types/sinon": "^9.0.5",
     "@types/yargs": "12 - 15",
     "@typescript-eslint/eslint-plugin": "^5.3.0",

diff --git a/superset-frontend/packages/superset-ui-core/src/query/types/QueryResponse.ts b/superset-frontend/packages/superset-ui-core/src/query/types/QueryResponse.ts
@@ -50,7 +50,7 @@ export interface ChartDataResponseResult {
   annotation_data: AnnotationData[] | null;
   cache_key: string | null;
   cache_timeout: number | null;
-  cache_dttm: string | null;
+  cached_dttm: string | null;
   /**
    * Array of data records as dictionary
    */
@@ -76,6 +76,8 @@ export interface ChartDataResponseResult {
     | 'scheduled'
     | 'success'
     | 'timed_out';
+  from_dttm: number | null;
+  to_dttm: number | null;
 }
 
 export interface TimeseriesChartDataResponseResult

diff --git a/superset-frontend/packages/superset-ui-demo/package.json b/superset-frontend/packages/superset-ui-demo/package.json
@@ -61,7 +61,6 @@
     "@superset-ui/legacy-plugin-chart-time-table": "0.18.25",
     "@superset-ui/legacy-plugin-chart-treemap": "0.18.25",
     "@superset-ui/legacy-plugin-chart-world-map": "0.18.25",
-    "@superset-ui/legacy-preset-chart-big-number": "0.18.25",
     "@superset-ui/legacy-preset-chart-deckgl": "^0.4.13",
     "@superset-ui/legacy-preset-chart-nvd3": "0.18.25",
     "@superset-ui/plugin-chart-echarts": "0.18.25",

diff --git a/...o/storybook/stories/plugins/legacy-preset-chart-big-number/BigNumber/BigNumberStories.tsx b/...o/storybook/stories/plugins/legacy-preset-chart-big-number/BigNumber/BigNumberStories.tsx
@@ -18,7 +18,7 @@
  */
 import React from 'react';
 import { SuperChart } from '@superset-ui/core';
-import { BigNumberChartPlugin } from '@superset-ui/legacy-preset-chart-big-number';
+import { BigNumberChartPlugin } from '@superset-ui/plugin-chart-echarts';
 import testData from './data';
 
 new BigNumberChartPlugin().configure({ key: 'big-number' }).register();
@@ -56,7 +56,7 @@ function withNulls(origData: object[], nullPosition = 3) {
 }
 
 export default {
-  title: 'Legacy Chart Plugins/legacy-preset-big-number/BigNumber',
+  title: 'Legacy Chart Plugins/legacy-preset-big-number/BigNumberWithTrendline',
 };
 
 export const basicWithTrendline = () => (

diff --git a/...k/stories/plugins/legacy-preset-chart-big-number/BigNumberTotal/BigNumberTotalStories.tsx b/...k/stories/plugins/legacy-preset-chart-big-number/BigNumberTotal/BigNumberTotalStories.tsx
@@ -18,7 +18,7 @@
  */
 import React from 'react';
 import { SuperChart } from '@superset-ui/core';
-import { BigNumberTotalChartPlugin } from '@superset-ui/legacy-preset-chart-big-number';
+import { BigNumberTotalChartPlugin } from '@superset-ui/plugin-chart-echarts';
 import data from './data';
 
 new BigNumberTotalChartPlugin()

diff --git a/...ackages/superset-ui-demo/storybook/stories/superset-ui-chart/ChartDataProviderStories.tsx b/...ackages/superset-ui-demo/storybook/stories/superset-ui-chart/ChartDataProviderStories.tsx
@@ -25,7 +25,7 @@ import {
   ChartDataProvider,
   SupersetClient,
 } from '@superset-ui/core';
-import { BigNumberChartPlugin as LegacyBigNumberPlugin } from '@superset-ui/legacy-preset-chart-big-number';
+import { BigNumberChartPlugin } from '@superset-ui/plugin-chart-echarts';
 import LegacySankeyPlugin from '@superset-ui/legacy-plugin-chart-sankey';
 import LegacySunburstPlugin from '@superset-ui/legacy-plugin-chart-sunburst';
 import { WordCloudChartPlugin } from '@superset-ui/plugin-chart-word-cloud';
@@ -46,7 +46,7 @@ const SUNBURST = sunburstFormData.viz_type;
 const WORD_CLOUD_LEGACY = wordCloudFormData.viz_type;
 const WORD_CLOUD = 'new_word_cloud';
 
-new LegacyBigNumberPlugin().configure({ key: BIG_NUMBER }).register();
+new BigNumberChartPlugin().configure({ key: BIG_NUMBER }).register();
 // eslint-disable-next-line
 new LegacySankeyPlugin().configure({ key: SANKEY }).register();
 // eslint-disable-next-line

diff --git a/superset-frontend/packages/superset-ui-demo/tsconfig.json b/superset-frontend/packages/superset-ui-demo/tsconfig.json
@@ -16,5 +16,6 @@
     "storybook",
     "../**/src",
     "../../plugins/**/src",
+    "../../plugins/**/types",
   ]
 }
diff --git a/superset-frontend/plugins/legacy-preset-chart-big-number/README.md b/superset-frontend/plugins/legacy-preset-chart-big-number/README.md