Merge remote-tracking branch 'origin/master' into craig/add-manifest-…

…prefix # Conflicts: # superset/utils/async_query_manager.py
apache · Mar 16, 2022 · bb9eb32 · bb9eb32
2 parents 296511b + 181ecf4
commit bb9eb32
Show file tree

Hide file tree

Showing 12 changed files with 196 additions and 59 deletions.
diff --git a/superset-frontend/packages/superset-ui-core/src/chart/models/ChartMetadata.ts b/superset-frontend/packages/superset-ui-core/src/chart/models/ChartMetadata.ts
@@ -43,10 +43,11 @@ export interface ChartMetadataConfig {
   exampleGallery?: ExampleImage[];
   tags?: string[];
   category?: string | null;
-  label?: {
-    name?: ChartLabel;
-    description?: string;
-  } | null;
+  // deprecated: true hides a chart from all viz picker interactions.
+  deprecated?: boolean;
+  // label: ChartLabel.DEPRECATED which will display a "deprecated" label on the chart.
+  label?: ChartLabel | null;
+  labelExplanation?: string | null;
 }
 
 export default class ChartMetadata {
@@ -80,10 +81,11 @@ export default class ChartMetadata {
 
   category: string | null;
 
-  label?: {
-    name?: ChartLabel;
-    description?: string;
-  } | null;
+  deprecated?: boolean;
+
+  label?: ChartLabel | null;
+
+  labelExplanation?: string | null;
 
   constructor(config: ChartMetadataConfig) {
     const {
@@ -101,7 +103,9 @@ export default class ChartMetadata {
       exampleGallery = [],
       tags = [],
       category = null,
+      deprecated = false,
       label = null,
+      labelExplanation = null,
     } = config;
 
     this.name = name;
@@ -127,7 +131,9 @@ export default class ChartMetadata {
     this.exampleGallery = exampleGallery;
     this.tags = tags;
     this.category = category;
+    this.deprecated = deprecated;
     this.label = label;
+    this.labelExplanation = labelExplanation;
   }
 
   canBeAnnotationType(type: string): boolean {

diff --git a/superset-frontend/packages/superset-ui-core/src/chart/types/Base.ts b/superset-frontend/packages/superset-ui-core/src/chart/types/Base.ts
@@ -53,18 +53,21 @@ export interface PlainObject {
 }
 
 export enum ChartLabel {
-  VERIFIED = 'VERIFIED',
   DEPRECATED = 'DEPRECATED',
   FEATURED = 'FEATURED',
 }
 
-export const ChartLabelWeight = {
+export const chartLabelExplanations: Record<ChartLabel, string> = {
+  [ChartLabel.DEPRECATED]:
+    'This chart uses features or modules which are no longer actively maintained. It will eventually be replaced or removed.',
+  [ChartLabel.FEATURED]:
+    'This chart was tested and verified, so the overall experience should be stable.',
+};
+
+export const chartLabelWeight: Record<ChartLabel, { weight: number }> = {
   [ChartLabel.DEPRECATED]: {
     weight: -0.1,
   },
-  [ChartLabel.VERIFIED]: {
-    weight: 0.2,
-  },
   [ChartLabel.FEATURED]: {
     weight: 0.1,
   },

diff --git a/superset-frontend/src/SqlLab/components/QueryHistory/QueryHistory.test.tsx b/superset-frontend/src/SqlLab/components/QueryHistory/QueryHistory.test.tsx
@@ -0,0 +1,50 @@
+/**
+ * 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 { render, screen } from 'spec/helpers/testing-library';
+import QueryHistory from 'src/SqlLab/components/QueryHistory';
+
+const NOOP = () => {};
+const mockedProps = {
+  queries: [],
+  actions: {
+    queryEditorSetSql: NOOP,
+    cloneQueryToNewTab: NOOP,
+    fetchQueryResults: NOOP,
+    clearQueryResults: NOOP,
+    removeQuery: NOOP,
+  },
+  displayLimit: 1000,
+};
+
+const setup = (overrides = {}) => (
+  <QueryHistory {...mockedProps} {...overrides} />
+);
+
+describe('QueryHistory', () => {
+  it('Renders an empty state for query history', () => {
+    render(setup());
+
+    const emptyStateText = screen.getByText(
+      /run a query to display query history/i,
+    );
+
+    expect(emptyStateText).toBeVisible();
+  });
+});
diff --git a/superset-frontend/src/SqlLab/components/QueryHistory/index.tsx b/superset-frontend/src/SqlLab/components/QueryHistory/index.tsx
@@ -17,8 +17,8 @@
  * under the License.
  */
 import React from 'react';
-import Alert from 'src/components/Alert';
-import { t } from '@superset-ui/core';
+import { EmptyStateMedium } from 'src/components/EmptyState';
+import { t, styled } from '@superset-ui/core';
 import { Query } from 'src/SqlLab/types';
 import QueryTable from 'src/SqlLab/components/QueryTable';
 
@@ -34,6 +34,17 @@ interface QueryHistoryProps {
   displayLimit: number;
 }
 
+const StyledEmptyStateWrapper = styled.div`
+  height: 100%;
+  .ant-empty-image img {
+    margin-right: 28px;
+  }
+
+  p {
+    margin-right: 28px;
+  }
+`;
+
 const QueryHistory = ({ queries, actions, displayLimit }: QueryHistoryProps) =>
   queries.length > 0 ? (
     <QueryTable
@@ -52,7 +63,12 @@ const QueryHistory = ({ queries, actions, displayLimit }: QueryHistoryProps) =>
       displayLimit={displayLimit}
     />
   ) : (
-    <Alert type="info" message={t('No query history yet...')} />
+    <StyledEmptyStateWrapper>
+      <EmptyStateMedium
+        title={t('Run a query to display query history')}
+        image="document.svg"
+      />
+    </StyledEmptyStateWrapper>
   );
 
 export default QueryHistory;
diff --git a/superset-frontend/src/SqlLab/components/SouthPane/SouthPane.test.jsx b/superset-frontend/src/SqlLab/components/SouthPane/SouthPane.test.jsx
@@ -20,11 +20,15 @@ import React from 'react';
 import configureStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 import { styledShallow as shallow } from 'spec/helpers/theming';
+import { render, screen, act } from 'spec/helpers/testing-library';
 import SouthPaneContainer from 'src/SqlLab/components/SouthPane/state';
 import ResultSet from 'src/SqlLab/components/ResultSet';
 import '@testing-library/jest-dom/extend-expect';
 import { STATUS_OPTIONS } from 'src/SqlLab/constants';
 import { initialState } from 'src/SqlLab/fixtures';
+import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
+
+const NOOP = () => {};
 
 const mockedProps = {
   editorQueries: [
@@ -71,13 +75,36 @@ const mockedProps = {
   offline: false,
 };
 
+const mockedEmptyProps = {
+  editorQueries: [],
+  latestQueryId: '',
+  dataPreviewQueries: [],
+  actions: {
+    queryEditorSetSql: NOOP,
+    cloneQueryToNewTab: NOOP,
+    fetchQueryResults: NOOP,
+    clearQueryResults: NOOP,
+    removeQuery: NOOP,
+    setActiveSouthPaneTab: NOOP,
+  },
+  activeSouthPaneTab: '',
+  height: 100,
+  databases: '',
+  offline: false,
+  displayLimit: 100,
+  user: UserWithPermissionsAndRoles,
+  defaultQueryLimit: 100,
+};
+
 const middlewares = [thunk];
 const mockStore = configureStore(middlewares);
 const store = mockStore(initialState);
+const setup = (overrides = {}) => (
+  <SouthPaneContainer store={store} {...mockedProps} {...overrides} />
+);
 
-describe('SouthPane', () => {
-  const getWrapper = () =>
-    shallow(<SouthPaneContainer store={store} {...mockedProps} />).dive();
+describe('SouthPane - Enzyme', () => {
+  const getWrapper = () => shallow(setup()).dive();
 
   let wrapper;
 
@@ -95,3 +122,20 @@ describe('SouthPane', () => {
     );
   });
 });
+
+describe('SouthPane - RTL', () => {
+  const renderAndWait = overrides => {
+    const mounted = act(async () => {
+      render(setup(overrides));
+    });
+
+    return mounted;
+  };
+  it('Renders an empty state for results', async () => {
+    await renderAndWait(mockedEmptyProps);
+
+    const emptyStateText = screen.getByText(/run a query to display results/i);
+
+    expect(emptyStateText).toBeVisible();
+  });
+});
diff --git a/superset-frontend/src/SqlLab/components/SouthPane/index.tsx b/superset-frontend/src/SqlLab/components/SouthPane/index.tsx
@@ -20,6 +20,7 @@ import React, { createRef } from 'react';
 import shortid from 'shortid';
 import Alert from 'src/components/Alert';
 import Tabs from 'src/components/Tabs';
+import { EmptyStateMedium } from 'src/components/EmptyState';
 import { t, styled } from '@superset-ui/core';
 
 import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags';
@@ -93,6 +94,17 @@ const StyledPane = styled.div`
   }
 `;
 
+const StyledEmptyStateWrapper = styled.div`
+  height: 100%;
+  .ant-empty-image img {
+    margin-right: 28px;
+  }
+
+  p {
+    margin-right: 28px;
+  }
+`;
+
 export default function SouthPane({
   editorQueries,
   latestQueryId,
@@ -161,7 +173,12 @@ export default function SouthPane({
       }
     } else {
       results = (
-        <Alert type="info" message={t('Run a query to display results here')} />
+        <StyledEmptyStateWrapper>
+          <EmptyStateMedium
+            title={t('Run a query to display results')}
+            image="document.svg"
+          />
+        </StyledEmptyStateWrapper>
       );
     }
     return results;

diff --git a/superset-frontend/src/components/TimezoneSelector/TimezoneSelector.test.tsx b/superset-frontend/src/components/TimezoneSelector/TimezoneSelector.test.tsx
@@ -55,7 +55,7 @@ it('use the default timezone when an invalid timezone is provided', async () =>
   expect(onTimezoneChange).toHaveBeenLastCalledWith('Africa/Abidjan');
 });
 
-it('can select a timezone values and returns canonical value', async () => {
+it.skip('can select a timezone values and returns canonical value', async () => {
   const onTimezoneChange = jest.fn();
   render(
     <TimezoneSelector

diff --git a/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeGallery.tsx b/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeGallery.tsx
@@ -33,8 +33,8 @@ import {
   ChartMetadata,
   SupersetTheme,
   useTheme,
-  ChartLabel,
-  ChartLabelWeight,
+  chartLabelWeight,
+  chartLabelExplanations,
 } from '@superset-ui/core';
 import { AntdCollapse } from 'src/components';
 import { Tooltip } from 'src/components/Tooltip';
@@ -414,10 +414,10 @@ const Thumbnail: React.FC<ThumbnailProps> = ({
       >
         {type.name}
       </div>
-      {type.label?.name && (
+      {type.label && (
         <ThumbnailLabelWrapper>
           <HighlightLabel>
-            <div>{t(type.label?.name)}</div>
+            <div>{t(type.label)}</div>
           </HighlightLabel>
         </ThumbnailLabelWrapper>
       )}
@@ -503,8 +503,7 @@ export default function VizTypeGallery(props: VizTypeGalleryProps) {
       .map(([key, value]) => ({ key, value }))
       .filter(
         ({ value }) =>
-          nativeFilterGate(value.behaviors || []) &&
-          value.label?.name !== ChartLabel.DEPRECATED,
+          nativeFilterGate(value.behaviors || []) && !value.deprecated,
       );
     result.sort((a, b) => vizSortFactor(a) - vizSortFactor(b));
     return result;
@@ -593,12 +592,16 @@ export default function VizTypeGallery(props: VizTypeGalleryProps) {
       .search(searchInputValue)
       .map(result => result.item)
       .sort((a, b) => {
-        const aName = a.value?.label?.name;
-        const bName = b.value?.label?.name;
+        const aLabel = a.value?.label;
+        const bLabel = b.value?.label;
         const aOrder =
-          aName && ChartLabelWeight[aName] ? ChartLabelWeight[aName].weight : 0;
+          aLabel && chartLabelWeight[aLabel]
+            ? chartLabelWeight[aLabel].weight
+            : 0;
         const bOrder =
-          bName && ChartLabelWeight[bName] ? ChartLabelWeight[bName].weight : 0;
+          bLabel && chartLabelWeight[bLabel]
+            ? chartLabelWeight[bLabel].weight
+            : 0;
         return bOrder - aOrder;
       });
   }, [searchInputValue, fuse]);
@@ -798,15 +801,18 @@ export default function VizTypeGallery(props: VizTypeGalleryProps) {
               `}
             >
               {selectedVizMetadata?.name}
-              {selectedVizMetadata?.label?.name && (
+              {selectedVizMetadata?.label && (
                 <Tooltip
                   id="viz-badge-tooltip"
                   placement="top"
-                  title={selectedVizMetadata.label?.description}
+                  title={
+                    selectedVizMetadata.labelExplanation ??
+                    chartLabelExplanations[selectedVizMetadata.label]
+                  }
                 >
                   <TitleLabelWrapper>
                     <HighlightLabel>
-                      <div>{t(selectedVizMetadata.label?.name)}</div>
+                      <div>{t(selectedVizMetadata.label)}</div>
                     </HighlightLabel>
                   </TitleLabelWrapper>
                 </Tooltip>

diff --git a/superset-frontend/src/views/CRUD/utils.tsx b/superset-frontend/src/views/CRUD/utils.tsx
@@ -412,12 +412,11 @@ export const hasTerminalValidation = (errors: Record<string, any>[]) =>
   );
 
 export const checkUploadExtensions = (
-  perm: Array<any> | string | undefined | boolean,
-  cons: Array<any>,
+  perm: Array<string>,
+  cons: Array<string>,
 ) => {
   if (perm !== undefined) {
-    if (typeof perm === 'boolean') return perm;
-    return intersection(perm, cons).length;
+    return intersection(perm, cons).length > 0;
   }
   return false;
 };