feat(query): add functions to wrap api calls with typings (#555)

* feat: add function to wrap api calls

* feat: add function to wrap api calls with returned type

* fix: remove deprecated

* fix: rename

* test: add unit test

* test: add unit tests

packages/superset-ui-query/package.json

@@ -24,5 +24,13 @@
   "homepage": "https://github.com/apache-superset/superset-ui#readme",
   "publishConfig": {
     "access": "public"
+  },
+  "devDependencies": {
+    "@types/fetch-mock": "^6.0.4",
+    "fetch-mock": "^7.2.5",
+    "node-fetch": "^2.2.0"
+  },
+  "peerDependencies": {
+    "@superset-ui/connection": "^0.13.25"
   }
 }

packages/superset-ui-query/src/api/legacy/fetchExploreJson.ts

@@ -0,0 +1,28 @@
+import { SupersetClientInterface, SupersetClient, RequestConfig } from '@superset-ui/connection';
+import { QueryFormData } from '../../types/QueryFormData';
+import { LegacyChartDataResponse } from './types';
+
+export interface Params {
+  client?: SupersetClientInterface;
+  method?: 'GET' | 'POST';
+  requestConfig?: Partial<RequestConfig>;
+  url?: string;
+  formData: QueryFormData;
+}
+
+export default function fetchExploreJson({
+  client = SupersetClient,
+  method = 'POST',
+  requestConfig,
+  url = '/superset/explore_json/',
+  formData,
+}: Params) {
+  const fetchFunc = method === 'GET' ? client.get : client.post;
+
+  return fetchFunc({
+    ...requestConfig,
+    // TODO: Have to transform formData as query string for GET
+    url,
+    postPayload: { form_data: formData },
+  } as RequestConfig).then(({ json }) => json as LegacyChartDataResponse);
+}

packages/superset-ui-query/src/api/legacy/types.ts

@@ -0,0 +1,5 @@
+import { V1ChartDataResponseResult } from '../v1/types';
+
+export interface LegacyChartDataResponse extends Omit<V1ChartDataResponseResult, 'data'> {
+  data: Record<string, unknown>[] | Record<string, unknown>;
+}

packages/superset-ui-query/src/api/v1/postChartData.ts

@@ -0,0 +1,24 @@
+import { SupersetClientInterface, SupersetClient, RequestConfig } from '@superset-ui/connection';
+import { QueryContext } from '../../types/Query';
+import { V1ChartDataResponse } from './types';
+
+export interface Params {
+  client?: SupersetClientInterface;
+  requestConfig?: Partial<RequestConfig>;
+  queryContext: QueryContext;
+}
+
+export default function postChartData({
+  client = SupersetClient,
+  requestConfig,
+  queryContext,
+}: Params) {
+  return client
+    .post({
+      ...requestConfig,
+      endpoint: '/api/v1/chart/data',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(queryContext),
+    } as RequestConfig)
+    .then(({ json }) => json as V1ChartDataResponse);
+}

packages/superset-ui-query/src/api/v1/types.ts

@@ -0,0 +1,17 @@
+/* eslint-disable camelcase */
+export interface V1ChartDataResponseResult {
+  cache_key: string | null;
+  cache_timeout: number | null;
+  cache_dttm: string | null;
+  data: Record<string, unknown>[];
+  error: string | null;
+  is_cached: boolean;
+  query: string;
+  rowcount: number;
+  stacktrace: string | null;
+  status: 'stopped' | 'failed' | 'pending' | 'running' | 'scheduled' | 'success' | 'timed_out';
+}
+
+export interface V1ChartDataResponse {
+  result: V1ChartDataResponseResult[];
+}

packages/superset-ui-query/src/index.ts

@@ -9,3 +9,10 @@ export * from './types/Column';
 export * from './types/Datasource';
 export * from './types/Metric';
 export * from './types/Query';
+
+// API Calls
+export { default as fetchExploreJson } from './api/legacy/fetchExploreJson';
+export { default as postChartData } from './api/v1/postChartData';
+
+export * from './api/legacy/types';
+export * from './api/v1/types';

packages/superset-ui-query/test/api/fixtures/constants.ts

@@ -0,0 +1 @@
+export const LOGIN_GLOB = 'glob:*superset/csrf_token/*'; // eslint-disable-line import/prefer-default-export

packages/superset-ui-query/test/api/legacy/fetchExploreJson.test.ts

@@ -0,0 +1,54 @@
+import fetchMock from 'fetch-mock';
+import { SupersetClient } from '@superset-ui/connection';
+import { LOGIN_GLOB } from '../fixtures/constants';
+import { fetchExploreJson } from '../../../src';
+
+describe('fetchExploreJson()', () => {
+  beforeAll(() => {
+    fetchMock.get(LOGIN_GLOB, { csrf_token: '1234' });
+    SupersetClient.reset();
+    SupersetClient.configure().init();
+  });
+
+  afterEach(fetchMock.restore);
+
+  it('returns a promise of LegacyChartDataResponse', () => {
+    fetchMock.post('glob:*/superset/explore_json/', {
+      field1: 'abc',
+      field2: 'def',
+    });
+
+    return expect(
+      fetchExploreJson({
+        formData: {
+          granularity: 'minute',
+          viz_type: 'word_cloud',
+          datasource: '1__table',
+        },
+      }),
+    ).resolves.toEqual({
+      field1: 'abc',
+      field2: 'def',
+    });
+  });
+  it('uses GET when specified', () => {
+    fetchMock.get('glob:*/superset/explore_json/', {
+      field1: 'abc',
+      field2: 'def',
+    });
+
+    return expect(
+      fetchExploreJson({
+        method: 'GET',
+        formData: {
+          granularity: 'minute',
+          viz_type: 'word_cloud',
+          datasource: '1__table',
+        },
+      }),
+    ).resolves.toEqual({
+      field1: 'abc',
+      field2: 'def',
+    });
+  });
+});

packages/superset-ui-query/test/api/v1/postChartData.test.ts

@@ -0,0 +1,42 @@
+import fetchMock from 'fetch-mock';
+import { SupersetClient } from '@superset-ui/connection';
+import { LOGIN_GLOB } from '../fixtures/constants';
+import { postChartData, buildQueryContext } from '../../../src';
+
+describe('postChartData()', () => {
+  beforeAll(() => {
+    fetchMock.get(LOGIN_GLOB, { csrf_token: '1234' });
+    SupersetClient.reset();
+    SupersetClient.configure().init();
+  });
+
+  afterEach(fetchMock.restore);
+
+  it('returns a promise of ChartDataResponse', () => {
+    fetchMock.post('glob:*/api/v1/chart/data', {
+      result: [
+        {
+          field1: 'abc',
+          field2: 'def',
+        },
+      ],
+    });
+
+    return expect(
+      postChartData({
+        queryContext: buildQueryContext({
+          granularity: 'minute',
+          viz_type: 'word_cloud',
+          datasource: '1__table',
+        }),
+      }),
+    ).resolves.toEqual({
+      result: [
+        {
+          field1: 'abc',
+          field2: 'def',
+        },
+      ],
+    });
+  });
+});