Merge remote-tracking branch 'upstream/master' into allow_prefixed_paths

.github/workflows/superset-e2e.yml

@@ -141,4 +141,4 @@ jobs:
         if: failure()
         with:
           path: ${{ github.workspace }}/superset-frontend/cypress-base/cypress/screenshots
-          name: cypress-artifact-${{ github.run_id }}-${{ github.job }}
+          name: cypress-artifact-${{ github.run_id }}-${{ github.job }}-${{ matrix.browser }}-${{ matrix.parallel_id }}

superset-frontend/.eslintrc.js

@@ -331,14 +331,19 @@ module.exports = {
     'no-prototype-builtins': 0,
     'no-restricted-properties': 0,
     'no-restricted-imports': [
-      'warn',
+      'error',
       {
         paths: [
           {
             name: 'antd',
             message:
               'Please import Ant components from the index of src/components',
           },
+          {
+            name: 'antd-v5',
+            message:
+              'Please import Ant v5 components from the index of src/components',
+          },
           {
             name: '@superset-ui/core',
             importNames: ['supersetTheme'],

superset-frontend/cypress-base/cypress/e2e/dashboard/drillby.test.ts

@@ -599,7 +599,7 @@ describe('Drill by modal', () => {
       ]);
     });
 
-    it('Radar Chart', () => {
+    it.skip('Radar Chart', () => {
       testEchart('radar', 'Radar Chart', [
         [182, 49],
         [423, 91],

superset-frontend/cypress-base/cypress/e2e/dashboard/drilltodetail.test.ts

@@ -335,7 +335,7 @@ describe('Drill to detail modal', () => {
       });
     });
 
-    describe('Bar Chart', () => {
+    describe.skip('Bar Chart', () => {
       it('opens the modal with the correct filters', () => {
         interceptSamples();
 
@@ -373,7 +373,7 @@ describe('Drill to detail modal', () => {
       });
     });
 
-    describe('Area Chart', () => {
+    describe.skip('Area Chart', () => {
       it('opens the modal with the correct filters', () => {
         testTimeChart('echarts_area');
       });
@@ -407,7 +407,7 @@ describe('Drill to detail modal', () => {
       });
     });
 
-    describe('World Map', () => {
+    describe.skip('World Map', () => {
       it('opens the modal with the correct filters', () => {
         interceptSamples();
 
@@ -567,7 +567,7 @@ describe('Drill to detail modal', () => {
       });
     });
 
-    describe('Radar Chart', () => {
+    describe.skip('Radar Chart', () => {
       it('opens the modal with the correct filters', () => {
         interceptSamples();
 

superset-frontend/cypress-base/cypress/e2e/dashboard/horizontalFilterBar.test.ts

@@ -176,7 +176,7 @@ describe('Horizontal FilterBar', () => {
     validateFilterNameOnDashboard(testItems.topTenChart.filterColumn);
   });
 
-  it('should spot changes in "more filters" and apply their values', () => {
+  it.skip('should spot changes in "more filters" and apply their values', () => {
     cy.intercept(`/api/v1/chart/data?form_data=**`).as('chart');
     prepareDashboardFilters([
       { name: 'test_1', column: 'country_name', datasetId: 2 },
@@ -204,7 +204,7 @@ describe('Horizontal FilterBar', () => {
     );
   });
 
-  it('should focus filter and open "more filters" programmatically', () => {
+  it.skip('should focus filter and open "more filters" programmatically', () => {
     prepareDashboardFilters([
       { name: 'test_1', column: 'country_name', datasetId: 2 },
       { name: 'test_2', column: 'country_code', datasetId: 2 },
@@ -231,7 +231,7 @@ describe('Horizontal FilterBar', () => {
     cy.get('.ant-select-focused').should('be.visible');
   });
 
-  it('should show tag count and one plain tag on focus and only count on blur in select ', () => {
+  it.skip('should show tag count and one plain tag on focus and only count on blur in select ', () => {
     prepareDashboardFilters([
       { name: 'test_1', column: 'country_name', datasetId: 2 },
     ]);

superset-frontend/cypress-base/cypress/e2e/dashboard_list/list.test.ts

@@ -206,7 +206,7 @@ describe('Dashboards list', () => {
         .should('not.contain', '4 - Sample dashboard');
     });
 
-    it('should delete correctly in list mode', () => {
+    it.skip('should delete correctly in list mode', () => {
       // deletes in list-view
       setGridMode('list');
 

superset-frontend/cypress-base/cypress/e2e/explore/annotations.test.ts

@@ -18,7 +18,7 @@
  */
 import { interceptChart } from 'cypress/utils';
 
-describe('Annotations', () => {
+describe.skip('Annotations', () => {
   beforeEach(() => {
     interceptChart({ legacy: false }).as('chartData');
   });

superset-frontend/cypress-base/cypress/e2e/sqllab/query.test.ts

@@ -142,10 +142,11 @@ describe('SqlLab query panel', () => {
     });
   });
 
-  it('Create a chart from a query', () => {
+  it.skip('Create a chart from a query', () => {
     cy.intercept('/api/v1/sqllab/execute/').as('queryFinished');
     cy.intercept('**/api/v1/explore/**').as('explore');
     cy.intercept('**/api/v1/chart/**').as('chart');
+    cy.intercept('**/tabstateview/**').as('tabstateview');
 
     // cypress doesn't handle opening a new tab, override window.open to open in the same tab
     cy.window().then(win => {
@@ -154,6 +155,7 @@ describe('SqlLab query panel', () => {
         win.location.href = url;
       });
     });
+    cy.wait('@tabstateview');
 
     const query = 'SELECT gender, name FROM birth_names';
 

superset-frontend/cypress-base/cypress/support/e2e.ts

@@ -169,7 +169,7 @@ Cypress.Commands.add('login', () => {
   }).then(response => {
     if (response.status === 302) {
       // If there's a redirect, follow it manually
-      const redirectUrl = response.headers['location'];
+      const redirectUrl = response.headers.location;
       cy.request({
         method: 'GET',
         url: redirectUrl,

superset-frontend/package.json

@@ -193,7 +193,7 @@
     "react-split": "^2.0.9",
     "react-syntax-highlighter": "^15.4.5",
     "react-table": "^7.8.0",
-    "react-transition-group": "^2.5.3",
+    "react-transition-group": "^4.4.5",
     "react-ultimate-pagination": "^1.3.2",
     "react-virtualized-auto-sizer": "^1.0.25",
     "react-window": "^1.8.10",
@@ -271,7 +271,7 @@
     "@types/react-router-dom": "^5.3.3",
     "@types/react-syntax-highlighter": "^15.5.13",
     "@types/react-table": "^7.7.20",
-    "@types/react-transition-group": "^4.4.10",
+    "@types/react-transition-group": "^4.4.12",
     "@types/react-ultimate-pagination": "^1.2.4",
     "@types/react-virtualized-auto-sizer": "^1.0.4",
     "@types/react-window": "^1.8.8",

superset-frontend/packages/superset-ui-core/src/models/Registry.ts

@@ -22,11 +22,11 @@ export enum OverwritePolicy {
   Warn = 'WARN',
 }
 
-interface ItemWithValue<T> {
+export interface ItemWithValue<T> {
   value: T;
 }
 
-interface ItemWithLoader<T> {
+export interface ItemWithLoader<T> {
   loader: () => T;
 }
 

superset-frontend/packages/superset-ui-core/src/style/index.tsx

@@ -98,13 +98,6 @@ const defaultTheme = {
       light2: '#FAEDEE',
     },
     warning: {
-      base: '#FF7F44',
-      dark1: '#BF5E33',
-      dark2: '#7F3F21',
-      light1: '#FEC0A1',
-      light2: '#FFF2EC',
-    },
-    alert: {
       base: '#FCC700',
       dark1: '#BC9501',
       dark2: '#7D6300',

superset-frontend/plugins/legacy-plugin-chart-calendar/src/ReactCalendar.jsx

@@ -157,13 +157,13 @@ export default styled(Calendar)`
     }
 
     .cal-heatmap-container .q1 {
-      background-color: ${theme.colors.alert.light2};
-      fill: ${theme.colors.alert.light2};
+      background-color: ${theme.colors.warning.light2};
+      fill: ${theme.colors.warning.light2};
     }
 
     .cal-heatmap-container .q2 {
-      background-color: ${theme.colors.alert.light1};
-      fill: ${theme.colors.alert.light1};
+      background-color: ${theme.colors.warning.light1};
+      fill: ${theme.colors.warning.light1};
     }
 
     .cal-heatmap-container .q3 {

superset-frontend/src/components/Alert/Alert.stories.tsx

@@ -46,17 +46,6 @@ export const AlertGallery = () => (
             message={smallText}
             description={bigText}
             closable
-            closeIcon={
-              <span
-                aria-label="close icon"
-                style={{
-                  fontSize: '12px',
-                  fontWeight: 'bold',
-                }}
-              >
-                x
-              </span>
-            }
           />
         </div>
       </div>

superset-frontend/src/components/Alert/Alert.test.tsx

@@ -27,19 +27,17 @@ test('renders with default props', async () => {
   render(<Alert message="Message" />);
 
   expect(screen.getByRole('alert')).toHaveTextContent('Message');
-  expect(await screen.findByLabelText('info icon')).toBeInTheDocument();
-  expect(await screen.findByLabelText('close icon')).toBeInTheDocument();
+  expect(screen.getByRole('img', { name: 'info-circle' })).toBeInTheDocument();
 });
 
-test('renders each type', async () => {
+test('renders message for each alert type', () => {
   const types: AlertTypeValue[] = ['info', 'error', 'warning', 'success'];
 
-  await Promise.all(
-    types.map(async type => {
-      render(<Alert type={type} message="Message" />);
-      expect(await screen.findByLabelText(`${type} icon`)).toBeInTheDocument();
-    }),
-  );
+  types.forEach(type => {
+    const { rerender } = render(<Alert type={type} message="Test message" />);
+    expect(screen.getByText('Test message')).toBeInTheDocument();
+    rerender(<></>); // Clean up between renders
+  });
 });
 
 test('renders without close button', async () => {
@@ -51,7 +49,7 @@ test('renders without close button', async () => {
 
 test('disappear when closed', async () => {
   render(<Alert message="Message" />);
-  userEvent.click(screen.getByLabelText('close icon'));
+  userEvent.click(screen.getByRole('img', { name: 'close' }));
   await waitFor(() => {
     expect(screen.queryByRole('alert')).not.toBeInTheDocument();
   });
@@ -74,6 +72,6 @@ test('renders message and description', async () => {
 test('calls onClose callback when closed', () => {
   const onCloseMock = jest.fn();
   render(<Alert message="Message" onClose={onCloseMock} />);
-  userEvent.click(screen.getByLabelText('close icon'));
+  userEvent.click(screen.getByRole('img', { name: 'close' }));
   expect(onCloseMock).toHaveBeenCalledTimes(1);
 });