fix(tests): update SuperChartCore test to handle Ant Design App wrapper

The test was failing because the SupersetThemeProvider wraps all content
with an Ant Design App component, which creates a div with class 'ant-app'.
The test expected the container to be completely empty when chartProps=null,
but this was never possible due to the theme provider wrapper.

Updated the test to:
- Check that no chart component (.test-component) is rendered
- Verify that only the Ant Design App wrapper (.ant-app) is present

This fix is more accurate as it tests the actual intended behavior:
when chartProps is null, no chart content should render, but the
theme provider infrastructure should still be in place.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

.github/CODEOWNERS

@@ -33,10 +33,10 @@
 
 # Notify PMC members of changes to extension-related files
 
-/superset-core/ @michael-s-molina @villebro
-/superset-extensions-cli/ @michael-s-molina @villebro
-/superset/core/ @michael-s-molina @villebro
-/superset/extensions/ @michael-s-molina @villebro
-/superset-frontend/src/packages/superset-core/ @michael-s-molina @villebro
-/superset-frontend/src/core/ @michael-s-molina @villebro
-/superset-frontend/src/extensions/ @michael-s-molina @villebro
+/superset-core/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje
+/superset-extensions-cli/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje
+/superset/core/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje
+/superset/extensions/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje
+/superset-frontend/src/packages/superset-core/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje
+/superset-frontend/src/core/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje
+/superset-frontend/src/extensions/ @michael-s-molina @villebro @geido @eschutho @rusackas @kgabryje

UPDATING.md

@@ -23,6 +23,8 @@ This file documents any backwards-incompatible changes in Superset and
 assists people when migrating to a new version.
 
 ## Next
+- [33055](https://github.com/apache/superset/pull/33055): Upgrades Flask-AppBuilder to 5.0.0. The AUTH_OID authentication type has been deprecated and is no longer available as an option in Flask-AppBuilder. OpenID (OID) is considered a deprecated authentication protocol - if you are using AUTH_OID, you will need to migrate to an alternative authentication method such as OAuth, LDAP, or database authentication before upgrading.
+- [35062](https://github.com/apache/superset/pull/35062): Changed the function signature of `setupExtensions` to `setupCodeOverrides` with options as arguments.
 - [34871](https://github.com/apache/superset/pull/34871): Fixed Jest test hanging issue from Ant Design v5 upgrade. MessageChannel is now mocked in test environment to prevent rc-overflow from causing Jest to hang. Test environment only - no production impact.
 - [34782](https://github.com/apache/superset/pull/34782): Dataset exports now include the dataset ID in their file name (similar to charts and dashboards). If managing assets as code, make sure to rename existing dataset YAMLs to include the ID (and avoid duplicated files).
 - [34536](https://github.com/apache/superset/pull/34536): The `ENVIRONMENT_TAG_CONFIG` color values have changed to support only Ant Design semantic colors. Update your `superset_config.py`:

docs/docs/configuration/configuring-superset.mdx

@@ -363,110 +363,6 @@ CUSTOM_SECURITY_MANAGER = CustomSsoSecurityManager
   ]
   ```
 
-### Keycloak-Specific Configuration using Flask-OIDC
-
-If you are using Keycloak as OpenID Connect 1.0 Provider, the above configuration based on [`Authlib`](https://authlib.org/) might not work. In this case using [`Flask-OIDC`](https://pypi.org/project/flask-oidc/) is a viable option.
-
-Make sure the pip package [`Flask-OIDC`](https://pypi.org/project/flask-oidc/) is installed on the webserver. This was successfully tested using version 2.2.0. This package requires [`Flask-OpenID`](https://pypi.org/project/Flask-OpenID/) as a dependency.
-
-The following code defines a new security manager.  Add it to a new file named `keycloak_security_manager.py`, placed in the same directory as your `superset_config.py` file.
-
-```python
-from flask_appbuilder.security.manager import AUTH_OID
-from superset.security import SupersetSecurityManager
-from flask_oidc import OpenIDConnect
-from flask_appbuilder.security.views import AuthOIDView
-from flask_login import login_user
-from urllib.parse import quote
-from flask_appbuilder.views import ModelView, SimpleFormView, expose
-from flask import (
-    redirect,
-    request
-)
-import logging
-
-class OIDCSecurityManager(SupersetSecurityManager):
-
-    def __init__(self, appbuilder):
-        super(OIDCSecurityManager, self).__init__(appbuilder)
-        if self.auth_type == AUTH_OID:
-            self.oid = OpenIDConnect(self.appbuilder.get_app)
-        self.authoidview = AuthOIDCView
-
-class AuthOIDCView(AuthOIDView):
-
-    @expose('/login/', methods=['GET', 'POST'])
-    def login(self, flag=True):
-        sm = self.appbuilder.sm
-        oidc = sm.oid
-
-        @self.appbuilder.sm.oid.require_login
-        def handle_login():
-            user = sm.auth_user_oid(oidc.user_getfield('email'))
-
-            if user is None:
-                info = oidc.user_getinfo(['preferred_username', 'given_name', 'family_name', 'email'])
-                user = sm.add_user(info.get('preferred_username'), info.get('given_name'), info.get('family_name'),
-                                   info.get('email'), sm.find_role('Gamma'))
-
-            login_user(user, remember=False)
-            return redirect(self.appbuilder.get_url_for_index)
-
-        return handle_login()
-
-    @expose('/logout/', methods=['GET', 'POST'])
-    def logout(self):
-        oidc = self.appbuilder.sm.oid
-
-        oidc.logout()
-        super(AuthOIDCView, self).logout()
-        redirect_url = request.url_root.strip('/') + self.appbuilder.get_url_for_login
-
-        return redirect(
-            oidc.client_secrets.get('issuer') + '/protocol/openid-connect/logout?redirect_uri=' + quote(redirect_url))
-```
-
-Then add to your `superset_config.py` file:
-
-```python
-from keycloak_security_manager import OIDCSecurityManager
-from flask_appbuilder.security.manager import AUTH_OID, AUTH_REMOTE_USER, AUTH_DB, AUTH_LDAP, AUTH_OAUTH
-import os
-
-AUTH_TYPE = AUTH_OID
-SECRET_KEY: 'SomethingNotEntirelySecret'
-OIDC_CLIENT_SECRETS =  '/path/to/client_secret.json'
-OIDC_ID_TOKEN_COOKIE_SECURE = False
-OIDC_OPENID_REALM: '<myRealm>'
-OIDC_INTROSPECTION_AUTH_METHOD: 'client_secret_post'
-CUSTOM_SECURITY_MANAGER = OIDCSecurityManager
-
-# Will allow user self registration, allowing to create Flask users from Authorized User
-AUTH_USER_REGISTRATION = True
-
-# The default user self registration role
-AUTH_USER_REGISTRATION_ROLE = 'Public'
-```
-
-Store your client-specific OpenID information in a file called `client_secret.json`. Create this file in the same directory as `superset_config.py`:
-
-```json
-{
-    "<myOpenIDProvider>": {
-        "issuer": "https://<myKeycloakDomain>/realms/<myRealm>",
-        "auth_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/auth",
-        "client_id": "https://<myKeycloakDomain>",
-        "client_secret": "<myClientSecret>",
-        "redirect_uris": [
-            "https://<SupersetWebserver>/oauth-authorized/<myOpenIDProvider>"
-  ],
-        "userinfo_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/userinfo",
-        "token_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/token",
-        "token_introspection_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/token/introspect"
-  }
-}
-```
-
 ## LDAP Authentication
 
 FAB supports authenticating user credentials against an LDAP server.

docs/docs/contributing/development.mdx

@@ -620,10 +620,10 @@ See [how tos](/docs/contributing/howtos#linting)
 
 :::tip
 `act` compatibility of Superset's GHAs is not fully tested. Running `act` locally may or may not
-work for different actions, and may require fine tunning and local secret-handling.
+work for different actions, and may require fine tuning and local secret-handling.
 For those more intricate GHAs that are tricky to run locally, we recommend iterating
 directly on GHA's infrastructure, by pushing directly on a branch and monitoring GHA logs.
-For more targetted iteration, see the `gh workflow run --ref {BRANCH}` subcommand of the GitHub CLI.
+For more targeted iteration, see the `gh workflow run --ref {BRANCH}` subcommand of the GitHub CLI.
 :::
 
 For automation and CI/CD, Superset makes extensive use of GitHub Actions (GHA). You

docs/docs/contributing/howtos.mdx

@@ -232,7 +232,7 @@ CYPRESS_CONFIG=true docker compose up --build
 ```
 `docker compose` will get to work and expose a Cypress-ready Superset app.
 This app uses a different database schema (`superset_cypress`) to keep it isolated from
-your other dev environmen(s)t, a specific set of examples, and a set of configurations that
+your other dev environment(s), a specific set of examples, and a set of configurations that
 aligns with the expectations within the end-to-end tests.  Also note that it's served on a
 different port than the default port for the backend (`8088`).
 
@@ -627,7 +627,7 @@ feature flag to `true`, you can add the following line to the PR body/descriptio
 FEATURE_TAGGING_SYSTEM=true
 ```
 
-Simarly, it's possible to disable feature flags with:
+Similarly, it's possible to disable feature flags with:
 
 ```
 FEATURE_TAGGING_SYSTEM=false

docs/docs/installation/docker-compose.mdx

@@ -282,5 +282,5 @@ address.
 When running `docker compose up`, docker will build what is required behind the scene, but
 may use the docker cache if assets already exist. Running `docker compose build` prior to
 `docker compose up` or the equivalent shortcut `docker compose up --build` ensures that your
-docker images matche the definition in the repository. This should only apply to the main
+docker images match the definition in the repository. This should only apply to the main
 docker-compose.yml file (default) and not to the alternative methods defined above.

docs/package.json

@@ -65,7 +65,7 @@
     "storybook": "^8.6.11",
     "swagger-ui-react": "^5.27.1",
     "tinycolor2": "^1.4.2",
-    "ts-loader": "^9.5.2"
+    "ts-loader": "^9.5.4"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "^3.8.1",
@@ -73,7 +73,7 @@
     "@eslint/js": "^9.32.0",
     "@types/react": "^19.1.8",
     "@typescript-eslint/eslint-plugin": "^8.37.0",
-    "@typescript-eslint/parser": "^8.37.0",
+    "@typescript-eslint/parser": "^8.42.0",
     "eslint": "^9.34.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.3",

docs/versioned_docs/version-6.0.0/configuration/configuring-superset.mdx

@@ -363,110 +363,6 @@ CUSTOM_SECURITY_MANAGER = CustomSsoSecurityManager
   ]
   ```
 
-### Keycloak-Specific Configuration using Flask-OIDC
-
-If you are using Keycloak as OpenID Connect 1.0 Provider, the above configuration based on [`Authlib`](https://authlib.org/) might not work. In this case using [`Flask-OIDC`](https://pypi.org/project/flask-oidc/) is a viable option.
-
-Make sure the pip package [`Flask-OIDC`](https://pypi.org/project/flask-oidc/) is installed on the webserver. This was successfully tested using version 2.2.0. This package requires [`Flask-OpenID`](https://pypi.org/project/Flask-OpenID/) as a dependency.
-
-The following code defines a new security manager.  Add it to a new file named `keycloak_security_manager.py`, placed in the same directory as your `superset_config.py` file.
-
-```python
-from flask_appbuilder.security.manager import AUTH_OID
-from superset.security import SupersetSecurityManager
-from flask_oidc import OpenIDConnect
-from flask_appbuilder.security.views import AuthOIDView
-from flask_login import login_user
-from urllib.parse import quote
-from flask_appbuilder.views import ModelView, SimpleFormView, expose
-from flask import (
-    redirect,
-    request
-)
-import logging
-
-class OIDCSecurityManager(SupersetSecurityManager):
-
-    def __init__(self, appbuilder):
-        super(OIDCSecurityManager, self).__init__(appbuilder)
-        if self.auth_type == AUTH_OID:
-            self.oid = OpenIDConnect(self.appbuilder.get_app)
-        self.authoidview = AuthOIDCView
-
-class AuthOIDCView(AuthOIDView):
-
-    @expose('/login/', methods=['GET', 'POST'])
-    def login(self, flag=True):
-        sm = self.appbuilder.sm
-        oidc = sm.oid
-
-        @self.appbuilder.sm.oid.require_login
-        def handle_login():
-            user = sm.auth_user_oid(oidc.user_getfield('email'))
-
-            if user is None:
-                info = oidc.user_getinfo(['preferred_username', 'given_name', 'family_name', 'email'])
-                user = sm.add_user(info.get('preferred_username'), info.get('given_name'), info.get('family_name'),
-                                   info.get('email'), sm.find_role('Gamma'))
-
-            login_user(user, remember=False)
-            return redirect(self.appbuilder.get_url_for_index)
-
-        return handle_login()
-
-    @expose('/logout/', methods=['GET', 'POST'])
-    def logout(self):
-        oidc = self.appbuilder.sm.oid
-
-        oidc.logout()
-        super(AuthOIDCView, self).logout()
-        redirect_url = request.url_root.strip('/') + self.appbuilder.get_url_for_login
-
-        return redirect(
-            oidc.client_secrets.get('issuer') + '/protocol/openid-connect/logout?redirect_uri=' + quote(redirect_url))
-```
-
-Then add to your `superset_config.py` file:
-
-```python
-from keycloak_security_manager import OIDCSecurityManager
-from flask_appbuilder.security.manager import AUTH_OID, AUTH_REMOTE_USER, AUTH_DB, AUTH_LDAP, AUTH_OAUTH
-import os
-
-AUTH_TYPE = AUTH_OID
-SECRET_KEY: 'SomethingNotEntirelySecret'
-OIDC_CLIENT_SECRETS =  '/path/to/client_secret.json'
-OIDC_ID_TOKEN_COOKIE_SECURE = False
-OIDC_OPENID_REALM: '<myRealm>'
-OIDC_INTROSPECTION_AUTH_METHOD: 'client_secret_post'
-CUSTOM_SECURITY_MANAGER = OIDCSecurityManager
-
-# Will allow user self registration, allowing to create Flask users from Authorized User
-AUTH_USER_REGISTRATION = True
-
-# The default user self registration role
-AUTH_USER_REGISTRATION_ROLE = 'Public'
-```
-
-Store your client-specific OpenID information in a file called `client_secret.json`. Create this file in the same directory as `superset_config.py`:
-
-```json
-{
-    "<myOpenIDProvider>": {
-        "issuer": "https://<myKeycloakDomain>/realms/<myRealm>",
-        "auth_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/auth",
-        "client_id": "https://<myKeycloakDomain>",
-        "client_secret": "<myClientSecret>",
-        "redirect_uris": [
-            "https://<SupersetWebserver>/oauth-authorized/<myOpenIDProvider>"
-  ],
-        "userinfo_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/userinfo",
-        "token_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/token",
-        "token_introspection_uri": "https://<myKeycloakDomain>/realms/<myRealm>/protocol/openid-connect/token/introspect"
-  }
-}
-```
-
 ## LDAP Authentication
 
 FAB supports authenticating user credentials against an LDAP server.

docs/versioned_docs/version-6.0.0/contributing/development.mdx

@@ -620,10 +620,10 @@ See [how tos](/docs/contributing/howtos#linting)
 
 :::tip
 `act` compatibility of Superset's GHAs is not fully tested. Running `act` locally may or may not
-work for different actions, and may require fine tunning and local secret-handling.
+work for different actions, and may require fine tuning and local secret-handling.
 For those more intricate GHAs that are tricky to run locally, we recommend iterating
 directly on GHA's infrastructure, by pushing directly on a branch and monitoring GHA logs.
-For more targetted iteration, see the `gh workflow run --ref {BRANCH}` subcommand of the GitHub CLI.
+For more targeted iteration, see the `gh workflow run --ref {BRANCH}` subcommand of the GitHub CLI.
 :::
 
 For automation and CI/CD, Superset makes extensive use of GitHub Actions (GHA). You

docs/versioned_docs/version-6.0.0/contributing/howtos.mdx

@@ -232,7 +232,7 @@ CYPRESS_CONFIG=true docker compose up --build
 ```
 `docker compose` will get to work and expose a Cypress-ready Superset app.
 This app uses a different database schema (`superset_cypress`) to keep it isolated from
-your other dev environmen(s)t, a specific set of examples, and a set of configurations that
+your other dev environment(s), a specific set of examples, and a set of configurations that
 aligns with the expectations within the end-to-end tests.  Also note that it's served on a
 different port than the default port for the backend (`8088`).
 
@@ -627,7 +627,7 @@ feature flag to `true`, you can add the following line to the PR body/descriptio
 FEATURE_TAGGING_SYSTEM=true
 ```
 
-Simarly, it's possible to disable feature flags with:
+Similarly, it's possible to disable feature flags with:
 
 ```
 FEATURE_TAGGING_SYSTEM=false

docs/versioned_docs/version-6.0.0/installation/docker-compose.mdx

@@ -282,5 +282,5 @@ address.
 When running `docker compose up`, docker will build what is required behind the scene, but
 may use the docker cache if assets already exist. Running `docker compose build` prior to
 `docker compose up` or the equivalent shortcut `docker compose up --build` ensures that your
-docker images matche the definition in the repository. This should only apply to the main
+docker images match the definition in the repository. This should only apply to the main
 docker-compose.yml file (default) and not to the alternative methods defined above.

docs/yarn.lock

@@ -4102,7 +4102,7 @@
     natural-compare "^1.4.0"
     ts-api-utils "^2.1.0"
 
-"@typescript-eslint/parser@8.40.0", "@typescript-eslint/parser@^8.37.0":
+"@typescript-eslint/parser@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-8.40.0.tgz#1bc9f3701ced29540eb76ff2d95ce0d52ddc7e69"
   integrity sha512-jCNyAuXx8dr5KJMkecGmZ8KI61KBUhkCob+SD+C+I5+Y1FWI2Y3QmY4/cxMCC5WAsZqoEtEETVhUiUMIGCf6Bw==
@@ -4113,6 +4113,17 @@
     "@typescript-eslint/visitor-keys" "8.40.0"
     debug "^4.3.4"
 
+"@typescript-eslint/parser@^8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-8.42.0.tgz#20ea66f4867981fb5bb62cbe1454250fc4a440ab"
+  integrity sha512-r1XG74QgShUgXph1BYseJ+KZd17bKQib/yF3SR+demvytiRXrwd12Blnz5eYGm8tXaeRdd4x88MlfwldHoudGg==
+  dependencies:
+    "@typescript-eslint/scope-manager" "8.42.0"
+    "@typescript-eslint/types" "8.42.0"
+    "@typescript-eslint/typescript-estree" "8.42.0"
+    "@typescript-eslint/visitor-keys" "8.42.0"
+    debug "^4.3.4"
+
 "@typescript-eslint/project-service@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/project-service/-/project-service-8.40.0.tgz#1b7ba6079ff580c3215882fe75a43e5d3ed166b9"
@@ -4122,6 +4133,15 @@
     "@typescript-eslint/types" "^8.40.0"
     debug "^4.3.4"
 
+"@typescript-eslint/project-service@8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/project-service/-/project-service-8.42.0.tgz#636eb3418b6c42c98554dce884943708bf41a583"
+  integrity sha512-vfVpLHAhbPjilrabtOSNcUDmBboQNrJUiNAGoImkZKnMjs2TIcWG33s4Ds0wY3/50aZmTMqJa6PiwkwezaAklg==
+  dependencies:
+    "@typescript-eslint/tsconfig-utils" "^8.42.0"
+    "@typescript-eslint/types" "^8.42.0"
+    debug "^4.3.4"
+
 "@typescript-eslint/scope-manager@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-8.40.0.tgz#2fbfcc8643340d8cd692267e61548b946190be8a"
@@ -4130,11 +4150,24 @@
     "@typescript-eslint/types" "8.40.0"
     "@typescript-eslint/visitor-keys" "8.40.0"
 
+"@typescript-eslint/scope-manager@8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-8.42.0.tgz#36016757bc85b46ea42bae47b61f9421eddedde3"
+  integrity sha512-51+x9o78NBAVgQzOPd17DkNTnIzJ8T/O2dmMBLoK9qbY0Gm52XJcdJcCl18ExBMiHo6jPMErUQWUv5RLE51zJw==
+  dependencies:
+    "@typescript-eslint/types" "8.42.0"
+    "@typescript-eslint/visitor-keys" "8.42.0"
+
 "@typescript-eslint/tsconfig-utils@8.40.0", "@typescript-eslint/tsconfig-utils@^8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.40.0.tgz#8e8fdb9b988854aedd04abdde3239c4bdd2d26e4"
   integrity sha512-jtMytmUaG9d/9kqSl/W3E3xaWESo4hFDxAIHGVW/WKKtQhesnRIJSAJO6XckluuJ6KDB5woD1EiqknriCtAmcw==
 
+"@typescript-eslint/tsconfig-utils@8.42.0", "@typescript-eslint/tsconfig-utils@^8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.42.0.tgz#21a3e74396fd7443ff930bc41b27789ba7e9236e"
+  integrity sha512-kHeFUOdwAJfUmYKjR3CLgZSglGHjbNTi1H8sTYRYV2xX6eNz4RyJ2LIgsDLKf8Yi0/GL1WZAC/DgZBeBft8QAQ==
+
 "@typescript-eslint/type-utils@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-8.40.0.tgz#a7e4a1f0815dd0ba3e4eef945cc87193ca32c422"
@@ -4146,11 +4179,16 @@
     debug "^4.3.4"
     ts-api-utils "^2.1.0"
 
-"@typescript-eslint/types@8.40.0", "@typescript-eslint/types@^8.40.0":
+"@typescript-eslint/types@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-8.40.0.tgz#0b580fdf643737aa5c01285314b5c6e9543846a9"
   integrity sha512-ETdbFlgbAmXHyFPwqUIYrfc12ArvpBhEVgGAxVYSwli26dn8Ko+lIo4Su9vI9ykTZdJn+vJprs/0eZU0YMAEQg==
 
+"@typescript-eslint/types@8.42.0", "@typescript-eslint/types@^8.40.0", "@typescript-eslint/types@^8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-8.42.0.tgz#ae15c09cebda20473772902033328e87372db008"
+  integrity sha512-LdtAWMiFmbRLNP7JNeY0SqEtJvGMYSzfiWBSmx+VSZ1CH+1zyl8Mmw1TT39OrtsRvIYShjJWzTDMPWZJCpwBlw==
+
 "@typescript-eslint/typescript-estree@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-8.40.0.tgz#295149440ce7da81c790a4e14e327599a3a1e5c9"
@@ -4167,6 +4205,22 @@
     semver "^7.6.0"
     ts-api-utils "^2.1.0"
 
+"@typescript-eslint/typescript-estree@8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-8.42.0.tgz#593c3af87d4462252c0d7239d1720b84a1b56864"
+  integrity sha512-ku/uYtT4QXY8sl9EDJETD27o3Ewdi72hcXg1ah/kkUgBvAYHLwj2ofswFFNXS+FL5G+AGkxBtvGt8pFBHKlHsQ==
+  dependencies:
+    "@typescript-eslint/project-service" "8.42.0"
+    "@typescript-eslint/tsconfig-utils" "8.42.0"
+    "@typescript-eslint/types" "8.42.0"
+    "@typescript-eslint/visitor-keys" "8.42.0"
+    debug "^4.3.4"
+    fast-glob "^3.3.2"
+    is-glob "^4.0.3"
+    minimatch "^9.0.4"
+    semver "^7.6.0"
+    ts-api-utils "^2.1.0"
+
 "@typescript-eslint/utils@8.40.0":
   version "8.40.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-8.40.0.tgz#8d0c6430ed2f5dc350784bb0d8be514da1e54054"
@@ -4185,6 +4239,14 @@
     "@typescript-eslint/types" "8.40.0"
     eslint-visitor-keys "^4.2.1"
 
+"@typescript-eslint/visitor-keys@8.42.0":
+  version "8.42.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-8.42.0.tgz#87c6caaa1ac307bc73a87c1fc469f88f0162f27e"
+  integrity sha512-3WbiuzoEowaEn8RSnhJBrxSwX8ULYE9CXaPepS2C2W3NSA5NNIvBaslpBSBElPq0UGr0xVJlXFWOAKIkyylydQ==
+  dependencies:
+    "@typescript-eslint/types" "8.42.0"
+    eslint-visitor-keys "^4.2.1"
+
 "@ungap/structured-clone@^1.0.0":
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.3.0.tgz#d06bbb384ebcf6c505fde1c3d0ed4ddffe0aaff8"
@@ -13139,10 +13201,10 @@ ts-dedent@^2.0.0, ts-dedent@^2.2.0:
   resolved "https://registry.yarnpkg.com/ts-dedent/-/ts-dedent-2.2.0.tgz#39e4bd297cd036292ae2394eb3412be63f563bb5"
   integrity sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==
 
-ts-loader@^9.5.2:
-  version "9.5.2"
-  resolved "https://registry.yarnpkg.com/ts-loader/-/ts-loader-9.5.2.tgz#1f3d7f4bb709b487aaa260e8f19b301635d08020"
-  integrity sha512-Qo4piXvOTWcMGIgRiuFa6nHNm+54HbYaZCKqc9eeZCLRy3XqafQgwX2F7mofrbJG3g7EEb+lkiR+z2Lic2s3Zw==
+ts-loader@^9.5.4:
+  version "9.5.4"
+  resolved "https://registry.yarnpkg.com/ts-loader/-/ts-loader-9.5.4.tgz#44b571165c10fb5a90744aa5b7e119233c4f4585"
+  integrity sha512-nCz0rEwunlTZiy6rXFByQU1kVVpCIgUpc/psFiKVrUwrizdnIbRFu8w7bxhUF0X613DYwT4XzrZHpVyMe758hQ==
   dependencies:
     chalk "^4.1.0"
     enhanced-resolve "^5.0.0"

pyproject.toml

@@ -48,7 +48,7 @@ dependencies = [
     "cryptography>=42.0.4, <45.0.0",
     "deprecation>=2.1.0, <2.2.0",
     "flask>=2.2.5, <3.0.0",
-    "flask-appbuilder>=4.8.1, <5.0.0",
+    "flask-appbuilder>=5.0.0,<6",
     "flask-caching>=2.1.0, <3",
     "flask-compress>=1.13, <2.0",
     "flask-talisman>=1.0.0, <2.0",
@@ -88,7 +88,7 @@ dependencies = [
     "python-dateutil",
     "python-dotenv", # optional dependencies for Flask but required for Superset, see https://flask.palletsprojects.com/en/stable/installation/#optional-dependencies
     "python-geohash",
-    "pyarrow>=16.1.0, <17", # before upgrading pyarrow, check that all db dependencies support this, see e.g. https://github.com/apache/superset/pull/34693
+    "pyarrow>=16.1.0, <19", # before upgrading pyarrow, check that all db dependencies support this, see e.g. https://github.com/apache/superset/pull/34693
     "pyyaml>=6.0.0, <7.0.0",
     "PyJWT>=2.4.0, <3.0",
     "redis>=4.6.0, <5.0",

requirements/base.txt

@@ -114,11 +114,9 @@ flask==2.3.3
     #   flask-session
     #   flask-sqlalchemy
     #   flask-wtf
-flask-appbuilder==4.8.1
-    # via
-    #   apache-superset (pyproject.toml)
-    #   apache-superset-core
-flask-babel==2.0.0
+flask-appbuilder==5.0.0
+    # via apache-superset (pyproject.toml)
+flask-babel==3.1.0
     # via flask-appbuilder
 flask-caching==2.3.1
     # via apache-superset (pyproject.toml)

requirements/development.txt

@@ -208,12 +208,11 @@ flask==2.3.3
     #   flask-sqlalchemy
     #   flask-testing
     #   flask-wtf
-flask-appbuilder==4.8.1
+flask-appbuilder==5.0.0
     # via
     #   -c requirements/base-constraint.txt
     #   apache-superset
-    #   apache-superset-core
-flask-babel==2.0.0
+flask-babel==3.1.0
     # via
     #   -c requirements/base-constraint.txt
     #   flask-appbuilder

superset-core/pyproject.toml

@@ -42,7 +42,7 @@ classifiers = [
     "Topic :: Software Development :: Libraries :: Python Modules",
 ]
 dependencies = [
-    "flask-appbuilder>=4.5.3, <5.0.0",
+    "flask-appbuilder>=5.0.0,<6",
 ]
 
 [project.urls]

superset-embedded-sdk/package-lock.json

@@ -19,7 +19,6 @@
         "@babel/preset-typescript": "^7.24.7",
         "@types/jest": "^29.5.12",
         "@types/node": "^22.5.4",
-        "axios": "^1.7.7",
         "babel-loader": "^9.1.3",
         "jest": "^29.7.0",
         "tscw-config": "^1.1.2",
@@ -3233,24 +3232,6 @@
         "sprintf-js": "~1.0.2"
       }
     },
-    "node_modules/asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
-      "dev": true
-    },
-    "node_modules/axios": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.8.2.tgz",
-      "integrity": "sha512-ls4GYBm5aig9vWx8AWDSGLpnpDQRtWAfrjU+EuytuODrFBkqesN2RkOQCBzrA1RQNHw1SmRMSDDDSwzNAYQ6Rg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "follow-redirects": "^1.15.6",
-        "form-data": "^4.0.0",
-        "proxy-from-env": "^1.1.0"
-      }
-    },
     "node_modules/babel-jest": {
       "version": "29.7.0",
       "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz",
@@ -3644,19 +3625,6 @@
       "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
       "dev": true
     },
-    "node_modules/call-bind-apply-helpers": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
-      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
-      "dev": true,
-      "dependencies": {
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/callsites": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
@@ -3843,18 +3811,6 @@
       "integrity": "sha512-hUewv7oMjCp+wkBv5Rm0v87eJhq4woh5rSR+42YSQJKecCqgIqNkZ6lAlQms/BwHPJA5NKMRlpxPRv0n8HQW6g==",
       "dev": true
     },
-    "node_modules/combined-stream": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
-      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-      "dev": true,
-      "dependencies": {
-        "delayed-stream": "~1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
     "node_modules/commander": {
       "version": "6.2.1",
       "resolved": "https://registry.npmjs.org/commander/-/commander-6.2.1.tgz",
@@ -4045,15 +4001,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-      "dev": true,
-      "engines": {
-        "node": ">=0.4.0"
-      }
-    },
     "node_modules/detect-newline": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/detect-newline/-/detect-newline-3.1.0.tgz",
@@ -4063,20 +4010,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/dunder-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
-      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
-      "dev": true,
-      "dependencies": {
-        "call-bind-apply-helpers": "^1.0.1",
-        "es-errors": "^1.3.0",
-        "gopd": "^1.2.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/electron-to-chromium": {
       "version": "1.5.19",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.19.tgz",
@@ -4137,57 +4070,12 @@
         "is-arrayish": "^0.2.1"
       }
     },
-    "node_modules/es-define-property": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
-      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
-      "dev": true,
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
-    "node_modules/es-errors": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
-      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
-      "dev": true,
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/es-module-lexer": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz",
       "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==",
       "dev": true
     },
-    "node_modules/es-object-atoms": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
-      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
-      "dev": true,
-      "dependencies": {
-        "es-errors": "^1.3.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
-    "node_modules/es-set-tostringtag": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
-      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
-      "dev": true,
-      "dependencies": {
-        "es-errors": "^1.3.0",
-        "get-intrinsic": "^1.2.6",
-        "has-tostringtag": "^1.0.2",
-        "hasown": "^2.0.2"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/escalade": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
@@ -4628,42 +4516,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/follow-redirects": {
-      "version": "1.15.6",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
-      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://github.com/sponsors/RubenVerborgh"
-        }
-      ],
-      "engines": {
-        "node": ">=4.0"
-      },
-      "peerDependenciesMeta": {
-        "debug": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/form-data": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.4.tgz",
-      "integrity": "sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==",
-      "dev": true,
-      "dependencies": {
-        "asynckit": "^0.4.0",
-        "combined-stream": "^1.0.8",
-        "es-set-tostringtag": "^2.1.0",
-        "hasown": "^2.0.2",
-        "mime-types": "^2.1.12"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/fs-readdir-recursive": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/fs-readdir-recursive/-/fs-readdir-recursive-1.1.0.tgz",
@@ -4717,30 +4569,6 @@
         "node": "6.* || 8.* || >= 10.*"
       }
     },
-    "node_modules/get-intrinsic": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
-      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
-      "dev": true,
-      "dependencies": {
-        "call-bind-apply-helpers": "^1.0.2",
-        "es-define-property": "^1.0.1",
-        "es-errors": "^1.3.0",
-        "es-object-atoms": "^1.1.1",
-        "function-bind": "^1.1.2",
-        "get-proto": "^1.0.1",
-        "gopd": "^1.2.0",
-        "has-symbols": "^1.1.0",
-        "hasown": "^2.0.2",
-        "math-intrinsics": "^1.1.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/get-package-type": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz",
@@ -4750,19 +4578,6 @@
         "node": ">=8.0.0"
       }
     },
-    "node_modules/get-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
-      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
-      "dev": true,
-      "dependencies": {
-        "dunder-proto": "^1.0.1",
-        "es-object-atoms": "^1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/get-stream": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
@@ -4825,18 +4640,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/gopd": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
-      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
-      "dev": true,
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/graceful-fs": {
       "version": "4.2.11",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
@@ -4865,45 +4668,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/has-symbols": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
-      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
-      "dev": true,
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/has-tostringtag": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
-      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
-      "dev": true,
-      "dependencies": {
-        "has-symbols": "^1.0.3"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/hasown": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
-      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-      "dev": true,
-      "dependencies": {
-        "function-bind": "^1.1.2"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/html-escaper": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
@@ -7092,15 +6856,6 @@
         "tmpl": "1.0.5"
       }
     },
-    "node_modules/math-intrinsics": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
-      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
-      "dev": true,
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -7414,12 +7169,6 @@
         "node": ">= 6"
       }
     },
-    "node_modules/proxy-from-env": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "dev": true
-    },
     "node_modules/punycode": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz",
@@ -10724,23 +10473,6 @@
         "sprintf-js": "~1.0.2"
       }
     },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
-      "dev": true
-    },
-    "axios": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.8.2.tgz",
-      "integrity": "sha512-ls4GYBm5aig9vWx8AWDSGLpnpDQRtWAfrjU+EuytuODrFBkqesN2RkOQCBzrA1RQNHw1SmRMSDDDSwzNAYQ6Rg==",
-      "dev": true,
-      "requires": {
-        "follow-redirects": "^1.15.6",
-        "form-data": "^4.0.0",
-        "proxy-from-env": "^1.1.0"
-      }
-    },
     "babel-jest": {
       "version": "29.7.0",
       "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz",
@@ -11023,16 +10755,6 @@
       "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
       "dev": true
     },
-    "call-bind-apply-helpers": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
-      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
-      "dev": true,
-      "requires": {
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2"
-      }
-    },
     "callsites": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
@@ -11158,15 +10880,6 @@
       "integrity": "sha512-hUewv7oMjCp+wkBv5Rm0v87eJhq4woh5rSR+42YSQJKecCqgIqNkZ6lAlQms/BwHPJA5NKMRlpxPRv0n8HQW6g==",
       "dev": true
     },
-    "combined-stream": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
-      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-      "dev": true,
-      "requires": {
-        "delayed-stream": "~1.0.0"
-      }
-    },
     "commander": {
       "version": "6.2.1",
       "resolved": "https://registry.npmjs.org/commander/-/commander-6.2.1.tgz",
@@ -11299,29 +11012,12 @@
       "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
       "dev": true
     },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-      "dev": true
-    },
     "detect-newline": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/detect-newline/-/detect-newline-3.1.0.tgz",
       "integrity": "sha512-TLz+x/vEXm/Y7P7wn1EJFNLxYpUD4TgMosxY6fAVJUnJMbupHBOncxyWUG9OpTaH9EBD7uFI5LfEgmMOc54DsA==",
       "dev": true
     },
-    "dunder-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
-      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
-      "dev": true,
-      "requires": {
-        "call-bind-apply-helpers": "^1.0.1",
-        "es-errors": "^1.3.0",
-        "gopd": "^1.2.0"
-      }
-    },
     "electron-to-chromium": {
       "version": "1.5.19",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.19.tgz",
@@ -11365,45 +11061,12 @@
         "is-arrayish": "^0.2.1"
       }
     },
-    "es-define-property": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
-      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
-      "dev": true
-    },
-    "es-errors": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
-      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
-      "dev": true
-    },
     "es-module-lexer": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz",
       "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==",
       "dev": true
     },
-    "es-object-atoms": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
-      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
-      "dev": true,
-      "requires": {
-        "es-errors": "^1.3.0"
-      }
-    },
-    "es-set-tostringtag": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
-      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
-      "dev": true,
-      "requires": {
-        "es-errors": "^1.3.0",
-        "get-intrinsic": "^1.2.6",
-        "has-tostringtag": "^1.0.2",
-        "hasown": "^2.0.2"
-      }
-    },
     "escalade": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
@@ -11712,25 +11375,6 @@
         "path-exists": "^4.0.0"
       }
     },
-    "follow-redirects": {
-      "version": "1.15.6",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
-      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
-      "dev": true
-    },
-    "form-data": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.4.tgz",
-      "integrity": "sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==",
-      "dev": true,
-      "requires": {
-        "asynckit": "^0.4.0",
-        "combined-stream": "^1.0.8",
-        "es-set-tostringtag": "^2.1.0",
-        "hasown": "^2.0.2",
-        "mime-types": "^2.1.12"
-      }
-    },
     "fs-readdir-recursive": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/fs-readdir-recursive/-/fs-readdir-recursive-1.1.0.tgz",
@@ -11768,40 +11412,12 @@
       "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
       "dev": true
     },
-    "get-intrinsic": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
-      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
-      "dev": true,
-      "requires": {
-        "call-bind-apply-helpers": "^1.0.2",
-        "es-define-property": "^1.0.1",
-        "es-errors": "^1.3.0",
-        "es-object-atoms": "^1.1.1",
-        "function-bind": "^1.1.2",
-        "get-proto": "^1.0.1",
-        "gopd": "^1.2.0",
-        "has-symbols": "^1.1.0",
-        "hasown": "^2.0.2",
-        "math-intrinsics": "^1.1.0"
-      }
-    },
     "get-package-type": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz",
       "integrity": "sha512-pjzuKtY64GYfWizNAJ0fr9VqttZkNiK2iS430LtIHzjBEr6bX8Am2zm4sW4Ro5wjWW5cAlRL1qAMTcXbjNAO2Q==",
       "dev": true
     },
-    "get-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
-      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
-      "dev": true,
-      "requires": {
-        "dunder-proto": "^1.0.1",
-        "es-object-atoms": "^1.0.0"
-      }
-    },
     "get-stream": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
@@ -11844,12 +11460,6 @@
       "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
       "dev": true
     },
-    "gopd": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
-      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
-      "dev": true
-    },
     "graceful-fs": {
       "version": "4.2.11",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
@@ -11871,30 +11481,6 @@
       "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
       "dev": true
     },
-    "has-symbols": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
-      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
-      "dev": true
-    },
-    "has-tostringtag": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
-      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
-      "dev": true,
-      "requires": {
-        "has-symbols": "^1.0.3"
-      }
-    },
-    "hasown": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
-      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-      "dev": true,
-      "requires": {
-        "function-bind": "^1.1.2"
-      }
-    },
     "html-escaper": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
@@ -13505,12 +13091,6 @@
         "tmpl": "1.0.5"
       }
     },
-    "math-intrinsics": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
-      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
-      "dev": true
-    },
     "merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -13742,12 +13322,6 @@
         "sisteransi": "^1.0.5"
       }
     },
-    "proxy-from-env": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "dev": true
-    },
     "punycode": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz",

superset-embedded-sdk/package.json

@@ -43,7 +43,6 @@
     "@babel/preset-typescript": "^7.24.7",
     "@types/jest": "^29.5.12",
     "@types/node": "^22.5.4",
-    "axios": "^1.7.7",
     "babel-loader": "^9.1.3",
     "jest": "^29.7.0",
     "tscw-config": "^1.1.2",

superset-embedded-sdk/release-if-necessary.js

@@ -18,7 +18,6 @@
  */
 
 const { execSync } = require('child_process');
-const axios = require('axios');
 const { name, version } = require('./package.json');
 
 function log(...args) {
@@ -36,9 +35,7 @@ function logError(...args) {
   // npm commands output a bunch of garbage in the edge cases,
   // and require sending semi-validated strings to the command line,
   // so let's just use good old http.
-  const { status } = await axios.get(packageUrl, {
-    validateStatus: (status) => true // we literally just want the status so any status is valid
-  });
+  const { status } = await fetch(packageUrl);
 
   if (status === 200) {
     log('version already exists on npm, exiting');

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

@@ -1,766 +0,0 @@
-/**
- * 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.
- */
-// eslint-disable-next-line import/no-extraneous-dependencies
-import { Interception } from 'cypress/types/net-stubbing';
-import { waitForChartLoad } from 'cypress/utils';
-import { SUPPORTED_CHARTS_DASHBOARD } from 'cypress/utils/urls';
-import {
-  openTopLevelTab,
-  SUPPORTED_TIER1_CHARTS,
-  SUPPORTED_TIER2_CHARTS,
-} from './utils';
-import {
-  interceptExploreJson,
-  interceptV1ChartData,
-  interceptFormDataKey,
-} from '../explore/utils';
-
-const interceptDrillInfo = () => {
-  cy.intercept('GET', '**/api/v1/dataset/*/drill_info/*', {
-    statusCode: 200,
-    body: {
-      result: {
-        id: 1,
-        changed_on_humanized: '2 days ago',
-        created_on_humanized: 'a week ago',
-        table_name: 'birth_names',
-        changed_by: {
-          first_name: 'Admin',
-          last_name: 'User',
-        },
-        created_by: {
-          first_name: 'Admin',
-          last_name: 'User',
-        },
-        owners: [
-          {
-            first_name: 'Admin',
-            last_name: 'User',
-          },
-        ],
-        columns: [
-          {
-            column_name: 'gender',
-            verbose_name: null,
-          },
-          {
-            column_name: 'state',
-            verbose_name: null,
-          },
-          {
-            column_name: 'name',
-            verbose_name: null,
-          },
-          {
-            column_name: 'ds',
-            verbose_name: null,
-          },
-        ],
-      },
-    },
-  }).as('drillInfo');
-};
-
-const closeModal = () => {
-  cy.get('body').then($body => {
-    if ($body.find('[data-test="close-drill-by-modal"]').length) {
-      cy.getBySel('close-drill-by-modal').click({ force: true });
-    }
-  });
-};
-
-const openTableContextMenu = (
-  cellContent: string,
-  tableSelector = "[data-test-viz-type='table']",
-) => {
-  cy.get(tableSelector).scrollIntoView();
-  cy.get(tableSelector).contains(cellContent).first().rightclick();
-};
-
-const drillBy = (targetDrillByColumn: string, isLegacy = false) => {
-  if (isLegacy) {
-    interceptExploreJson('legacyData');
-  } else {
-    interceptV1ChartData();
-  }
-
-  cy.get('.ant-dropdown:not(.ant-dropdown-hidden)', { timeout: 15000 })
-    .should('be.visible')
-    .find("[role='menu'] [role='menuitem']")
-    .contains(/^Drill by$/)
-    .trigger('mouseover', { force: true });
-
-  cy.get(
-    '.ant-dropdown-menu-submenu:not(.ant-dropdown-menu-submenu-hidden) [data-test="drill-by-submenu"]',
-    { timeout: 15000 },
-  )
-    .should('be.visible')
-    .find('[role="menuitem"]')
-    .contains(new RegExp(`^${targetDrillByColumn}$`))
-    .click();
-
-  cy.get(
-    '.ant-dropdown-menu-submenu:not(.ant-dropdown-menu-submenu-hidden) [data-test="drill-by-submenu"]',
-  ).trigger('mouseout', { clientX: 0, clientY: 0, force: true });
-
-  cy.get(
-    '.ant-dropdown-menu-submenu:not(.ant-dropdown-menu-submenu-hidden) [data-test="drill-by-submenu"]',
-  ).should('not.exist');
-
-  if (isLegacy) {
-    return cy.wait('@legacyData');
-  }
-  return cy.wait('@v1Data');
-};
-
-const verifyExpectedFormData = (
-  interceptedRequest: Interception,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  expectedFormData: Record<string, any>,
-) => {
-  const actualFormData = interceptedRequest.request.body?.form_data;
-  Object.entries(expectedFormData).forEach(([key, val]) => {
-    expect(actualFormData?.[key]).to.eql(val);
-  });
-};
-
-const testEchart = (
-  vizType: string,
-  chartName: string,
-  drillClickCoordinates: [[number, number], [number, number]],
-  furtherDrillDimension = 'name',
-) => {
-  cy.get(`[data-test-viz-type='${vizType}'] canvas`).then($canvas => {
-    // click 'boy'
-    cy.wrap($canvas).scrollIntoView();
-    cy.wrap($canvas).trigger(
-      'mouseover',
-      drillClickCoordinates[0][0],
-      drillClickCoordinates[0][1],
-    );
-    cy.wrap($canvas).rightclick(
-      drillClickCoordinates[0][0],
-      drillClickCoordinates[0][1],
-    );
-
-    drillBy('state').then(intercepted => {
-      verifyExpectedFormData(intercepted, {
-        groupby: ['state'],
-        adhoc_filters: [
-          {
-            clause: 'WHERE',
-            comparator: 'boy',
-            expressionType: 'SIMPLE',
-            operator: '==',
-            operatorId: 'EQUALS',
-            subject: 'gender',
-          },
-        ],
-      });
-    });
-
-    cy.getBySel(`"Drill by: ${chartName}-modal"`).as('drillByModal');
-
-    cy.get('@drillByModal')
-      .find('.draggable-trigger')
-      .should('contain', chartName);
-
-    cy.get('@drillByModal')
-      .find('.ant-breadcrumb')
-      .should('be.visible')
-      .and('contain', 'gender (boy)')
-      .and('contain', '/')
-      .and('contain', 'state');
-
-    cy.get('@drillByModal')
-      .find('[data-test="drill-by-chart"]')
-      .should('be.visible');
-
-    // further drill
-    cy.get(`[data-test="drill-by-chart"] canvas`).then($canvas => {
-      // click 'other'
-      cy.wrap($canvas).scrollIntoView();
-      cy.wrap($canvas).trigger(
-        'mouseover',
-        drillClickCoordinates[1][0],
-        drillClickCoordinates[1][1],
-      );
-      cy.wrap($canvas).rightclick(
-        drillClickCoordinates[1][0],
-        drillClickCoordinates[1][1],
-      );
-
-      drillBy(furtherDrillDimension).then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupby: [furtherDrillDimension],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-            {
-              clause: 'WHERE',
-              comparator: 'other',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'state',
-            },
-          ],
-        });
-      });
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible');
-
-      // undo - back to drill by state
-      interceptV1ChartData('drillByUndo');
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('contain', 'state (other)')
-        .and('contain', furtherDrillDimension)
-        .contains('state (other)')
-        .click();
-      cy.wait('@drillByUndo').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupby: ['state'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-          ],
-        });
-      });
-
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('not.contain', 'state (other)')
-        .and('not.contain', furtherDrillDimension)
-        .and('contain', 'state');
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible');
-    });
-  });
-};
-
-describe('Drill by modal', () => {
-  beforeEach(() => {
-    closeModal();
-  });
-  before(() => {
-    interceptDrillInfo();
-    cy.visit(SUPPORTED_CHARTS_DASHBOARD);
-  });
-
-  describe('Modal actions + Table', () => {
-    before(() => {
-      closeModal();
-      interceptDrillInfo();
-      openTopLevelTab('Tier 1');
-      SUPPORTED_TIER1_CHARTS.forEach(waitForChartLoad);
-    });
-
-    it.only('opens the modal from the context menu', () => {
-      openTableContextMenu('boy');
-      drillBy('state').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupby: ['state'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-          ],
-        });
-      });
-
-      cy.getBySel('"Drill by: Table-modal"').as('drillByModal');
-
-      cy.get('@drillByModal')
-        .find('.draggable-trigger')
-        .should('contain', 'Drill by: Table');
-
-      cy.get('@drillByModal')
-        .find('[data-test="metadata-bar"]')
-        .should('be.visible');
-
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('contain', 'state');
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible')
-        .and('contain', 'state')
-        .and('contain', 'sum__num');
-
-      // further drilling
-      openTableContextMenu('CA', '[data-test="drill-by-chart"]');
-      drillBy('name').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupby: ['name'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-            {
-              clause: 'WHERE',
-              comparator: 'CA',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'state',
-            },
-          ],
-        });
-      });
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible')
-        .and('not.contain', 'state')
-        .and('contain', 'name')
-        .and('contain', 'sum__num');
-
-      // undo - back to drill by state
-      interceptV1ChartData('drillByUndo');
-      interceptFormDataKey();
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('contain', 'state (CA)')
-        .and('contain', 'name')
-        .contains('state (CA)')
-        .click();
-      cy.wait('@drillByUndo').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupby: ['state'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-          ],
-        });
-      });
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible')
-        .and('not.contain', 'name')
-        .and('contain', 'state')
-        .and('contain', 'sum__num');
-
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('not.contain', 'state (CA)')
-        .and('not.contain', 'name')
-        .and('contain', 'state');
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-display-toggle"]')
-        .contains('Table')
-        .click();
-
-      cy.getBySel('drill-by-chart').should('not.exist');
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-results-table"]')
-        .should('be.visible');
-
-      cy.wait('@formDataKey').then(intercept => {
-        cy.get('@drillByModal')
-          .contains('Edit chart')
-          .should('have.attr', 'href')
-          .and(
-            'contain',
-            `/explore/?form_data_key=${intercept.response?.body?.key}`,
-          );
-      });
-    });
-  });
-
-  describe('Tier 1 charts', () => {
-    before(() => {
-      closeModal();
-      interceptDrillInfo();
-      openTopLevelTab('Tier 1');
-      SUPPORTED_TIER1_CHARTS.forEach(waitForChartLoad);
-    });
-
-    it('Pivot Table', () => {
-      openTableContextMenu('boy', "[data-test-viz-type='pivot_table_v2']");
-      drillBy('name').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupbyRows: ['state'],
-          groupbyColumns: ['name'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-          ],
-        });
-      });
-
-      cy.getBySel('"Drill by: Pivot Table-modal"').as('drillByModal');
-
-      cy.get('@drillByModal')
-        .find('.draggable-trigger')
-        .should('contain', 'Drill by: Pivot Table');
-
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('contain', 'name');
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible')
-        .and('contain', 'state')
-        .and('contain', 'name')
-        .and('contain', 'sum__num')
-        .and('not.contain', 'Gender');
-
-      openTableContextMenu('CA', '[data-test="drill-by-chart"]');
-      drillBy('ds').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupbyColumns: ['name'],
-          groupbyRows: ['ds'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-            {
-              clause: 'WHERE',
-              comparator: 'CA',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'state',
-            },
-          ],
-        });
-      });
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible')
-        .and('contain', 'name')
-        .and('contain', 'ds')
-        .and('contain', 'sum__num')
-        .and('not.contain', 'state');
-
-      interceptV1ChartData('drillByUndo');
-
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('contain', 'name (CA)')
-        .and('contain', 'ds')
-        .contains('name (CA)')
-        .click();
-      cy.wait('@drillByUndo').then(intercepted => {
-        verifyExpectedFormData(intercepted, {
-          groupbyRows: ['state'],
-          groupbyColumns: ['name'],
-          adhoc_filters: [
-            {
-              clause: 'WHERE',
-              comparator: 'boy',
-              expressionType: 'SIMPLE',
-              operator: '==',
-              operatorId: 'EQUALS',
-              subject: 'gender',
-            },
-          ],
-        });
-      });
-
-      cy.get('@drillByModal')
-        .find('[data-test="drill-by-chart"]')
-        .should('be.visible')
-        .and('not.contain', 'ds')
-        .and('contain', 'state')
-        .and('contain', 'name')
-        .and('contain', 'sum__num');
-
-      cy.get('@drillByModal')
-        .find('.ant-breadcrumb')
-        .should('be.visible')
-        .and('contain', 'gender (boy)')
-        .and('contain', '/')
-        .and('not.contain', 'name (CA)')
-        .and('not.contain', 'ds')
-        .and('contain', 'name');
-    });
-
-    it('Line chart', () => {
-      testEchart('echarts_timeseries_line', 'Line Chart', [
-        [85, 93],
-        [85, 93],
-      ]);
-    });
-
-    it('Area Chart', () => {
-      testEchart('echarts_area', 'Area Chart', [
-        [85, 93],
-        [85, 93],
-      ]);
-    });
-
-    it('Scatter Chart', () => {
-      testEchart('echarts_timeseries_scatter', 'Scatter Chart', [
-        [85, 93],
-        [85, 93],
-      ]);
-    });
-
-    it.skip('Bar Chart', () => {
-      testEchart('echarts_timeseries_bar', 'Bar Chart', [
-        [85, 94],
-        [490, 68],
-      ]);
-    });
-
-    it('Pie Chart', () => {
-      testEchart('pie', 'Pie Chart', [
-        [243, 167],
-        [534, 248],
-      ]);
-    });
-  });
-
-  describe('Tier 2 charts', () => {
-    before(() => {
-      closeModal();
-      interceptDrillInfo();
-      openTopLevelTab('Tier 2');
-      SUPPORTED_TIER2_CHARTS.forEach(waitForChartLoad);
-    });
-
-    it('Box Plot Chart', () => {
-      testEchart(
-        'box_plot',
-        'Box Plot Chart',
-        [
-          [139, 277],
-          [787, 441],
-        ],
-        'ds',
-      );
-    });
-
-    it('Generic Chart', () => {
-      testEchart('echarts_timeseries', 'Generic Chart', [
-        [85, 93],
-        [85, 93],
-      ]);
-    });
-
-    it('Smooth Line Chart', () => {
-      testEchart('echarts_timeseries_smooth', 'Smooth Line Chart', [
-        [85, 93],
-        [85, 93],
-      ]);
-    });
-
-    it('Step Line Chart', () => {
-      testEchart('echarts_timeseries_step', 'Step Line Chart', [
-        [85, 93],
-        [85, 93],
-      ]);
-    });
-
-    it('Funnel Chart', () => {
-      testEchart('funnel', 'Funnel Chart', [
-        [154, 80],
-        [421, 39],
-      ]);
-    });
-
-    it('Gauge Chart', () => {
-      testEchart('gauge_chart', 'Gauge Chart', [
-        [151, 95],
-        [300, 143],
-      ]);
-    });
-
-    it.skip('Radar Chart', () => {
-      testEchart('radar', 'Radar Chart', [
-        [182, 49],
-        [423, 91],
-      ]);
-    });
-
-    it('Treemap V2 Chart', () => {
-      testEchart('treemap_v2', 'Treemap V2 Chart', [
-        [145, 84],
-        [220, 105],
-      ]);
-    });
-
-    it.skip('Mixed Chart', () => {
-      cy.get('[data-test-viz-type="mixed_timeseries"] canvas').then($canvas => {
-        // click 'boy'
-        cy.wrap($canvas).scrollIntoView();
-        cy.wrap($canvas).trigger('mouseover', 85, 93);
-        cy.wrap($canvas).rightclick(85, 93);
-
-        drillBy('name').then(intercepted => {
-          const { queries } = intercepted.request.body;
-          expect(queries[0].columns).to.eql(['name']);
-          expect(queries[0].filters).to.eql([
-            { col: 'gender', op: '==', val: 'boy' },
-          ]);
-          expect(queries[1].columns).to.eql(['state']);
-          expect(queries[1].filters).to.eql([]);
-        });
-
-        cy.getBySel('"Drill by: Mixed Chart-modal"').as('drillByModal');
-
-        cy.get('@drillByModal')
-          .find('.draggable-trigger')
-          .should('contain', 'Mixed Chart');
-
-        cy.get('@drillByModal')
-          .find('.ant-breadcrumb')
-          .should('be.visible')
-          .and('contain', 'gender (boy)')
-          .and('contain', '/')
-          .and('contain', 'name');
-
-        cy.get('@drillByModal')
-          .find('[data-test="drill-by-chart"]')
-          .should('be.visible');
-
-        // further drill
-        cy.get(`[data-test="drill-by-chart"] canvas`).then($canvas => {
-          // click second query
-          cy.wrap($canvas).scrollIntoView();
-          cy.wrap($canvas).trigger('mouseover', 261, 114);
-          cy.wrap($canvas).rightclick(261, 114);
-
-          drillBy('ds').then(intercepted => {
-            const { queries } = intercepted.request.body;
-            expect(queries[0].columns).to.eql(['name']);
-            expect(queries[0].filters).to.eql([
-              { col: 'gender', op: '==', val: 'boy' },
-            ]);
-            expect(queries[1].columns).to.eql(['ds']);
-            expect(queries[1].filters).to.eql([
-              { col: 'state', op: '==', val: 'other' },
-            ]);
-          });
-
-          cy.get('@drillByModal')
-            .find('[data-test="drill-by-chart"]')
-            .should('be.visible');
-
-          // undo - back to drill by state
-          interceptV1ChartData('drillByUndo');
-          cy.get('@drillByModal')
-            .find('.ant-breadcrumb')
-            .should('be.visible')
-            .and('contain', 'gender (boy)')
-            .and('contain', '/')
-            .and('contain', 'name (other)')
-            .and('contain', 'ds')
-            .contains('name (other)')
-            .click();
-
-          cy.wait('@drillByUndo').then(intercepted => {
-            const { queries } = intercepted.request.body;
-            expect(queries[0].columns).to.eql(['name']);
-            expect(queries[0].filters).to.eql([
-              { col: 'gender', op: '==', val: 'boy' },
-            ]);
-            expect(queries[1].columns).to.eql(['state']);
-            expect(queries[1].filters).to.eql([]);
-          });
-
-          cy.get('@drillByModal')
-            .find('.ant-breadcrumb')
-            .should('be.visible')
-            .and('contain', 'gender (boy)')
-            .and('contain', '/')
-            .and('not.contain', 'name (other)')
-            .and('not.contain', 'ds')
-            .and('contain', 'name');
-
-          cy.get('@drillByModal')
-            .find('[data-test="drill-by-chart"]')
-            .should('be.visible');
-        });
-      });
-    });
-  });
-});

superset-frontend/package-lock.json

@@ -21,7 +21,7 @@
         "@reduxjs/toolkit": "^1.9.3",
         "@rjsf/core": "^5.24.13",
         "@rjsf/utils": "^5.24.3",
-        "@rjsf/validator-ajv8": "^5.24.12",
+        "@rjsf/validator-ajv8": "^5.24.13",
         "@scarf/scarf": "^1.4.0",
         "@superset-ui/chart-controls": "file:./packages/superset-ui-chart-controls",
         "@superset-ui/core": "file:./packages/superset-ui-core",
@@ -57,6 +57,7 @@
         "antd": "^5.24.6",
         "chrono-node": "^2.7.8",
         "classnames": "^2.2.5",
+        "content-disposition": "^0.5.4",
         "d3-color": "^3.1.0",
         "d3-scale": "^2.1.2",
         "dayjs": "^1.11.13",
@@ -174,6 +175,7 @@
         "@testing-library/react": "^12.1.5",
         "@testing-library/react-hooks": "^8.0.1",
         "@testing-library/user-event": "^12.8.3",
+        "@types/content-disposition": "^0.5.9",
         "@types/dom-to-image": "^2.6.7",
         "@types/jest": "^29.5.14",
         "@types/js-levenshtein": "^1.1.3",
@@ -189,7 +191,6 @@
         "@types/react-resizable": "^3.0.8",
         "@types/react-router-dom": "^5.3.3",
         "@types/react-transition-group": "^4.4.12",
-        "@types/react-ultimate-pagination": "^1.2.4",
         "@types/react-virtualized-auto-sizer": "^1.0.8",
         "@types/react-window": "^1.8.8",
         "@types/redux-localstorage": "^1.0.8",
@@ -10884,9 +10885,9 @@
       }
     },
     "node_modules/@rjsf/validator-ajv8": {
-      "version": "5.24.12",
-      "resolved": "https://registry.npmjs.org/@rjsf/validator-ajv8/-/validator-ajv8-5.24.12.tgz",
-      "integrity": "sha512-IMXdCjvDNdvb+mDgZC3AlAtr0pjYKq5s0GcLECjG5PuiX7Ib4JaDQHZY5ZJdKblMfgzhsn8AAOi573jXAt7BHQ==",
+      "version": "5.24.13",
+      "resolved": "https://registry.npmjs.org/@rjsf/validator-ajv8/-/validator-ajv8-5.24.13.tgz",
+      "integrity": "sha512-oWHP7YK581M8I5cF1t+UXFavnv+bhcqjtL1a7MG/Kaffi0EwhgcYjODrD8SsnrhncsEYMqSECr4ZOEoirnEUWw==",
       "license": "Apache-2.0",
       "dependencies": {
         "ajv": "^8.12.0",
@@ -15250,6 +15251,13 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/content-disposition": {
+      "version": "0.5.9",
+      "resolved": "https://registry.npmjs.org/@types/content-disposition/-/content-disposition-0.5.9.tgz",
+      "integrity": "sha512-8uYXI3Gw35MhiVYhG3s295oihrxRyytcRHjSjqnqZVDDy/xcGBRny7+Xj1Wgfhv5QzRtN2hB2dVRBUX9XW3UcQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/conventional-commits-parser": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/@types/conventional-commits-parser/-/conventional-commits-parser-5.0.1.tgz",
@@ -16069,16 +16077,6 @@
         "@types/react": "*"
       }
     },
-    "node_modules/@types/react-ultimate-pagination": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@types/react-ultimate-pagination/-/react-ultimate-pagination-1.2.4.tgz",
-      "integrity": "sha512-1y9jLt3KEFGzFD+99qVpJUI/Eu4cEx48sClB957eGoepWRLVVi+r1UBj0157Mg7HYZcIF4I1/qGZYaBBQWhaqg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/react": "*"
-      }
-    },
     "node_modules/@types/react-virtualized-auto-sizer": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/@types/react-virtualized-auto-sizer/-/react-virtualized-auto-sizer-1.0.8.tgz",
@@ -21928,7 +21926,6 @@
       "version": "0.5.4",
       "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
       "integrity": "sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "safe-buffer": "5.2.1"
@@ -60634,7 +60631,7 @@
     },
     "packages/superset-core": {
       "name": "@apache-superset/core",
-      "version": "0.0.1-rc2",
+      "version": "0.0.1-rc3",
       "license": "ISC",
       "devDependencies": {
         "@babel/cli": "^7.26.4",
@@ -60644,7 +60641,8 @@
         "@babel/preset-typescript": "^7.26.0",
         "@types/react": "^17.0.83",
         "install": "^0.13.0",
-        "npm": "^11.1.0"
+        "npm": "^11.1.0",
+        "typescript": "^5.0.0"
       },
       "peerDependencies": {
         "antd": "^5.24.6",

superset-frontend/package.json

@@ -89,7 +89,7 @@
     "@reduxjs/toolkit": "^1.9.3",
     "@rjsf/core": "^5.24.13",
     "@rjsf/utils": "^5.24.3",
-    "@rjsf/validator-ajv8": "^5.24.12",
+    "@rjsf/validator-ajv8": "^5.24.13",
     "@scarf/scarf": "^1.4.0",
     "@superset-ui/chart-controls": "file:./packages/superset-ui-chart-controls",
     "@superset-ui/core": "file:./packages/superset-ui-core",
@@ -125,6 +125,7 @@
     "antd": "^5.24.6",
     "chrono-node": "^2.7.8",
     "classnames": "^2.2.5",
+    "content-disposition": "^0.5.4",
     "d3-color": "^3.1.0",
     "d3-scale": "^2.1.2",
     "dayjs": "^1.11.13",
@@ -242,6 +243,7 @@
     "@testing-library/react": "^12.1.5",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^12.8.3",
+    "@types/content-disposition": "^0.5.9",
     "@types/dom-to-image": "^2.6.7",
     "@types/jest": "^29.5.14",
     "@types/js-levenshtein": "^1.1.3",
@@ -257,7 +259,6 @@
     "@types/react-resizable": "^3.0.8",
     "@types/react-router-dom": "^5.3.3",
     "@types/react-transition-group": "^4.4.12",
-    "@types/react-ultimate-pagination": "^1.2.4",
     "@types/react-virtualized-auto-sizer": "^1.0.8",
     "@types/react-window": "^1.8.8",
     "@types/redux-localstorage": "^1.0.8",

superset-frontend/packages/superset-core/package.json

@@ -1,12 +1,11 @@
 {
   "name": "@apache-superset/core",
-  "version": "0.0.1-rc2",
+  "version": "0.0.1-rc3",
   "description": "This package contains UI elements, APIs, and utility functions used by Superset.",
   "sideEffects": false,
   "main": "lib/index.js",
-  "module": "esm/index.js",
+  "types": "lib/index.d.ts",
   "files": [
-    "esm",
     "lib"
   ],
   "author": "",
@@ -19,14 +18,15 @@
     "@babel/preset-typescript": "^7.26.0",
     "@types/react": "^17.0.83",
     "install": "^0.13.0",
-    "npm": "^11.1.0"
+    "npm": "^11.1.0",
+    "typescript": "^5.0.0"
   },
   "peerDependencies": {
     "antd": "^5.24.6",
     "react": "^17.0.2"
   },
   "scripts": {
-    "build": "babel src --out-dir lib --extensions \".ts,.tsx\"",
+    "build": "babel src --out-dir lib --extensions \".ts,.tsx\" && tsc --emitDeclarationOnly",
     "type": "tsc --noEmit"
   },
   "publishConfig": {

superset-frontend/packages/superset-core/src/api/core.ts

@@ -31,12 +31,32 @@ import { Contributions } from './contributions';
 /**
  * Represents a database column with its name and data type.
  */
-export declare interface Column {
-  /** The name of the column */
+export type Column = {
+  /**
+   * Label of the column
+   */
   name: string;
-  /** The data type of the column (e.g., 'INTEGER', 'VARCHAR', 'TIMESTAMP') */
+
+  /**
+   * Column name defined
+   */
+  column_name: string;
+
+  /**
+   * The data type of the column (e.g., 'INTEGER', 'VARCHAR', 'TIMESTAMP')
+   */
   type: string;
-}
+
+  /**
+   * Generic data type format
+   */
+  type_generic: GenericDataType;
+
+  /**
+   * True if the column is date format
+   */
+  is_dttm: boolean;
+};
 
 /**
  * Represents a database table with its name and column definitions.
@@ -76,6 +96,45 @@ export declare interface Database {
   schemas: Schema[];
 }
 
+// Keep in sync with superset/errors.py
+export type ErrorLevel = 'info' | 'warning' | 'error';
+
+/**
+ * Superset error object structure.
+ * Contains details about an error that occurred within Superset.
+ */
+export type SupersetError = {
+  /**
+   * Error types, see enum of SupersetErrorType in superset/errors.py
+   */
+  error_type: string;
+
+  /**
+   * Extra properties based on the error types
+   */
+  extra: Record<string, any>;
+
+  /**
+   * Level of the error type
+   */
+  level: ErrorLevel;
+
+  /**
+   * Detail description for the error
+   */
+  message: string;
+};
+
+/**
+ * Generic data types, see enum of the same name in superset/utils/core.py.
+ */
+export enum GenericDataType {
+  Numeric = 0,
+  String = 1,
+  Temporal = 2,
+  Boolean = 3,
+}
+
 /**
  * Represents a type which can release resources, such
  * as event listening or a timer.

superset-frontend/packages/superset-core/src/api/sqlLab.ts

@@ -29,7 +29,7 @@
  * - Global APIs: Functions and events available across the entire SQL Lab interface
  */
 
-import { Event, Database } from './core';
+import { Event, Database, SupersetError, Column } from './core';
 
 /**
  * Represents an SQL editor instance within a SQL Lab tab.
@@ -111,6 +111,126 @@ export interface Tab {
   panels: Panel[];
 }
 
+export enum CTASMethod {
+  Table = 'TABLE',
+  View = 'VIEW',
+}
+
+export interface CTAS {
+  /**
+   * Create method for CTAS creation request.
+   */
+  method: CTASMethod;
+
+  /**
+   * Temporary table name for creation using a CTAS query.
+   */
+  tempTable: string | null;
+}
+
+export interface QueryContext {
+  /**
+   * Unique query ID on client side.
+   */
+  clientId: string;
+
+  /**
+   * Contains CTAS if the query requests table creation.
+   */
+  ctas: CTAS | null;
+
+  /**
+   * Requested row limit for the query.
+   */
+  requestedLimit: number | null;
+
+  /**
+   * True if the query execution result will be/was delivered asynchronously
+   */
+  runAsync?: boolean;
+
+  /**
+   * Start datetime for the query in a numerical timestamp
+   */
+  startDttm: number;
+
+  /**
+   * The tab instance associated with the request query
+   */
+  tab: Tab;
+
+  /**
+   * A key-value JSON associated with Jinja template variables
+   */
+  templateParameters: Record<string, any>;
+}
+
+export interface QueryErrorResultContext extends QueryContext {
+  /**
+   * Finished datetime for the query in a numerical timestamp
+   */
+  endDttm: number;
+
+  /**
+   * Error message returned from DB engine
+   */
+  errorMessage: string;
+
+  /**
+   * Error details in a SupersetError structure
+   */
+  errors: SupersetError[] | null;
+
+  /**
+   * Executed SQL after parsing Jinja templates.
+   */
+  executedSql: string | null;
+}
+
+export interface QueryResultContext extends QueryContext {
+  /**
+   * Actual number of rows returned by the query.
+   */
+  appliedLimit: number;
+
+  /**
+   * Major factor that is determining the row limit of the query results.
+   */
+  appliedLimitingFactor: string;
+
+  /**
+   * Finished datetime for the query in a numerical timestamp.
+   */
+  endDttm: number;
+
+  /**
+   * Executed SQL after parsing Jinja templates.
+   */
+  executedSql: string;
+
+  /**
+   * Remote query id stored in backend.
+   */
+  remoteId: number;
+
+  /**
+   * Query result data and metadata.
+   */
+  result: QueryResult;
+}
+
+export interface QueryResult {
+  /**
+   * Column metadata associated with the query result.
+   */
+  columns: Column[];
+
+  /**
+   * Query result data.
+   */
+  data: Record<string, any>[];
+}
+
 /**
  * Tab-scoped Events and Functions
  *
@@ -240,30 +360,30 @@ export declare const onDidChangeTabTitle: Event<string>;
 
 /**
  * Event fired when a query starts running in the current tab.
- * Provides the editor state at the time of query execution.
+ * Provides the query request state at the time of query execution.
  *
  * @example
  * ```typescript
- * onDidQueryRun.event((editor) => {
- *   console.log('Query started on database:', editor.databaseId);
- *   console.log('Query content:', editor.content);
+ * onDidQueryRun.event((query) => {
+ *   console.log('Query started on database:', query.tab.editor.databaseId);
+ *   console.log('Query content:', query.tab.editor.content);
  * });
  * ```
  */
-export declare const onDidQueryRun: Event<Editor>;
+export declare const onDidQueryRun: Event<QueryContext>;
 
 /**
  * Event fired when a running query is stopped in the current tab.
- * Provides the editor state when the query was stopped.
+ * Provides the query request state when the query was stopped.
  *
  * @example
  * ```typescript
- * onDidQueryStop.event((editor) => {
- *   console.log('Query stopped for database:', editor.databaseId);
+ * onDidQueryStop.event((query) => {
+ *   console.log('Query stopped for database:', query.tab.editor.databaseId);
  * });
  * ```
  */
-export declare const onDidQueryStop: Event<Editor>;
+export declare const onDidQueryStop: Event<QueryContext>;
 
 /**
  * Event fired when a query fails in the current tab.
@@ -273,12 +393,12 @@ export declare const onDidQueryStop: Event<Editor>;
  *
  * @example
  * ```typescript
- * onDidQueryFail.event((error) => {
- *   console.error('Query failed:', error);
+ * onDidQueryFail.event((result) => {
+ *   console.error('Query failed:', result.errorMessage);
  * });
  * ```
  */
-export declare const onDidQueryFail: Event<string>;
+export declare const onDidQueryFail: Event<QueryErrorResultContext>;
 
 /**
  * Event fired when a query succeeds in the current tab.
@@ -288,12 +408,13 @@ export declare const onDidQueryFail: Event<string>;
  *
  * @example
  * ```typescript
- * onDidQuerySuccess.event((result) => {
- *   console.log('Query succeeded:', result);
+ * onDidQuerySuccess.event((query) => {
+ *   console.log('Query succeeded:', query.result.data);
+ *   console.log('Query executed content:', query.executedSql);
  * });
  * ```
  */
-export declare const onDidQuerySuccess: Event<string>;
+export declare const onDidQuerySuccess: Event<QueryResultContext>;
 
 /**
  * Global Events and Functions

superset-frontend/packages/superset-core/tsconfig.json

@@ -10,7 +10,9 @@
     "baseUrl": ".",
     "module": "esnext",
     "moduleResolution": "node",
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "target": "es2020",
+    "esModuleInterop": true
   },
   "include": ["src/**/*.ts*"],
   "exclude": ["lib"]

superset-frontend/packages/superset-ui-chart-controls/src/operators/renameOperator.ts

@@ -43,15 +43,17 @@ export const renameOperator: PostProcessingFactory<PostProcessingRename> = (
 
   // remove or rename top level of column name(metric name) in the MultiIndex when
   // 1) at least 1 metric
-  // 2) dimension exist or multiple time shift metrics exist
-  // 3) xAxis exist
-  // 4) truncate_metric in form_data and truncate_metric is true
+  // 2) xAxis exist
+  // 3a) isTimeComparisonValue
+  // 3b-1) dimension exist or multiple time shift metrics exist
+  // 3b-2) truncate_metric in form_data and truncate_metric is true
   if (
     metrics.length > 0 &&
-    (columns.length > 0 || timeOffsets.length > 1) &&
     xAxisLabel &&
-    truncate_metric !== undefined &&
-    !!truncate_metric
+    (isTimeComparisonValue ||
+      ((columns.length > 0 || timeOffsets.length > 1) &&
+        truncate_metric !== undefined &&
+        !!truncate_metric))
   ) {
     const renamePairs: [string, string | null][] = [];
     if (

superset-frontend/packages/superset-ui-chart-controls/test/operators/renameOperator.test.ts

@@ -160,6 +160,44 @@ test('should add renameOperator if exists derived metrics', () => {
   });
 });
 
+test('should add renameOperator if isTimeComparisonValue without columns', () => {
+  [
+    ComparisonType.Difference,
+    ComparisonType.Ratio,
+    ComparisonType.Percentage,
+  ].forEach(type => {
+    expect(
+      renameOperator(
+        {
+          ...formData,
+          ...{
+            comparison_type: type,
+            time_compare: ['1 year ago'],
+          },
+        },
+        {
+          ...queryObject,
+          ...{
+            columns: [],
+            metrics: ['sum(val)', 'avg(val2)'],
+          },
+        },
+      ),
+    ).toEqual({
+      operation: 'rename',
+      options: {
+        columns: {
+          [`${type}__avg(val2)__avg(val2)__1 year ago`]:
+            'avg(val2), 1 year ago',
+          [`${type}__sum(val)__sum(val)__1 year ago`]: 'sum(val), 1 year ago',
+        },
+        inplace: true,
+        level: 0,
+      },
+    });
+  });
+});
+
 test('should add renameOperator if x_axis does not exist', () => {
   expect(
     renameOperator(

superset-frontend/packages/superset-ui-core/src/components/AsyncAceEditor/index.tsx

@@ -393,10 +393,7 @@ export const FullSQLEditor = AsyncAceEditor(
   },
 );
 
-export const MarkdownEditor = AsyncAceEditor([
-  'mode/markdown',
-  'theme/textmate',
-]);
+export const MarkdownEditor = AsyncAceEditor(['mode/markdown', 'theme/github']);
 
 export const TextAreaEditor = AsyncAceEditor([
   'mode/markdown',

superset-frontend/packages/superset-ui-core/src/components/EmptyState/index.tsx

@@ -60,7 +60,7 @@ const EmptyStateContainer = styled.div`
     flex-direction: column;
     width: 100%;
     height: 100%;
-    color: ${theme.colorTextQuaternary};
+    color: ${theme.colorTextTertiary};
     align-items: center;
     justify-content: center;
     padding: ${theme.sizeUnit * 4}px;
@@ -84,7 +84,7 @@ const EmptyStateContainer = styled.div`
 const Title = styled.p<{ size: EmptyStateSize }>`
   ${({ theme, size }) => css`
     font-size: ${size === 'large' ? theme.fontSizeLG : theme.fontSize}px;
-    color: ${theme.colorTextQuaternary};
+    color: ${theme.colorTextTertiary};
     margin-top: ${size === 'large' ? theme.sizeUnit * 4 : theme.sizeUnit * 2}px;
     font-weight: ${theme.fontWeightStrong};
   `}
@@ -93,7 +93,7 @@ const Title = styled.p<{ size: EmptyStateSize }>`
 const Description = styled.p<{ size: EmptyStateSize }>`
   ${({ theme, size }) => css`
     font-size: ${size === 'large' ? theme.fontSize : theme.fontSizeSM}px;
-    color: ${theme.colorTextQuaternary};
+    color: ${theme.colorTextTertiary};
     margin-top: ${theme.sizeUnit * 2}px;
   `}
 `;

superset-frontend/packages/superset-ui-core/src/components/Modal/Modal.tsx

@@ -368,9 +368,13 @@ const CustomModal = ({
 };
 CustomModal.displayName = 'Modal';
 
+// Theme-aware confirmation modal - now inherits theme through App wrapper in SupersetThemeProvider
+const themedConfirm = (props: Parameters<typeof AntdModal.confirm>[0]) =>
+  AntdModal.confirm(props);
+
 export const Modal = Object.assign(CustomModal, {
   error: AntdModal.error,
   warning: AntdModal.warning,
-  confirm: AntdModal.confirm,
+  confirm: themedConfirm,
   useModal: AntdModal.useModal,
 });

superset-frontend/packages/superset-ui-core/src/components/Pagination/Ellipsis.test.tsx

@@ -1,37 +0,0 @@
-/**
- * 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 { render, screen, userEvent } from '@superset-ui/core/spec';
-import { Ellipsis } from './Ellipsis';
-
-test('Ellipsis - click when the button is enabled', async () => {
-  const click = jest.fn();
-  render(<Ellipsis onClick={click} />);
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(1);
-});
-
-test('Ellipsis - click when the button is disabled', async () => {
-  const click = jest.fn();
-  render(<Ellipsis onClick={click} disabled />);
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(0);
-});

superset-frontend/packages/superset-ui-core/src/components/Pagination/Ellipsis.tsx

@@ -1,38 +0,0 @@
-/**
- * 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 classNames from 'classnames';
-import { PaginationButtonProps } from './types';
-
-export function Ellipsis({ disabled, onClick }: PaginationButtonProps) {
-  return (
-    <li className={classNames({ disabled })}>
-      <span
-        role="button"
-        tabIndex={disabled ? -1 : 0}
-        onClick={e => {
-          e.preventDefault();
-          if (!disabled) onClick(e);
-        }}
-      >
-        …
-      </span>
-    </li>
-  );
-}

superset-frontend/packages/superset-ui-core/src/components/Pagination/Item.test.tsx

@@ -1,47 +0,0 @@
-/**
- * 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 { render, screen, userEvent } from '@superset-ui/core/spec';
-import { Item } from './Item';
-
-test('Item - click when the item is not active', async () => {
-  const click = jest.fn();
-  render(
-    <Item onClick={click}>
-      <div data-test="test" />
-    </Item>,
-  );
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(1);
-  expect(screen.getByTestId('test')).toBeInTheDocument();
-});
-
-test('Item - click when the item is active', async () => {
-  const click = jest.fn();
-  render(
-    <Item onClick={click} active>
-      <div data-test="test" />
-    </Item>,
-  );
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(0);
-  expect(screen.getByTestId('test')).toBeInTheDocument();
-});

superset-frontend/packages/superset-ui-core/src/components/Pagination/Item.tsx

@@ -1,45 +0,0 @@
-/**
- * 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 { ReactNode } from 'react';
-import classNames from 'classnames';
-import { PaginationButtonProps } from './types';
-
-interface PaginationItemButton extends PaginationButtonProps {
-  active?: boolean;
-  children: ReactNode;
-}
-
-export function Item({ active, children, onClick }: PaginationItemButton) {
-  return (
-    <li className={classNames({ active })}>
-      <span
-        role="button"
-        tabIndex={0}
-        aria-current={active ? 'page' : undefined}
-        onClick={e => {
-          e.preventDefault();
-          if (!active) onClick(e);
-        }}
-      >
-        {children}
-      </span>
-    </li>
-  );
-}

superset-frontend/packages/superset-ui-core/src/components/Pagination/Next.test.tsx

@@ -1,37 +0,0 @@
-/**
- * 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 { render, screen, userEvent } from '@superset-ui/core/spec';
-import { Next } from './Next';
-
-test('Next - click when the button is enabled', async () => {
-  const click = jest.fn();
-  render(<Next onClick={click} />);
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(1);
-});
-
-test('Next - click when the button is disabled', async () => {
-  const click = jest.fn();
-  render(<Next onClick={click} disabled />);
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(0);
-});

superset-frontend/packages/superset-ui-core/src/components/Pagination/Prev.test.tsx

@@ -1,37 +0,0 @@
-/**
- * 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 { render, screen, userEvent } from '@superset-ui/core/spec';
-import { Prev } from './Prev';
-
-test('Prev - click when the button is enabled', async () => {
-  const click = jest.fn();
-  render(<Prev onClick={click} />);
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(1);
-});
-
-test('Prev - click when the button is disabled', async () => {
-  const click = jest.fn();
-  render(<Prev onClick={click} disabled />);
-  expect(click).toHaveBeenCalledTimes(0);
-  await userEvent.click(screen.getByRole('button'));
-  expect(click).toHaveBeenCalledTimes(0);
-});

superset-frontend/packages/superset-ui-core/src/components/Pagination/Wrapper.test.tsx

@@ -1,75 +0,0 @@
-/**
- * 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 { render, screen, cleanup } from '@superset-ui/core/spec';
-import Wrapper from './Wrapper';
-
-// Add cleanup after each test
-afterEach(async () => {
-  cleanup();
-  // Wait for any pending effects to complete
-  await new Promise(resolve => setTimeout(resolve, 0));
-});
-
-jest.mock('./Next', () => ({
-  Next: () => <div data-test="next" />,
-}));
-jest.mock('./Prev', () => ({
-  Prev: () => <div data-test="prev" />,
-}));
-jest.mock('./Item', () => ({
-  Item: () => <div data-test="item" />,
-}));
-jest.mock('./Ellipsis', () => ({
-  Ellipsis: () => <div data-test="ellipsis" />,
-}));
-
-test('Pagination rendering correctly', async () => {
-  render(
-    <Wrapper>
-      <li data-test="test" />
-    </Wrapper>,
-  );
-  expect(screen.getByRole('navigation')).toBeInTheDocument();
-  expect(screen.getByTestId('test')).toBeInTheDocument();
-});
-
-test('Next attribute', async () => {
-  render(<Wrapper.Next onClick={jest.fn()} />);
-  expect(screen.getByTestId('next')).toBeInTheDocument();
-});
-
-test('Prev attribute', async () => {
-  render(<Wrapper.Next onClick={jest.fn()} />);
-  expect(screen.getByTestId('next')).toBeInTheDocument();
-});
-
-test('Item attribute', async () => {
-  render(
-    <Wrapper.Item onClick={jest.fn()}>
-      <></>
-    </Wrapper.Item>,
-  );
-  expect(screen.getByTestId('item')).toBeInTheDocument();
-});
-
-test('Ellipsis attribute', async () => {
-  render(<Wrapper.Ellipsis onClick={jest.fn()} />);
-  expect(screen.getByTestId('ellipsis')).toBeInTheDocument();
-});

superset-frontend/packages/superset-ui-core/src/components/Pagination/Wrapper.tsx

@@ -1,90 +0,0 @@
-/**
- * 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 { styled } from '@superset-ui/core';
-import { Next } from './Next';
-import { Prev } from './Prev';
-import { Item } from './Item';
-import { Ellipsis } from './Ellipsis';
-
-interface PaginationProps {
-  children: JSX.Element | JSX.Element[];
-}
-
-const PaginationList = styled.ul`
-  ${({ theme }) => `
-  display: inline-block;
-  padding: ${theme.sizeUnit * 3}px;
-
-  li {
-    display: inline;
-    margin: 0 4px;
-
-    > span {
-      padding: 8px 12px;
-      text-decoration: none;
-      background-color: ${theme.colorBgContainer};
-      border: 1px solid ${theme.colorBorder};
-      border-radius: ${theme.borderRadius}px;
-      color: ${theme.colorText};
-
-      &:hover,
-      &:focus {
-        z-index: 2;
-        color: ${theme.colorText};
-        background-color: ${theme.colorBgLayout};
-      }
-    }
-
-    &.disabled {
-      span {
-        background-color: transparent;
-        cursor: default;
-
-        &:focus {
-          outline: none;
-        }
-      }
-    }
-    &.active {
-      span {
-        z-index: 3;
-        color: ${theme.colorBgLayout};
-        cursor: default;
-        background-color: ${theme.colorPrimary};
-
-        &:focus {
-          outline: none;
-        }
-      }
-    }
-  }
-`}
-`;
-
-function Pagination({ children }: PaginationProps) {
-  return <PaginationList role="navigation">{children}</PaginationList>;
-}
-
-Pagination.Next = Next;
-Pagination.Prev = Prev;
-Pagination.Item = Item;
-Pagination.Ellipsis = Ellipsis;
-
-export default Pagination;

superset-frontend/packages/superset-ui-core/src/components/Pagination/index.tsx

@@ -1,47 +0,0 @@
-/**
- * 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 Pagination from '@superset-ui/core/components/Pagination/Wrapper';
-import {
-  createUltimatePagination,
-  ITEM_TYPES,
-} from 'react-ultimate-pagination';
-
-const ListViewPagination = createUltimatePagination({
-  WrapperComponent: Pagination,
-  itemTypeToComponent: {
-    [ITEM_TYPES.PAGE]: ({ value, isActive, onClick }) => (
-      <Pagination.Item active={isActive} onClick={onClick}>
-        {value}
-      </Pagination.Item>
-    ),
-    [ITEM_TYPES.ELLIPSIS]: ({ isActive, onClick }) => (
-      <Pagination.Ellipsis disabled={isActive} onClick={onClick} />
-    ),
-    [ITEM_TYPES.PREVIOUS_PAGE_LINK]: ({ isActive, onClick }) => (
-      <Pagination.Prev disabled={isActive} onClick={onClick} />
-    ),
-    [ITEM_TYPES.NEXT_PAGE_LINK]: ({ isActive, onClick }) => (
-      <Pagination.Next disabled={isActive} onClick={onClick} />
-    ),
-    [ITEM_TYPES.FIRST_PAGE_LINK]: () => null,
-    [ITEM_TYPES.LAST_PAGE_LINK]: () => null,
-  },
-});
-
-export default ListViewPagination;

superset-frontend/packages/superset-ui-core/src/components/TableCollection/TableCollection.test.tsx

@@ -100,3 +100,109 @@ test('Should the loading-indicator be visible during loading', () => {
 
   expect(screen.getByTestId('loading-indicator')).toBeVisible();
 });
+
+test('Pagination controls should be rendered when pageSize is provided', () => {
+  const paginationProps = {
+    ...defaultProps,
+    pageSize: 2,
+    totalCount: 3,
+    pageIndex: 0,
+    onPageChange: jest.fn(),
+  };
+  render(<TableCollection {...paginationProps} />);
+
+  expect(screen.getByRole('list')).toBeInTheDocument();
+});
+
+test('Pagination should call onPageChange when page is changed', async () => {
+  const onPageChange = jest.fn();
+  const paginationProps = {
+    ...defaultProps,
+    pageSize: 2,
+    totalCount: 3,
+    pageIndex: 0,
+    onPageChange,
+  };
+  const { rerender } = render(<TableCollection {...paginationProps} />);
+
+  // Simulate pagination change
+  await screen.findByTitle('Next Page');
+
+  // Verify onPageChange would be called with correct arguments
+  // The actual AntD pagination will handle the click internally
+  expect(onPageChange).toBeDefined();
+
+  // Verify that re-rendering with new pageIndex works
+  rerender(<TableCollection {...paginationProps} pageIndex={1} />);
+  expect(screen.getByRole('list')).toBeInTheDocument();
+});
+
+test('Pagination callback should be stable across re-renders', () => {
+  const onPageChange = jest.fn();
+  const paginationProps = {
+    ...defaultProps,
+    pageSize: 2,
+    totalCount: 3,
+    pageIndex: 0,
+    onPageChange,
+  };
+
+  const { rerender } = render(<TableCollection {...paginationProps} />);
+
+  // Re-render with same props
+  rerender(<TableCollection {...paginationProps} />);
+
+  // onPageChange should not have been called during re-render
+  expect(onPageChange).not.toHaveBeenCalled();
+});
+
+test('Should display correct page info when showRowCount is true', () => {
+  const paginationProps = {
+    ...defaultProps,
+    pageSize: 2,
+    totalCount: 3,
+    pageIndex: 0,
+    onPageChange: jest.fn(),
+    showRowCount: true,
+  };
+  render(<TableCollection {...paginationProps} />);
+
+  // AntD pagination shows page info
+  expect(screen.getByText('1-2 of 3')).toBeInTheDocument();
+});
+
+test('Should not display page info when showRowCount is false', () => {
+  const paginationProps = {
+    ...defaultProps,
+    pageSize: 2,
+    totalCount: 3,
+    pageIndex: 0,
+    onPageChange: jest.fn(),
+    showRowCount: false,
+  };
+  render(<TableCollection {...paginationProps} />);
+
+  // Page info should not be shown
+  expect(screen.queryByText('1-2 of 3')).not.toBeInTheDocument();
+});
+
+test('Bulk selection should work with pagination', () => {
+  const toggleRowSelected = jest.fn();
+  const toggleAllRowsSelected = jest.fn();
+  const selectionProps = {
+    ...defaultProps,
+    bulkSelectEnabled: true,
+    selectedFlatRows: [],
+    toggleRowSelected,
+    toggleAllRowsSelected,
+    pageSize: 2,
+    totalCount: 3,
+    pageIndex: 0,
+    onPageChange: jest.fn(),
+  };
+  render(<TableCollection {...selectionProps} />);
+
+  // Check that selection checkboxes are rendered
+  const checkboxes = screen.getAllByRole('checkbox');
+  expect(checkboxes.length).toBeGreaterThan(0);
+});

superset-frontend/packages/superset-ui-core/src/components/TableCollection/index.tsx

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { HTMLAttributes, memo, useMemo } from 'react';
+import { HTMLAttributes, memo, useMemo, useCallback } from 'react';
 import {
   ColumnInstance,
   HeaderGroup,
@@ -47,15 +47,25 @@ interface TableCollectionProps<T extends object> {
   toggleAllRowsSelected?: (value?: boolean) => void;
   sticky?: boolean;
   size?: TableSize;
+  pageIndex?: number;
+  pageSize?: number;
+  totalCount?: number;
+  onPageChange?: (page: number, pageSize: number) => void;
+  isPaginationSticky?: boolean;
+  showRowCount?: boolean;
 }
 
-const StyledTable = styled(Table)`
-  ${({ theme }) => `
+const StyledTable = styled(Table)<{
+  isPaginationSticky?: boolean;
+  showRowCount?: boolean;
+}>`
+  ${({ theme, isPaginationSticky, showRowCount }) => `
     th.ant-column-cell {
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
     }
+
     .actions {
       opacity: 0;
       font-size: ${theme.fontSizeXL}px;
@@ -72,15 +82,18 @@ const StyledTable = styled(Table)`
         }
       }
     }
+
     .ant-table-column-title {
       line-height: initial;
     }
+
     .ant-table-row:hover {
       .actions {
         opacity: 1;
         transition: opacity ease-in ${theme.motionDurationMid};
       }
     }
+
     .ant-table-cell {
       max-width: 320px;
       font-feature-settings: 'tnum' 1;
@@ -91,10 +104,37 @@ const StyledTable = styled(Table)`
       padding-left: ${theme.sizeUnit * 4}px;
       white-space: nowrap;
     }
+
     .ant-table-placeholder .ant-table-cell {
       border-bottom: 0;
     }
 
+    &.ant-table-wrapper .ant-table-pagination.ant-pagination {
+      display: flex;
+      justify-content: center;
+      margin: ${showRowCount ? theme.sizeUnit * 4 : 0}px 0 ${showRowCount ? theme.sizeUnit * 14 : 0}px 0;
+      position: relative;
+
+      .ant-pagination-total-text {
+        color: ${theme.colorTextBase};
+        margin-inline-end: 0;
+        position: absolute;
+        top: ${theme.sizeUnit * 12}px;
+      }
+
+      ${
+        isPaginationSticky &&
+        `
+        position: sticky;
+        bottom: 0;
+        left: 0;
+        z-index: 1;
+        background-color: ${theme.colorBgElevated};
+        padding: ${theme.sizeUnit * 2}px 0;
+      `
+      }
+    }
+
     // Hotfix - antd doesn't apply background color to overflowing cells
     & table {
       background-color: ${theme.colorBgContainer};
@@ -116,13 +156,22 @@ function TableCollection<T extends object>({
   prepareRow,
   sticky,
   size = TableSize.Middle,
+  pageIndex = 0,
+  pageSize = 25,
+  totalCount = 0,
+  onPageChange,
+  isPaginationSticky = false,
+  showRowCount = true,
 }: TableCollectionProps<T>) {
-  const mappedColumns = mapColumns<T>(
-    columns,
-    headerGroups,
-    columnsForWrapText,
+  const mappedColumns = useMemo(
+    () => mapColumns<T>(columns, headerGroups, columnsForWrapText),
+    [columns, headerGroups, columnsForWrapText],
+  );
+
+  const mappedRows = useMemo(
+    () => mapRows(rows, prepareRow),
+    [rows, prepareRow],
   );
-  const mappedRows = mapRows(rows, prepareRow);
 
   const selectedRowKeys = useMemo(
     () => selectedFlatRows?.map(row => row.id) || [],
@@ -147,6 +196,68 @@ function TableCollection<T extends object>({
     toggleRowSelected,
     toggleAllRowsSelected,
   ]);
+
+  const handlePaginationChange = useCallback(
+    (page: number, size: number) => {
+      const validPage = Math.max(0, (page || 1) - 1);
+      const validSize = size || pageSize;
+      onPageChange?.(validPage, validSize);
+    },
+    [pageSize, onPageChange],
+  );
+
+  const showTotalFunc = useCallback(
+    (total: number, range: [number, number]) =>
+      `${range[0]}-${range[1]} of ${total}`,
+    [],
+  );
+
+  const handleTableChange = useCallback(
+    (_pagination: any, _filters: any, sorter: SorterResult) => {
+      if (sorter && sorter.field) {
+        setSortBy?.([
+          {
+            id: sorter.field,
+            desc: sorter.order === 'descend',
+          },
+        ] as SortingRule<T>[]);
+      }
+    },
+    [setSortBy],
+  );
+
+  const paginationConfig = useMemo(() => {
+    if (totalCount === 0) return false;
+
+    const config: any = {
+      pageSize,
+      size: 'default' as const,
+      showSizeChanger: false,
+      showQuickJumper: false,
+      align: 'center' as const,
+      showTotal: showRowCount ? showTotalFunc : undefined,
+    };
+
+    if (onPageChange) {
+      config.current = pageIndex + 1;
+      config.total = totalCount;
+      config.onChange = handlePaginationChange;
+    } else {
+      if (pageIndex > 0) config.defaultCurrent = pageIndex + 1;
+      config.total = totalCount;
+    }
+
+    return config;
+  }, [
+    pageSize,
+    totalCount,
+    showRowCount,
+    showTotalFunc,
+    pageIndex,
+    handlePaginationChange,
+    onPageChange,
+  ]);
+
   return (
     <StyledTable
       loading={loading}
@@ -155,12 +266,15 @@ function TableCollection<T extends object>({
       data={mappedRows}
       size={size}
       data-test="listview-table"
-      pagination={false}
+      pagination={paginationConfig}
+      scroll={{ x: 'max-content' }}
       tableLayout="auto"
       rowKey="rowId"
       rowSelection={rowSelection}
       locale={{ emptyText: null }}
       sortDirections={['ascend', 'descend', 'ascend']}
+      isPaginationSticky={isPaginationSticky}
+      showRowCount={showRowCount}
       components={{
         header: {
           cell: (props: HTMLAttributes<HTMLTableCellElement>) => (
@@ -176,14 +290,7 @@ function TableCollection<T extends object>({
           ),
         },
       }}
-      onChange={(_pagination, _filters, sorter: SorterResult) => {
-        setSortBy?.([
-          {
-            id: sorter.field,
-            desc: sorter.order === 'descend',
-          },
-        ] as SortingRule<T>[]);
-      }}
+      onChange={handleTableChange}
     />
   );
 }

superset-frontend/packages/superset-ui-core/src/components/TableView/TableView.test.tsx

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { render, screen, userEvent } from '@superset-ui/core/spec';
+import { render, screen, userEvent, waitFor } from '@superset-ui/core/spec';
 import { TableView, TableViewProps } from '.';
 
 const mockedProps: TableViewProps = {
@@ -30,6 +30,7 @@ const mockedProps: TableViewProps = {
     {
       accessor: 'age',
       Header: 'Age',
+      sortable: true,
       id: 'age',
     },
     {
@@ -78,10 +79,10 @@ test('should render the cells', () => {
 
 test('should render the pagination', () => {
   render(<TableView {...mockedProps} />);
-  expect(screen.getByRole('navigation')).toBeInTheDocument();
-  expect(screen.getAllByRole('button')).toHaveLength(4);
-  expect(screen.getByText('«')).toBeInTheDocument();
-  expect(screen.getByText('»')).toBeInTheDocument();
+  expect(screen.getByRole('list')).toBeInTheDocument();
+  expect(screen.getAllByRole('button')).toHaveLength(2);
+  expect(screen.getByTitle('Previous Page')).toBeInTheDocument();
+  expect(screen.getByTitle('Next Page')).toBeInTheDocument();
 });
 
 test('should show the row count by default', () => {
@@ -104,45 +105,63 @@ test('should NOT render the pagination when disabled', () => {
     withPagination: false,
   };
   render(<TableView {...withoutPaginationProps} />);
-  expect(screen.queryByRole('navigation')).not.toBeInTheDocument();
+  expect(screen.queryByRole('list')).not.toBeInTheDocument();
 });
 
-test('should NOT render the pagination when fewer rows than page size', () => {
+test('should render the pagination even when fewer rows than page size', () => {
   const withoutPaginationProps = {
     ...mockedProps,
     pageSize: 3,
   };
   render(<TableView {...withoutPaginationProps} />);
-  expect(screen.queryByRole('navigation')).not.toBeInTheDocument();
+  expect(screen.getByRole('list')).toBeInTheDocument();
 });
 
-test('should change page when « and » buttons are clicked', async () => {
+test('should change page when pagination is clicked', async () => {
   render(<TableView {...mockedProps} />);
-  const nextBtn = screen.getByText('»');
-  const prevBtn = screen.getByText('«');
 
-  await userEvent.click(nextBtn);
-  expect(screen.getAllByRole('cell')).toHaveLength(3);
-  expect(screen.getByText('321')).toBeInTheDocument();
-  expect(screen.getByText('10')).toBeInTheDocument();
-  expect(screen.getByText('Kate')).toBeInTheDocument();
-  expect(screen.queryByText('Emily')).not.toBeInTheDocument();
-
-  await userEvent.click(prevBtn);
-  expect(screen.getAllByRole('cell')).toHaveLength(3);
   expect(screen.getByText('123')).toBeInTheDocument();
   expect(screen.getByText('27')).toBeInTheDocument();
   expect(screen.getByText('Emily')).toBeInTheDocument();
   expect(screen.queryByText('Kate')).not.toBeInTheDocument();
+
+  const page2 = screen.getByRole('listitem', { name: '2' });
+  await userEvent.click(page2);
+
+  await waitFor(() => {
+    expect(screen.getAllByRole('cell')).toHaveLength(3);
+    expect(screen.getByText('321')).toBeInTheDocument();
+    expect(screen.getByText('10')).toBeInTheDocument();
+    expect(screen.getByText('Kate')).toBeInTheDocument();
+    expect(screen.queryByText('Emily')).not.toBeInTheDocument();
+  });
+
+  const page1 = screen.getByRole('listitem', { name: '1' });
+  await userEvent.click(page1);
+
+  await waitFor(() => {
+    expect(screen.getAllByRole('cell')).toHaveLength(3);
+    expect(screen.getByText('123')).toBeInTheDocument();
+    expect(screen.getByText('27')).toBeInTheDocument();
+    expect(screen.getByText('Emily')).toBeInTheDocument();
+    expect(screen.queryByText('Kate')).not.toBeInTheDocument();
+  });
 });
 
 test('should sort by age', async () => {
   render(<TableView {...mockedProps} />);
 
   await userEvent.click(screen.getAllByTestId('sort-header')[1]);
-  expect(screen.getAllByTestId('table-row-cell')[1]).toHaveTextContent('10');
+
+  await waitFor(() => {
+    expect(screen.getAllByTestId('table-row-cell')[1]).toHaveTextContent('10');
+  });
+
   await userEvent.click(screen.getAllByTestId('sort-header')[1]);
-  expect(screen.getAllByTestId('table-row-cell')[1]).toHaveTextContent('27');
+
+  await waitFor(() => {
+    expect(screen.getAllByTestId('table-row-cell')[1]).toHaveTextContent('27');
+  });
 });
 
 test('should sort by initialSortBy DESC', () => {
@@ -208,3 +227,146 @@ test('should render the right wrap content text by columnsForWrapText', () => {
     'ant-table-cell-ellipsis',
   );
 });
+
+test('should handle server-side pagination', async () => {
+  const onServerPagination = jest.fn();
+  const serverPaginationProps = {
+    ...mockedProps,
+    serverPagination: true,
+    onServerPagination,
+    totalCount: 10,
+    pageSize: 2,
+  };
+  render(<TableView {...serverPaginationProps} />);
+
+  // Click next page
+  const page2 = screen.getByRole('listitem', { name: '2' });
+  await userEvent.click(page2);
+
+  await waitFor(() => {
+    expect(onServerPagination).toHaveBeenCalledWith({
+      pageIndex: 1,
+    });
+  });
+});
+
+test('should handle server-side sorting', async () => {
+  const onServerPagination = jest.fn();
+  const serverPaginationProps = {
+    ...mockedProps,
+    serverPagination: true,
+    onServerPagination,
+  };
+  render(<TableView {...serverPaginationProps} />);
+
+  // Click on sortable column
+  await userEvent.click(screen.getAllByTestId('sort-header')[0]);
+
+  await waitFor(() => {
+    expect(onServerPagination).toHaveBeenCalledWith({
+      pageIndex: 0,
+      sortBy: [{ id: 'id', desc: false }],
+    });
+  });
+});
+
+test('pagination callbacks should be stable across re-renders', () => {
+  const onServerPagination = jest.fn();
+  const serverPaginationProps = {
+    ...mockedProps,
+    serverPagination: true,
+    onServerPagination,
+    totalCount: 10,
+    pageSize: 2,
+  };
+
+  const { rerender } = render(<TableView {...serverPaginationProps} />);
+
+  // Re-render with same props
+  rerender(<TableView {...serverPaginationProps} />);
+
+  // onServerPagination should not have been called during re-render
+  expect(onServerPagination).not.toHaveBeenCalled();
+});
+
+test('should scroll to top when scrollTopOnPagination is true', async () => {
+  const scrollToSpy = jest
+    .spyOn(window, 'scrollTo')
+    .mockImplementation(() => {});
+
+  const scrollProps = {
+    ...mockedProps,
+    scrollTopOnPagination: true,
+    pageSize: 1,
+  };
+  render(<TableView {...scrollProps} />);
+
+  // Click next page
+  const page2 = screen.getByRole('listitem', { name: '2' });
+  await userEvent.click(page2);
+
+  await waitFor(() => {
+    expect(scrollToSpy).toHaveBeenCalledWith({ top: 0, behavior: 'smooth' });
+  });
+
+  scrollToSpy.mockRestore();
+});
+
+test('should NOT scroll to top when scrollTopOnPagination is false', async () => {
+  const scrollToSpy = jest
+    .spyOn(window, 'scrollTo')
+    .mockImplementation(() => {});
+
+  const scrollProps = {
+    ...mockedProps,
+    scrollTopOnPagination: false,
+    pageSize: 1,
+  };
+  render(<TableView {...scrollProps} />);
+
+  // Click next page
+  const page2 = screen.getByRole('listitem', { name: '2' });
+  await userEvent.click(page2);
+
+  await waitFor(() => {
+    expect(screen.getByText('321')).toBeInTheDocument();
+  });
+
+  expect(scrollToSpy).not.toHaveBeenCalled();
+
+  scrollToSpy.mockRestore();
+});
+
+test('should handle totalCount of 0 correctly', () => {
+  const emptyProps = {
+    ...mockedProps,
+    data: [],
+    totalCount: 0,
+  };
+  render(<TableView {...emptyProps} />);
+
+  // Pagination should not be shown when totalCount is 0
+  expect(screen.queryByRole('list')).not.toBeInTheDocument();
+});
+
+test('should handle large datasets with pagination', () => {
+  const largeDataset = Array.from({ length: 100 }, (_, i) => ({
+    id: i,
+    age: 20 + i,
+    name: `Person ${i}`,
+  }));
+
+  const largeDataProps = {
+    ...mockedProps,
+    data: largeDataset,
+    pageSize: 10,
+  };
+  render(<TableView {...largeDataProps} />);
+
+  // Should show only first page (10 items)
+  expect(screen.getAllByTestId('table-row')).toHaveLength(10);
+
+  // Should show pagination with correct page count
+  expect(screen.getByRole('list')).toBeInTheDocument();
+  expect(screen.getByText('1-10 of 100')).toBeInTheDocument();
+});

superset-frontend/packages/superset-ui-core/src/components/TableView/TableView.tsx

@@ -16,16 +16,17 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { memo, useEffect, useRef } from 'react';
+import { memo, useEffect, useRef, useMemo, useCallback } from 'react';
 import { isEqual } from 'lodash';
-import { styled, t } from '@superset-ui/core';
+import { styled } from '@superset-ui/core';
 import { useFilters, usePagination, useSortBy, useTable } from 'react-table';
 import { Empty } from '@superset-ui/core/components';
-import Pagination from '@superset-ui/core/components/Pagination';
 import TableCollection from '@superset-ui/core/components/TableCollection';
 import { TableSize } from '@superset-ui/core/components/Table';
 import { SortByType, ServerPagination } from './types';
 
+const NOOP_SERVER_PAGINATION = () => {};
+
 const DEFAULT_PAGE_SIZE = 10;
 
 export enum EmptyWrapperType {
@@ -96,29 +97,6 @@ const TableViewStyles = styled.div<{
   }
 `;
 
-const PaginationStyles = styled.div<{
-  isPaginationSticky?: boolean;
-}>`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  background-color: ${({ theme }) => theme.colorBgElevated};
-
-  ${({ isPaginationSticky }) =>
-    isPaginationSticky &&
-    `
-        position: sticky;
-        bottom: 0;
-        left: 0;
-    `};
-
-  .row-count-container {
-    margin-top: ${({ theme }) => theme.sizeUnit * 2}px;
-    color: ${({ theme }) => theme.colorText};
-  }
-`;
-
 const RawTableView = ({
   columns,
   data,
@@ -133,16 +111,21 @@ const RawTableView = ({
   showRowCount = true,
   serverPagination = false,
   columnsForWrapText,
-  onServerPagination = () => {},
-  scrollTopOnPagination = false,
+  onServerPagination = NOOP_SERVER_PAGINATION,
+  scrollTopOnPagination = true,
   size = TableSize.Middle,
   ...props
 }: TableViewProps) => {
-  const initialState = {
-    pageSize: initialPageSize ?? DEFAULT_PAGE_SIZE,
-    pageIndex: initialPageIndex ?? 0,
-    sortBy: initialSortBy,
-  };
+  const tableRef = useRef<HTMLTableElement>(null);
+
+  const initialState = useMemo(
+    () => ({
+      pageSize: initialPageSize ?? DEFAULT_PAGE_SIZE,
+      pageIndex: initialPageIndex ?? 0,
+      sortBy: initialSortBy,
+    }),
+    [initialPageSize, initialPageIndex, initialSortBy],
+  );
 
   const {
     getTableProps,
@@ -151,10 +134,9 @@ const RawTableView = ({
     page,
     rows,
     prepareRow,
-    pageCount,
     gotoPage,
     setSortBy,
-    state: { pageIndex, pageSize, sortBy },
+    state: { pageIndex, sortBy },
   } = useTable(
     {
       columns,
@@ -162,36 +144,94 @@ const RawTableView = ({
       initialState,
       manualPagination: serverPagination,
       manualSortBy: serverPagination,
-      pageCount: Math.ceil(totalCount / initialState.pageSize),
+      pageCount: serverPagination
+        ? Math.ceil(totalCount / initialState.pageSize)
+        : undefined,
+      autoResetSortBy: false,
     },
     useFilters,
     useSortBy,
-    usePagination,
+    ...(withPagination ? [usePagination] : []),
   );
 
-  const content = withPagination ? page : rows;
-
-  let EmptyWrapperComponent;
-  switch (emptyWrapperType) {
-    case EmptyWrapperType.Small:
-      EmptyWrapperComponent = ({ children }: any) => <>{children}</>;
-      break;
-    case EmptyWrapperType.Default:
-    default:
-      EmptyWrapperComponent = ({ children }: any) => (
-        <EmptyWrapper>{children}</EmptyWrapper>
-      );
-  }
-
-  const isEmpty = !loading && content.length === 0;
-  const hasPagination = pageCount > 1 && withPagination;
-  const tableRef = useRef<HTMLTableElement>(null);
-  const handleGotoPage = (p: number) => {
-    if (scrollTopOnPagination) {
-      tableRef?.current?.scroll(0, 0);
+  const EmptyWrapperComponent = useMemo(() => {
+    switch (emptyWrapperType) {
+      case EmptyWrapperType.Small:
+        return ({ children }: any) => <>{children}</>;
+      case EmptyWrapperType.Default:
+      default:
+        return ({ children }: any) => <EmptyWrapper>{children}</EmptyWrapper>;
     }
-    gotoPage(p);
-  };
+  }, [emptyWrapperType]);
+
+  const content = useMemo(
+    () => (withPagination ? page : rows),
+    [withPagination, page, rows],
+  );
+
+  const isEmpty = useMemo(
+    () => !loading && content.length === 0,
+    [loading, content.length],
+  );
+
+  const handleScrollToTop = useCallback(() => {
+    if (scrollTopOnPagination) {
+      if (tableRef?.current) {
+        if (typeof tableRef.current.scrollTo === 'function') {
+          tableRef.current.scrollTo({ top: 0, behavior: 'smooth' });
+        } else if (typeof tableRef.current.scroll === 'function') {
+          tableRef.current.scroll(0, 0);
+        }
+      }
+
+      if (typeof window !== 'undefined' && window.scrollTo)
+        window.scrollTo({ top: 0, behavior: 'smooth' });
+    }
+  }, [scrollTopOnPagination]);
+
+  const handlePageChange = useCallback(
+    (p: number) => {
+      if (scrollTopOnPagination) handleScrollToTop();
+
+      gotoPage(p);
+    },
+    [scrollTopOnPagination, handleScrollToTop, gotoPage],
+  );
+
+  const paginationProps = useMemo(() => {
+    if (!withPagination) {
+      return {
+        pageIndex: 0,
+        pageSize: data.length,
+        totalCount: 0,
+        onPageChange: undefined,
+      };
+    }
+
+    if (serverPagination) {
+      return {
+        pageIndex,
+        pageSize: initialPageSize ?? DEFAULT_PAGE_SIZE,
+        totalCount,
+        onPageChange: handlePageChange,
+      };
+    }
+
+    return {
+      pageIndex,
+      pageSize: initialPageSize ?? DEFAULT_PAGE_SIZE,
+      totalCount: data.length,
+      onPageChange: handlePageChange,
+    };
+  }, [
+    withPagination,
+    serverPagination,
+    pageIndex,
+    initialPageSize,
+    totalCount,
+    data.length,
+    handlePageChange,
+  ]);
 
   useEffect(() => {
     if (serverPagination && pageIndex !== initialState.pageIndex) {
@@ -199,7 +239,7 @@ const RawTableView = ({
         pageIndex,
       });
     }
-  }, [pageIndex]);
+  }, [initialState.pageIndex, onServerPagination, pageIndex, serverPagination]);
 
   useEffect(() => {
     if (serverPagination && !isEqual(sortBy, initialState.sortBy)) {
@@ -208,61 +248,38 @@ const RawTableView = ({
         sortBy,
       });
     }
-  }, [sortBy]);
+  }, [initialState.sortBy, onServerPagination, serverPagination, sortBy]);
 
   return (
-    <>
-      <TableViewStyles {...props} ref={tableRef}>
-        <TableCollection
-          getTableProps={getTableProps}
-          getTableBodyProps={getTableBodyProps}
-          prepareRow={prepareRow}
-          headerGroups={headerGroups}
-          rows={content}
-          columns={columns}
-          loading={loading}
-          setSortBy={setSortBy}
-          size={size}
-          columnsForWrapText={columnsForWrapText}
-        />
-        {isEmpty && (
-          <EmptyWrapperComponent>
-            {noDataText ? (
-              <Empty
-                image={Empty.PRESENTED_IMAGE_SIMPLE}
-                description={noDataText}
-              />
-            ) : (
-              <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
-            )}
-          </EmptyWrapperComponent>
-        )}
-      </TableViewStyles>
-      {hasPagination && (
-        <PaginationStyles
-          className="pagination-container"
-          isPaginationSticky={props.isPaginationSticky}
-        >
-          <Pagination
-            totalPages={pageCount || 0}
-            currentPage={pageCount ? pageIndex + 1 : 0}
-            onChange={(p: number) => handleGotoPage(p - 1)}
-            hideFirstAndLastPageLinks
-          />
-          {showRowCount && (
-            <div className="row-count-container">
-              {!loading &&
-                t(
-                  '%s-%s of %s',
-                  pageSize * pageIndex + (page.length && 1),
-                  pageSize * pageIndex + page.length,
-                  totalCount,
-                )}
-            </div>
+    <TableViewStyles {...props} ref={tableRef}>
+      <TableCollection
+        getTableProps={getTableProps}
+        getTableBodyProps={getTableBodyProps}
+        prepareRow={prepareRow}
+        headerGroups={headerGroups}
+        rows={content}
+        columns={columns}
+        loading={loading}
+        setSortBy={setSortBy}
+        size={size}
+        columnsForWrapText={columnsForWrapText}
+        isPaginationSticky={props.isPaginationSticky}
+        showRowCount={showRowCount}
+        {...paginationProps}
+      />
+      {isEmpty && (
+        <EmptyWrapperComponent>
+          {noDataText ? (
+            <Empty
+              image={Empty.PRESENTED_IMAGE_SIMPLE}
+              description={noDataText}
+            />
+          ) : (
+            <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
           )}
-        </PaginationStyles>
+        </EmptyWrapperComponent>
       )}
-    </>
+    </TableViewStyles>
   );
 };
 

superset-frontend/packages/superset-ui-core/src/components/Tabs/Tabs.test.tsx

@@ -0,0 +1,306 @@
+/**
+ * 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 { fireEvent, render } from '@superset-ui/core/spec';
+import Tabs, { EditableTabs, LineEditableTabs } from './Tabs';
+
+describe('Tabs', () => {
+  const defaultItems = [
+    {
+      key: '1',
+      label: 'Tab 1',
+      children: <div data-testid="tab1-content">Tab 1 content</div>,
+    },
+    {
+      key: '2',
+      label: 'Tab 2',
+      children: <div data-testid="tab2-content">Tab 2 content</div>,
+    },
+    {
+      key: '3',
+      label: 'Tab 3',
+      children: <div data-testid="tab3-content">Tab 3 content</div>,
+    },
+  ];
+
+  describe('Basic Tabs', () => {
+    it('should render tabs with default props', () => {
+      const { getByText, container } = render(<Tabs items={defaultItems} />);
+
+      expect(getByText('Tab 1')).toBeInTheDocument();
+      expect(getByText('Tab 2')).toBeInTheDocument();
+      expect(getByText('Tab 3')).toBeInTheDocument();
+
+      const activeTabContent = container.querySelector(
+        '.ant-tabs-tabpane-active',
+      );
+
+      expect(activeTabContent).toBeDefined();
+      expect(
+        activeTabContent?.querySelector('[data-testid="tab1-content"]'),
+      ).toBeDefined();
+    });
+
+    it('should render tabs component structure', () => {
+      const { container } = render(<Tabs items={defaultItems} />);
+      const tabsElement = container.querySelector('.ant-tabs');
+      const tabsNav = container.querySelector('.ant-tabs-nav');
+      const tabsContent = container.querySelector('.ant-tabs-content-holder');
+
+      expect(tabsElement).toBeDefined();
+      expect(tabsNav).toBeDefined();
+      expect(tabsContent).toBeDefined();
+    });
+
+    it('should apply default tabBarStyle with padding', () => {
+      const { container } = render(<Tabs items={defaultItems} />);
+      const tabsNav = container.querySelector('.ant-tabs-nav') as HTMLElement;
+
+      // Check that tabBarStyle is applied (default padding is added)
+      expect(tabsNav?.style?.paddingLeft).toBeDefined();
+    });
+
+    it('should merge custom tabBarStyle with defaults', () => {
+      const customStyle = { paddingRight: '20px', backgroundColor: 'red' };
+      const { container } = render(
+        <Tabs items={defaultItems} tabBarStyle={customStyle} />,
+      );
+      const tabsNav = container.querySelector('.ant-tabs-nav') as HTMLElement;
+
+      expect(tabsNav?.style?.paddingLeft).toBeDefined();
+      expect(tabsNav?.style?.paddingRight).toBe('20px');
+      expect(tabsNav?.style?.backgroundColor).toBe('red');
+    });
+
+    it('should handle allowOverflow prop', () => {
+      const { container: allowContainer } = render(
+        <Tabs items={defaultItems} allowOverflow />,
+      );
+      const { container: disallowContainer } = render(
+        <Tabs items={defaultItems} allowOverflow={false} />,
+      );
+
+      expect(allowContainer.querySelector('.ant-tabs')).toBeDefined();
+      expect(disallowContainer.querySelector('.ant-tabs')).toBeDefined();
+    });
+
+    it('should disable animation by default', () => {
+      const { container } = render(<Tabs items={defaultItems} />);
+      const tabsElement = container.querySelector('.ant-tabs');
+
+      expect(tabsElement?.className).not.toContain('ant-tabs-animated');
+    });
+
+    it('should handle tab change events', () => {
+      const onChangeMock = jest.fn();
+      const { getByText } = render(
+        <Tabs items={defaultItems} onChange={onChangeMock} />,
+      );
+
+      fireEvent.click(getByText('Tab 2'));
+
+      expect(onChangeMock).toHaveBeenCalledWith('2');
+    });
+
+    it('should pass through additional props to Antd Tabs', () => {
+      const onTabClickMock = jest.fn();
+      const { getByText } = render(
+        <Tabs
+          items={defaultItems}
+          onTabClick={onTabClickMock}
+          size="large"
+          centered
+        />,
+      );
+
+      fireEvent.click(getByText('Tab 2'));
+
+      expect(onTabClickMock).toHaveBeenCalled();
+    });
+  });
+
+  describe('EditableTabs', () => {
+    it('should render with editable features', () => {
+      const { container } = render(<EditableTabs items={defaultItems} />);
+
+      const tabsElement = container.querySelector('.ant-tabs');
+
+      expect(tabsElement?.className).toContain('ant-tabs-card');
+      expect(tabsElement?.className).toContain('ant-tabs-editable-card');
+    });
+
+    it('should handle onEdit callback for add/remove actions', () => {
+      const onEditMock = jest.fn();
+      const itemsWithRemove = defaultItems.map(item => ({
+        ...item,
+        closable: true,
+      }));
+
+      const { container } = render(
+        <EditableTabs items={itemsWithRemove} onEdit={onEditMock} />,
+      );
+
+      const removeButton = container.querySelector('.ant-tabs-tab-remove');
+      expect(removeButton).toBeDefined();
+
+      fireEvent.click(removeButton!);
+      expect(onEditMock).toHaveBeenCalledWith(expect.any(String), 'remove');
+    });
+
+    it('should have default props set correctly', () => {
+      expect(EditableTabs.defaultProps?.type).toBe('editable-card');
+      expect(EditableTabs.defaultProps?.animated).toEqual({
+        inkBar: true,
+        tabPane: false,
+      });
+    });
+  });
+
+  describe('LineEditableTabs', () => {
+    it('should render as line-style editable tabs', () => {
+      const { container } = render(<LineEditableTabs items={defaultItems} />);
+
+      const tabsElement = container.querySelector('.ant-tabs');
+
+      expect(tabsElement?.className).toContain('ant-tabs-card');
+      expect(tabsElement?.className).toContain('ant-tabs-editable-card');
+    });
+
+    it('should render with line-specific styling', () => {
+      const { container } = render(<LineEditableTabs items={defaultItems} />);
+
+      const inkBar = container.querySelector('.ant-tabs-ink-bar');
+      expect(inkBar).toBeDefined();
+    });
+  });
+
+  describe('TabPane Legacy Support', () => {
+    it('should support TabPane component access', () => {
+      expect(Tabs.TabPane).toBeDefined();
+      expect(EditableTabs.TabPane).toBeDefined();
+      expect(LineEditableTabs.TabPane).toBeDefined();
+    });
+
+    it('should render using legacy TabPane syntax', () => {
+      const { getByText, container } = render(
+        <Tabs>
+          <Tabs.TabPane tab="Legacy Tab 1" key="1">
+            <div data-testid="legacy-content-1">Legacy content 1</div>
+          </Tabs.TabPane>
+          <Tabs.TabPane tab="Legacy Tab 2" key="2">
+            <div data-testid="legacy-content-2">Legacy content 2</div>
+          </Tabs.TabPane>
+        </Tabs>,
+      );
+
+      expect(getByText('Legacy Tab 1')).toBeInTheDocument();
+      expect(getByText('Legacy Tab 2')).toBeInTheDocument();
+
+      const activeTabContent = container.querySelector(
+        '.ant-tabs-tabpane-active [data-testid="legacy-content-1"]',
+      );
+
+      expect(activeTabContent).toBeDefined();
+      expect(activeTabContent?.textContent).toBe('Legacy content 1');
+    });
+  });
+
+  describe('Edge Cases', () => {
+    it('should handle empty items array', () => {
+      const { container } = render(<Tabs items={[]} />);
+      const tabsElement = container.querySelector('.ant-tabs');
+
+      expect(tabsElement).toBeDefined();
+    });
+
+    it('should handle undefined items', () => {
+      const { container } = render(<Tabs />);
+      const tabsElement = container.querySelector('.ant-tabs');
+
+      expect(tabsElement).toBeDefined();
+    });
+
+    it('should handle tabs with no content', () => {
+      const itemsWithoutContent = [
+        { key: '1', label: 'Tab 1' },
+        { key: '2', label: 'Tab 2' },
+      ];
+
+      const { getByText } = render(<Tabs items={itemsWithoutContent} />);
+
+      expect(getByText('Tab 1')).toBeInTheDocument();
+      expect(getByText('Tab 2')).toBeInTheDocument();
+    });
+
+    it('should handle allowOverflow default value', () => {
+      const { container } = render(<Tabs items={defaultItems} />);
+      expect(container.querySelector('.ant-tabs')).toBeDefined();
+    });
+  });
+
+  describe('Accessibility', () => {
+    it('should render with proper ARIA roles', () => {
+      const { container } = render(<Tabs items={defaultItems} />);
+
+      const tablist = container.querySelector('[role="tablist"]');
+      const tabs = container.querySelectorAll('[role="tab"]');
+
+      expect(tablist).toBeDefined();
+      expect(tabs.length).toBe(3);
+    });
+
+    it('should support keyboard navigation', () => {
+      const { container, getByText } = render(<Tabs items={defaultItems} />);
+
+      const firstTab = container.querySelector('[role="tab"]');
+      const secondTab = getByText('Tab 2');
+
+      if (firstTab) {
+        fireEvent.keyDown(firstTab, { key: 'ArrowRight', code: 'ArrowRight' });
+      }
+
+      fireEvent.click(secondTab);
+
+      expect(secondTab).toBeInTheDocument();
+    });
+  });
+
+  describe('Styling Integration', () => {
+    it('should accept and apply custom CSS classes', () => {
+      const { container } = render(
+        <Tabs items={defaultItems} className="custom-tabs-class" />,
+      );
+
+      const tabsElement = container.querySelector('.ant-tabs');
+
+      expect(tabsElement?.className).toContain('custom-tabs-class');
+    });
+
+    it('should accept and apply custom styles', () => {
+      const customStyle = { minHeight: '200px' };
+      const { container } = render(
+        <Tabs items={defaultItems} style={customStyle} />,
+      );
+
+      const tabsElement = container.querySelector('.ant-tabs') as HTMLElement;
+
+      expect(tabsElement?.style?.minHeight).toBe('200px');
+    });
+  });
+});

superset-frontend/packages/superset-ui-core/src/components/Tabs/Tabs.tsx

@@ -29,14 +29,18 @@ export interface TabsProps extends AntdTabsProps {
 const StyledTabs = ({
   animated = false,
   allowOverflow = true,
+  tabBarStyle,
   ...props
 }: TabsProps) => {
   const theme = useTheme();
+  const defaultTabBarStyle = { paddingLeft: theme.sizeUnit * 4 };
+  const mergedStyle = { ...defaultTabBarStyle, ...tabBarStyle };
+
   return (
     <AntdTabs
       animated={animated}
       {...props}
-      tabBarStyle={{ paddingLeft: theme.sizeUnit * 4 }}
+      tabBarStyle={mergedStyle}
       css={theme => css`
         overflow: ${allowOverflow ? 'visible' : 'hidden'};
 

superset-frontend/packages/superset-ui-core/src/theme/Theme.tsx

@@ -19,7 +19,7 @@
 /* eslint-disable react-prefer-function-component/react-prefer-function-component */
 // eslint-disable-next-line no-restricted-syntax
 import React from 'react';
-import { theme as antdThemeImport, ConfigProvider } from 'antd';
+import { theme as antdThemeImport, ConfigProvider, App } from 'antd';
 
 // @fontsource/* v5.1+ doesn't play nice with eslint-import plugin v2.31+
 /* eslint-disable import/extensions */
@@ -243,7 +243,7 @@ export class Theme {
         <ThemeProvider theme={themeState.theme}>
           <GlobalStyles />
           <ConfigProvider theme={themeState.antdConfig}>
-            {children}
+            <App>{children}</App>
           </ConfigProvider>
         </ThemeProvider>
       </EmotionCacheProvider>

superset-frontend/packages/superset-ui-core/src/utils/featureFlags.ts

@@ -34,6 +34,7 @@ export enum FeatureFlag {
   DashboardVirtualization = 'DASHBOARD_VIRTUALIZATION',
   DashboardRbac = 'DASHBOARD_RBAC',
   DatapanelClosedByDefault = 'DATAPANEL_CLOSED_BY_DEFAULT',
+  DateRangeTimeshiftsEnabled = 'DATE_RANGE_TIMESHIFTS_ENABLED',
   /** @deprecated */
   DrillToDetail = 'DRILL_TO_DETAIL',
   DrillBy = 'DRILL_BY',

superset-frontend/packages/superset-ui-core/test/chart/components/SuperChartCore.test.tsx

@@ -203,7 +203,13 @@ describe('SuperChartCore', () => {
       );
 
       await waitFor(() => {
-        expect(container).toBeEmptyDOMElement();
+        // The container will have the Ant Design App wrapper, but no chart content
+        const testComponent = container.querySelector('.test-component');
+        expect(testComponent).not.toBeInTheDocument();
+
+        // Ensure only the Ant Design App wrapper is present
+        const antApp = container.querySelector('.ant-app');
+        expect(antApp).toBeInTheDocument();
       });
     });
   });

superset-frontend/plugins/legacy-plugin-chart-country-map/src/ReactCountryMap.jsx

@@ -58,11 +58,13 @@ export default styled(CountryMap)`
     }
 
     .superset-legacy-chart-country-map text.result-text {
+      fill: ${theme.colorText};
       font-weight: ${theme.fontWeightLight};
       font-size: ${theme.fontSizeXL}px;
     }
 
     .superset-legacy-chart-country-map text.big-text {
+      fill: ${theme.colorText};
       font-weight: ${theme.fontWeightStrong};
       font-size: ${theme.fontSizeLG}px;
     }

superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/controlPanel.ts

@@ -158,6 +158,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
+        ['zoomable'],
       ],
     },
   ],

superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts

@@ -73,6 +73,7 @@ export default function transformProps(
     yAxisTitleMargin,
     yAxisTitlePosition,
     sliceId,
+    zoomable,
   } = formData as BoxPlotQueryFormData;
   const refs: Refs = {};
   const colorFn = CategoricalColorNamespace.getScale(colorScheme as string);
@@ -284,6 +285,26 @@ export default function transformProps(
       },
     },
     series,
+    toolbox: {
+      show: zoomable,
+      feature: {
+        dataZoom: {
+          title: {
+            zoom: 'zoom area',
+            back: 'restore zoom',
+          },
+        },
+      },
+    },
+    dataZoom: zoomable
+      ? [
+          {
+            type: 'inside',
+            zoomOnMouseWheel: false,
+            moveOnMouseWheel: true,
+          },
+        ]
+      : [],
   };
 
   return {

superset-frontend/plugins/plugin-chart-echarts/src/Bubble/transformProps.ts

@@ -128,6 +128,7 @@ export default function transformProps(chartProps: EchartsBubbleChartProps) {
     legendOrientation,
     legendMargin,
     legendType,
+    legendSort,
     sliceId,
   }: EchartsBubbleFormData = { ...DEFAULT_FORM_DATA, ...formData };
   const colorFn = CategoricalColorNamespace.getScale(colorScheme as string);
@@ -230,7 +231,10 @@ export default function transformProps(chartProps: EchartsBubbleChartProps) {
     },
     legend: {
       ...getLegendProps(legendType, legendOrientation, showLegend, theme),
-      data: Array.from(legends),
+      data: Array.from(legends).sort((a: string, b: string) => {
+        if (!legendSort) return 0;
+        return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+      }),
     },
     tooltip: {
       show: !inContextMenu,

superset-frontend/plugins/plugin-chart-echarts/src/Funnel/transformProps.ts

@@ -112,6 +112,7 @@ export default function transformProps(
     legendMargin,
     legendOrientation,
     legendType,
+    legendSort,
     metric = '',
     numberFormat,
     currencyFormat,
@@ -290,7 +291,10 @@ export default function transformProps(
     },
     legend: {
       ...getLegendProps(legendType, legendOrientation, showLegend, theme),
-      data: keys,
+      data: keys.sort((a: string, b: string) => {
+        if (!legendSort) return 0;
+        return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+      }),
     },
     series,
   };

superset-frontend/plugins/plugin-chart-echarts/src/Gantt/transformProps.ts

@@ -131,6 +131,7 @@ export default function transformProps(chartProps: EchartsGanttChartProps) {
     legendMargin,
     legendOrientation,
     legendType,
+    legendSort,
     showLegend,
     yAxisTitle,
     yAxisTitleMargin,
@@ -330,6 +331,18 @@ export default function transformProps(chartProps: EchartsGanttChartProps) {
     },
   );
 
+  const legendData = series
+    .map(entry => {
+      const { name } = entry;
+      if (name === null || name === undefined) return '';
+      return String(name);
+    })
+    .filter(name => name !== '')
+    .sort((a, b) => {
+      if (!legendSort) return 0;
+      return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+    });
+
   const tooltipFormatterMap = {
     [GenericDataType.Numeric]: tooltipValuesFormatter,
     [GenericDataType.String]: undefined,
@@ -365,6 +378,7 @@ export default function transformProps(chartProps: EchartsGanttChartProps) {
         zoomable,
         legendState,
       ),
+      data: legendData,
     },
     grid: {
       ...defaultGrid,

superset-frontend/plugins/plugin-chart-echarts/src/Graph/transformProps.ts

@@ -188,6 +188,7 @@ export default function transformProps(
     legendMargin,
     legendOrientation,
     legendType,
+    legendSort,
     showLegend,
     baseEdgeWidth,
     baseNodeSize,
@@ -353,7 +354,10 @@ export default function transformProps(
     },
     legend: {
       ...getLegendProps(legendType, legendOrientation, showLegend, theme),
-      data: categoryList,
+      data: categoryList.sort((a: string, b: string) => {
+        if (!legendSort) return 0;
+        return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+      }),
     },
     series,
   };

superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx

@@ -42,6 +42,7 @@ import {
   xAxisBounds,
   xAxisLabelRotation,
   xAxisLabelInterval,
+  forceMaxInterval,
 } from '../controls';
 
 const {
@@ -358,6 +359,7 @@ const config: ControlPanelConfig = {
         ['x_axis_time_format'],
         [xAxisLabelRotation],
         [xAxisLabelInterval],
+        [forceMaxInterval],
         [<ControlSubSectionHeader>{t('Tooltip')}</ControlSubSectionHeader>],
         [
           {

superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts

@@ -129,6 +129,7 @@ export default function transformProps(
     theme,
     inContextMenu,
     emitCrossFilters,
+    legendState,
   } = chartProps;
 
   let focusedSeries: string | null = null;
@@ -157,7 +158,9 @@ export default function transformProps(
     timeShiftColor,
     contributionMode,
     legendOrientation,
+    legendMargin,
     legendType,
+    legendSort,
     logAxis,
     logAxisSecondary,
     markerEnabled,
@@ -211,6 +214,7 @@ export default function transformProps(
     sortSeriesAscending,
     sortSeriesAscendingB,
     timeGrainSqla,
+    forceMaxInterval,
     percentageThreshold,
     showQueryIdentifiers = false,
     metrics = [],
@@ -423,6 +427,7 @@ export default function transformProps(
       {
         ...entry,
         id: `${displayName || ''}`,
+        name: `${displayName || ''}`,
       },
       colorScale,
       colorScaleKey,
@@ -489,6 +494,7 @@ export default function transformProps(
       {
         ...entry,
         id: `${displayName || ''}`,
+        name: `${displayName || ''}`,
       },
 
       colorScale,
@@ -550,7 +556,7 @@ export default function transformProps(
     legendOrientation,
     addYAxisTitleOffset,
     zoomable,
-    null,
+    legendMargin,
     addXAxisTitleOffset,
     yAxisTitlePosition,
     convertInteger(yAxisTitleMargin),
@@ -578,11 +584,17 @@ export default function transformProps(
       },
       minorTick: { show: minorTicks },
       minInterval:
-        xAxisType === AxisType.Time && timeGrainSqla
+        xAxisType === AxisType.Time && timeGrainSqla && !forceMaxInterval
           ? TIMEGRAIN_TO_TIMESTAMP[
               timeGrainSqla as keyof typeof TIMEGRAIN_TO_TIMESTAMP
             ]
           : 0,
+      maxInterval:
+        xAxisType === AxisType.Time && timeGrainSqla && forceMaxInterval
+          ? TIMEGRAIN_TO_TIMESTAMP[
+              timeGrainSqla as keyof typeof TIMEGRAIN_TO_TIMESTAMP
+            ]
+          : undefined,
       ...getMinAndMaxFromBounds(
         xAxisType,
         truncateXAxis,
@@ -713,6 +725,8 @@ export default function transformProps(
         showLegend,
         theme,
         zoomable,
+        legendState,
+        chartPadding,
       ),
       // @ts-ignore
       data: series
@@ -722,7 +736,11 @@ export default function transformProps(
             ForecastSeriesEnum.Observation,
         )
         .map(entry => entry.id || entry.name || '')
-        .concat(extractAnnotationLabels(annotationLayers)),
+        .concat(extractAnnotationLabels(annotationLayers))
+        .sort((a: string, b: string) => {
+          if (!legendSort) return 0;
+          return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+        }),
     },
     series: dedupSeries(reorderForecastSeries(series) as SeriesOption[]),
     toolbox: {

superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/types.ts

@@ -57,6 +57,7 @@ export type EchartsMixedTimeseriesFormData = QueryFormData & {
   truncateYAxis: boolean;
   truncateYAxisSecondary: boolean;
   timeGrainSqla?: TimeGranularity;
+  forceMaxInterval?: boolean;
   tooltipTimeFormat?: string;
   zoomable: boolean;
   richTooltip: boolean;

superset-frontend/plugins/plugin-chart-echarts/src/Pie/controlPanel.tsx

@@ -29,7 +29,7 @@ import {
   sharedControls,
 } from '@superset-ui/chart-controls';
 import { DEFAULT_FORM_DATA } from './types';
-import { legendSection, legendSortControl } from '../controls';
+import { legendSection } from '../controls';
 
 const {
   donut,
@@ -119,7 +119,6 @@ const config: ControlPanelConfig = {
           },
         ],
         ...legendSection,
-        [legendSortControl],
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Labels')}</ControlSubSectionHeader>],
         [

superset-frontend/plugins/plugin-chart-echarts/src/Pie/types.ts

@@ -40,7 +40,6 @@ export type EchartsPieFormData = QueryFormData &
     labelType: EchartsPieLabelType;
     labelTemplate: string | null;
     labelsOutside: boolean;
-    legendSort: 'asc' | 'desc' | null;
     metric?: string;
     outerRadius: number;
     showLabels: boolean;

superset-frontend/plugins/plugin-chart-echarts/src/Radar/transformProps.ts

@@ -116,6 +116,7 @@ export default function transformProps(
     dateFormat,
     showLabels,
     showLegend,
+    legendSort,
     isCircle,
     columnConfig,
     sliceId,
@@ -354,7 +355,10 @@ export default function transformProps(
     },
     legend: {
       ...getLegendProps(legendType, legendOrientation, showLegend, theme),
-      data: Array.from(columnsLabelMap.keys()),
+      data: Array.from(columnsLabelMap.keys()).sort((a: string, b: string) => {
+        if (!legendSort) return 0;
+        return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+      }),
     },
     series,
     radar: {

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx

@@ -41,6 +41,7 @@ import {
   truncateXAxis,
   xAxisBounds,
   minorTicks,
+  forceMaxInterval,
 } from '../../controls';
 import { AreaChartStackControlOptions } from '../../constants';
 
@@ -185,6 +186,7 @@ const config: ControlPanelConfig = {
         ],
         [xAxisLabelRotation],
         [xAxisLabelInterval],
+        [forceMaxInterval],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx

@@ -39,6 +39,7 @@ import {
   xAxisBounds,
   xAxisLabelRotation,
   xAxisLabelInterval,
+  forceMaxInterval,
 } from '../../../controls';
 
 import { OrientationType } from '../../types';
@@ -364,6 +365,7 @@ const config: ControlPanelConfig = {
         ...createAxisControl('x'),
         [truncateXAxis],
         [xAxisBounds],
+        [forceMaxInterval],
         ...richTooltipSection,
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],
         ...createAxisControl('y'),

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx

@@ -42,6 +42,7 @@ import {
   xAxisBounds,
   xAxisLabelRotation,
   xAxisLabelInterval,
+  forceMaxInterval,
 } from '../../../controls';
 
 const {
@@ -173,6 +174,7 @@ const config: ControlPanelConfig = {
         ],
         [xAxisLabelRotation],
         [xAxisLabelInterval],
+        [forceMaxInterval],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx

@@ -41,6 +41,7 @@ import {
   xAxisBounds,
   xAxisLabelRotation,
   xAxisLabelInterval,
+  forceMaxInterval,
 } from '../../../controls';
 
 const {
@@ -116,6 +117,7 @@ const config: ControlPanelConfig = {
         ],
         [xAxisLabelRotation],
         [xAxisLabelInterval],
+        [forceMaxInterval],
         // eslint-disable-next-line react/jsx-key
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/SmoothLine/controlPanel.tsx

@@ -41,6 +41,7 @@ import {
   xAxisBounds,
   xAxisLabelRotation,
   xAxisLabelInterval,
+  forceMaxInterval,
 } from '../../../controls';
 
 const {
@@ -115,6 +116,7 @@ const config: ControlPanelConfig = {
         ],
         [xAxisLabelRotation],
         [xAxisLabelInterval],
+        [forceMaxInterval],
         // eslint-disable-next-line react/jsx-key
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx

@@ -39,6 +39,7 @@ import {
   xAxisBounds,
   xAxisLabelRotation,
   xAxisLabelInterval,
+  forceMaxInterval,
 } from '../../controls';
 
 const {
@@ -167,6 +168,7 @@ const config: ControlPanelConfig = {
         ],
         [xAxisLabelRotation],
         [xAxisLabelInterval],
+        [forceMaxInterval],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts

@@ -149,6 +149,7 @@ export default function transformProps(
     legendOrientation,
     legendType,
     legendMargin,
+    legendSort,
     logAxis,
     markerEnabled,
     markerSize,
@@ -167,6 +168,7 @@ export default function transformProps(
     sortSeriesType,
     sortSeriesAscending,
     timeGrainSqla,
+    forceMaxInterval,
     timeCompare,
     timeShiftColor,
     stack,
@@ -509,11 +511,17 @@ export default function transformProps(
     },
     minorTick: { show: minorTicks },
     minInterval:
-      xAxisType === AxisType.Time && timeGrainSqla
+      xAxisType === AxisType.Time && timeGrainSqla && !forceMaxInterval
         ? TIMEGRAIN_TO_TIMESTAMP[
             timeGrainSqla as keyof typeof TIMEGRAIN_TO_TIMESTAMP
           ]
         : 0,
+    maxInterval:
+      xAxisType === AxisType.Time && timeGrainSqla && forceMaxInterval
+        ? TIMEGRAIN_TO_TIMESTAMP[
+            timeGrainSqla as keyof typeof TIMEGRAIN_TO_TIMESTAMP
+          ]
+        : undefined,
     ...getMinAndMaxFromBounds(
       xAxisType,
       truncateXAxis,
@@ -646,7 +654,10 @@ export default function transformProps(
         padding,
       ),
       scrollDataIndex: legendIndex || 0,
-      data: legendData as string[],
+      data: legendData.sort((a: string, b: string) => {
+        if (!legendSort) return 0;
+        return legendSort === 'asc' ? a.localeCompare(b) : b.localeCompare(a);
+      }) as string[],
     },
     series: dedupSeries(reorderForecastSeries(series) as SeriesOption[]),
     toolbox: {

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformers.ts

@@ -25,6 +25,7 @@ import {
   FilterState,
   FormulaAnnotationLayer,
   IntervalAnnotationLayer,
+  isThemeDark,
   LegendState,
   SupersetTheme,
   TimeseriesAnnotationLayer,
@@ -137,6 +138,33 @@ export const getBaselineSeriesForStream = (
   };
 };
 
+export function transformNegativeLabelsPosition(
+  series: SeriesOption,
+  isHorizontal: boolean,
+): TimeseriesDataRecord[] {
+  /*
+   * Adjusts label position for negative values in bar series
+   * @param series - Array of series options
+   * @param isHorizontal - Whether chart is horizontal
+   * @returns data with adjusted label positions for negative values
+   */
+  const transformValue = (value: any) => {
+    const [xValue, yValue] = Array.isArray(value) ? value : [null, null];
+    const axisValue = isHorizontal ? xValue : yValue;
+
+    return axisValue < 0
+      ? {
+          value,
+          label: {
+            position: 'outside',
+          },
+        }
+      : value;
+  };
+
+  return (series.data as TimeseriesDataRecord[]).map(transformValue);
+}
+
 export function transformSeries(
   series: SeriesOption,
   colorScale: CategoricalColorScale,
@@ -246,6 +274,9 @@ export function transformSeries(
   } else {
     plotType = seriesType === 'bar' ? 'bar' : 'line';
   }
+
+  const isDarkMode = theme ? isThemeDark(theme) : false;
+
   /**
    * if timeShiftColor is enabled the colorScaleKey forces the color to be the
    * same as the original series, otherwise uses separate colors
@@ -289,6 +320,12 @@ export function transformSeries(
     isConfidenceBand || (stack === StackControlsValue.Stream && area)
       ? { ...opts.lineStyle, opacity: OpacityEnum.Transparent }
       : { ...opts.lineStyle, opacity };
+
+  // Use filled circles in dark mode to avoid the white fill issue with hollow circles
+  // Use emptyCircle explicitly in light mode
+  const symbol =
+    plotType === 'line' ? (isDarkMode ? 'circle' : 'emptyCircle') : undefined;
+
   return {
     ...series,
     ...(Array.isArray(data) && seriesType === 'bar' && !stack
@@ -321,6 +358,7 @@ export function transformSeries(
         : undefined,
     emphasis,
     showSymbol,
+    symbol,
     symbolSize: markerSize,
     label: {
       show: !!showValue,
@@ -637,30 +675,3 @@ export function getPadding(
     isHorizontal,
   );
 }
-
-export function transformNegativeLabelsPosition(
-  series: SeriesOption,
-  isHorizontal: boolean,
-): TimeseriesDataRecord[] {
-  /*
-   * Adjusts label position for negative values in bar series
-   * @param series - Array of series options
-   * @param isHorizontal - Whether chart is horizontal
-   * @returns data with adjusted label positions for negative values
-   */
-  const transformValue = (value: any) => {
-    const [xValue, yValue] = Array.isArray(value) ? value : [null, null];
-    const axisValue = isHorizontal ? xValue : yValue;
-
-    return axisValue < 0
-      ? {
-          value,
-          label: {
-            position: 'outside',
-          },
-        }
-      : value;
-  };
-
-  return (series.data as TimeseriesDataRecord[]).map(transformValue);
-}

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/types.ts

@@ -85,6 +85,7 @@ export type EchartsTimeseriesFormData = QueryFormData & {
   xAxisForceCategorical?: boolean;
   xAxisTimeFormat?: string;
   timeGrainSqla?: TimeGranularity;
+  forceMaxInterval?: boolean;
   xAxisBounds: [number | undefined | null, number | undefined | null];
   yAxisBounds: [number | undefined | null, number | undefined | null];
   zoomable: boolean;

superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx

@@ -204,6 +204,12 @@ function Echart(
           },
           legend: {
             textStyle: { color: antdTheme.colorTextSecondary },
+            pageTextStyle: {
+              color: antdTheme.colorTextSecondary,
+            },
+            pageIconColor: antdTheme.colorTextSecondary,
+            pageIconInactiveColor: antdTheme.colorTextDisabled,
+            inactiveColor: antdTheme.colorTextDisabled,
           },
           tooltip: {
             backgroundColor: antdTheme.colorBgContainer,

superset-frontend/plugins/plugin-chart-echarts/src/constants.ts

@@ -103,6 +103,7 @@ export const DEFAULT_LEGEND_FORM_DATA: LegendFormData = {
   legendOrientation: LegendOrientation.Top,
   legendType: LegendType.Scroll,
   showLegend: true,
+  legendSort: null,
 };
 
 export const DEFAULT_TITLE_FORM_DATA: TitleFormData = {

superset-frontend/plugins/plugin-chart-echarts/src/controls.tsx

@@ -121,6 +121,7 @@ export const legendSection: ControlSetRow[] = [
   [legendTypeControl],
   [legendOrientationControl],
   [legendMarginControl],
+  [legendSortControl],
 ];
 
 export const showValueControl: ControlSetItem = {
@@ -337,6 +338,21 @@ export const xAxisLabelInterval = {
   },
 };
 
+export const forceMaxInterval = {
+  name: 'force_max_interval',
+  config: {
+    type: 'CheckboxControl',
+    label: t('Force Time Grain as Max Interval'),
+    renderTrigger: true,
+    default: false,
+    description: t(
+      'Forces selected Time Grain as the maximum interval for X Axis Labels',
+    ),
+    visibility: ({ controls }: ControlPanelsContainerProps) =>
+      Boolean(controls?.time_grain_sqla?.value),
+  },
+};
+
 export const seriesOrderSection: ControlSetRow[] = [
   [<ControlSubSectionHeader>{t('Series Order')}</ControlSubSectionHeader>],
   [sortSeriesType],

superset-frontend/plugins/plugin-chart-echarts/src/types.ts

@@ -98,6 +98,7 @@ export type LegendFormData = {
   legendOrientation: LegendOrientation;
   legendType: LegendType;
   showLegend: boolean;
+  legendSort: 'asc' | 'desc' | null;
 };
 
 export type EventHandlers = Record<string, { (props: any): void }>;

superset-frontend/plugins/plugin-chart-echarts/src/utils/eventHandlers.ts

@@ -54,7 +54,9 @@ const getCrossFilterDataMask =
       values = [value];
     }
 
-    const groupbyValues = values.map(value => labelMap[value]);
+    const groupbyValues = values
+      .map(value => labelMap[value])
+      .filter(Boolean) as string[][];
 
     return {
       dataMask: {
@@ -122,6 +124,9 @@ export const contextMenuEventHandler =
       const drillFilters: BinaryQueryObjectFilterClause[] = [];
       if (groupby.length > 0) {
         const values = labelMap[e.name];
+        if (!values) {
+          return;
+        }
         groupby.forEach((dimension, i) => {
           drillFilters.push({
             col: dimension,

superset-frontend/plugins/plugin-chart-echarts/test/BoxPlot/transformProps.test.ts

@@ -31,6 +31,7 @@ describe('BoxPlot transformProps', () => {
     whiskerOptions: 'Tukey',
     yAxisFormat: 'SMART_NUMBER',
     viz_type: 'my_chart',
+    zoomable: true,
   };
   const chartProps = new ChartProps({
     formData,
@@ -75,6 +76,13 @@ describe('BoxPlot transformProps', () => {
         width: 800,
         height: 600,
         echartOptions: expect.objectContaining({
+          dataZoom: expect.arrayContaining([
+            {
+              moveOnMouseWheel: true,
+              type: 'inside',
+              zoomOnMouseWheel: false,
+            },
+          ]),
           series: expect.arrayContaining([
             expect.objectContaining({
               name: 'boxplot',

superset-frontend/plugins/plugin-chart-echarts/test/Bubble/transformProps.test.ts

@@ -27,62 +27,65 @@ import { EchartsBubbleChartProps } from 'plugins/plugin-chart-echarts/src/Bubble
 
 import transformProps, { formatTooltip } from '../../src/Bubble/transformProps';
 
-describe('Bubble transformProps', () => {
-  const defaultFormData: SqlaFormData = {
-    datasource: '1__table',
-    viz_type: 'echarts_bubble',
-    entity: 'customer_name',
-    x: 'count',
-    y: {
-      aggregate: 'sum',
-      column: {
-        column_name: 'price_each',
-      },
-      expressionType: 'simple',
-      label: 'SUM(price_each)',
+const defaultFormData: SqlaFormData = {
+  datasource: '1__table',
+  viz_type: 'echarts_bubble',
+  entity: 'customer_name',
+  x: 'count',
+  y: {
+    aggregate: 'sum',
+    column: {
+      column_name: 'price_each',
     },
-    size: {
-      aggregate: 'sum',
-      column: {
-        column_name: 'sales',
-      },
-      expressionType: 'simple',
-      label: 'SUM(sales)',
+    expressionType: 'simple',
+    label: 'SUM(price_each)',
+  },
+  size: {
+    aggregate: 'sum',
+    column: {
+      column_name: 'sales',
     },
-    xAxisBounds: [null, null],
-    yAxisBounds: [null, null],
-  };
-  const chartConfig: ChartPropsConfig = {
-    formData: defaultFormData,
-    height: 800,
-    width: 800,
-    queriesData: [
+    expressionType: 'simple',
+    label: 'SUM(sales)',
+  },
+  xAxisBounds: [null, null],
+  yAxisBounds: [null, null],
+};
+
+const queriesData = [
+  {
+    data: [
       {
-        data: [
-          {
-            customer_name: 'AV Stores, Co.',
-            count: 10,
-            'SUM(price_each)': 20,
-            'SUM(sales)': 30,
-          },
-          {
-            customer_name: 'Alpha Cognac',
-            count: 40,
-            'SUM(price_each)': 50,
-            'SUM(sales)': 60,
-          },
-          {
-            customer_name: 'Amica Models & Co.',
-            count: 70,
-            'SUM(price_each)': 80,
-            'SUM(sales)': 90,
-          },
-        ],
+        customer_name: 'AV Stores, Co.',
+        count: 10,
+        'SUM(price_each)': 20,
+        'SUM(sales)': 30,
+      },
+      {
+        customer_name: 'Alpha Cognac',
+        count: 40,
+        'SUM(price_each)': 50,
+        'SUM(sales)': 60,
+      },
+      {
+        customer_name: 'Amica Models & Co.',
+        count: 70,
+        'SUM(price_each)': 80,
+        'SUM(sales)': 90,
       },
     ],
-    theme: supersetTheme,
-  };
+  },
+];
 
+const chartConfig: ChartPropsConfig = {
+  formData: defaultFormData,
+  height: 800,
+  width: 800,
+  queriesData,
+  theme: supersetTheme,
+};
+
+describe('Bubble transformProps', () => {
   it('Should transform props for viz', () => {
     const chartProps = new ChartProps(chartConfig);
     expect(transformProps(chartProps as EchartsBubbleChartProps)).toEqual(
@@ -201,3 +204,49 @@ describe('Bubble formatTooltip', () => {
     expect(html).toContain('300.0%');
   });
 });
+
+describe('legend sorting', () => {
+  const createChartProps = (overrides = {}) =>
+    new ChartProps({
+      ...chartConfig,
+      formData: {
+        ...defaultFormData,
+        ...overrides,
+      },
+    });
+  it('preserves original data order when no sort specified', () => {
+    const props = createChartProps({ legendSort: null });
+    const result = transformProps(props as EchartsBubbleChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual([
+      'AV Stores, Co.',
+      'Alpha Cognac',
+      'Amica Models & Co.',
+    ]);
+  });
+
+  it('sorts alphabetically ascending when legendSort is "asc"', () => {
+    const props = createChartProps({ legendSort: 'asc' });
+    const result = transformProps(props as EchartsBubbleChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual([
+      'Alpha Cognac',
+      'Amica Models & Co.',
+      'AV Stores, Co.',
+    ]);
+  });
+
+  it('sorts alphabetically descending when legendSort is "desc"', () => {
+    const props = createChartProps({ legendSort: 'desc' });
+    const result = transformProps(props as EchartsBubbleChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual([
+      'AV Stores, Co.',
+      'Amica Models & Co.',
+      'Alpha Cognac',
+    ]);
+  });
+});

superset-frontend/plugins/plugin-chart-echarts/test/Funnel/transformProps.test.ts

@@ -27,29 +27,30 @@ import {
   PercentCalcType,
 } from '../../src/Funnel/types';
 
-describe('Funnel transformProps', () => {
-  const formData = {
-    colorScheme: 'bnbColors',
-    datasource: '3__table',
-    granularity_sqla: 'ds',
-    metric: 'sum__num',
-    groupby: ['foo', 'bar'],
-  };
-  const chartProps = new ChartProps({
-    formData,
-    width: 800,
-    height: 600,
-    queriesData: [
-      {
-        data: [
-          { foo: 'Sylvester', bar: 1, sum__num: 10 },
-          { foo: 'Arnold', bar: 2, sum__num: 2.5 },
-        ],
-      },
+const formData = {
+  colorScheme: 'bnbColors',
+  datasource: '3__table',
+  granularity_sqla: 'ds',
+  metric: 'sum__num',
+  groupby: ['foo', 'bar'],
+};
+const queriesData = [
+  {
+    data: [
+      { foo: 'Sylvester', bar: 1, sum__num: 10 },
+      { foo: 'Arnold', bar: 2, sum__num: 2.5 },
     ],
-    theme: supersetTheme,
-  });
+  },
+];
+const chartProps = new ChartProps({
+  formData,
+  width: 800,
+  height: 600,
+  queriesData,
+  theme: supersetTheme,
+});
 
+describe('Funnel transformProps', () => {
   it('should transform chart props for viz', () => {
     expect(transformProps(chartProps as EchartsFunnelChartProps)).toEqual(
       expect.objectContaining({
@@ -123,3 +124,49 @@ describe('formatFunnelLabel', () => {
     ).toEqual(['<NULL>', '1.23k', '12.34%']);
   });
 });
+
+describe('legend sorting', () => {
+  const legendQueriesData = [
+    {
+      data: [
+        { foo: 'Sylvester', sum__num: 10 },
+        { foo: 'Arnold', sum__num: 2.5 },
+        { foo: 'Mark', sum__num: 13 },
+      ],
+    },
+  ];
+  const createChartProps = (overrides = {}) =>
+    new ChartProps({
+      ...chartProps,
+      formData: {
+        ...formData,
+        groupby: ['foo'],
+        ...overrides,
+      },
+      queriesData: legendQueriesData,
+    });
+
+  it('preserves original data order when no sort specified', () => {
+    const props = createChartProps({ legendSort: null });
+    const result = transformProps(props as EchartsFunnelChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual(['Sylvester', 'Arnold', 'Mark']);
+  });
+
+  it('sorts alphabetically ascending when legendSort is "asc"', () => {
+    const props = createChartProps({ legendSort: 'asc' });
+    const result = transformProps(props as EchartsFunnelChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual(['Arnold', 'Mark', 'Sylvester']);
+  });
+
+  it('sorts alphabetically descending when legendSort is "desc"', () => {
+    const props = createChartProps({ legendSort: 'desc' });
+    const result = transformProps(props as EchartsFunnelChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual(['Sylvester', 'Mark', 'Arnold']);
+  });
+});

superset-frontend/plugins/plugin-chart-echarts/test/Gantt/transformProps.test.ts

@@ -27,63 +27,64 @@ import {
   EchartsGanttFormData,
 } from '../../src/Gantt/types';
 
+const formData: EchartsGanttFormData = {
+  viz_type: 'gantt_chart',
+  datasource: '1__table',
+
+  startTime: 'startTime',
+  endTime: 'endTime',
+  yAxis: {
+    label: 'Y Axis',
+    sqlExpression: 'y_axis',
+    expressionType: 'SQL',
+  },
+  tooltipMetrics: ['tooltip_metric'],
+  tooltipColumns: ['tooltip_column'],
+  series: 'series',
+  xAxisTimeFormat: '%H:%M',
+  tooltipTimeFormat: '%H:%M',
+  tooltipValuesFormat: 'DURATION_SEC',
+  colorScheme: 'bnbColors',
+  zoomable: true,
+  xAxisTitleMargin: undefined,
+  yAxisTitleMargin: undefined,
+  xAxisTimeBounds: [null, '19:00:00'],
+  subcategories: true,
+  legendMargin: 0,
+  legendOrientation: LegendOrientation.Top,
+  legendType: LegendType.Scroll,
+  showLegend: true,
+  sortSeriesAscending: true,
+  legendSort: null,
+};
+const queriesData = [
+  {
+    data: [
+      {
+        startTime: Date.UTC(2025, 1, 1, 13, 0, 0),
+        endTime: Date.UTC(2025, 1, 1, 14, 0, 0),
+        'Y Axis': 'first',
+        tooltip_column: 'tooltip value 1',
+        series: 'series value 1',
+      },
+      {
+        startTime: Date.UTC(2025, 1, 1, 18, 0, 0),
+        endTime: Date.UTC(2025, 1, 1, 20, 0, 0),
+        'Y Axis': 'second',
+        tooltip_column: 'tooltip value 2',
+        series: 'series value 2',
+      },
+    ],
+    colnames: ['startTime', 'endTime', 'Y Axis', 'tooltip_column', 'series'],
+  },
+];
+const chartPropsConfig = {
+  formData,
+  queriesData,
+  theme: supersetTheme,
+};
+
 describe('Gantt transformProps', () => {
-  const formData: EchartsGanttFormData = {
-    viz_type: 'gantt_chart',
-    datasource: '1__table',
-
-    startTime: 'startTime',
-    endTime: 'endTime',
-    yAxis: {
-      label: 'Y Axis',
-      sqlExpression: 'y_axis',
-      expressionType: 'SQL',
-    },
-    tooltipMetrics: ['tooltip_metric'],
-    tooltipColumns: ['tooltip_column'],
-    series: 'series',
-    xAxisTimeFormat: '%H:%M',
-    tooltipTimeFormat: '%H:%M',
-    tooltipValuesFormat: 'DURATION_SEC',
-    colorScheme: 'bnbColors',
-    zoomable: true,
-    xAxisTitleMargin: undefined,
-    yAxisTitleMargin: undefined,
-    xAxisTimeBounds: [null, '19:00:00'],
-    subcategories: true,
-    legendMargin: 0,
-    legendOrientation: LegendOrientation.Top,
-    legendType: LegendType.Scroll,
-    showLegend: true,
-    sortSeriesAscending: true,
-  };
-  const queriesData = [
-    {
-      data: [
-        {
-          startTime: Date.UTC(2025, 1, 1, 13, 0, 0),
-          endTime: Date.UTC(2025, 1, 1, 14, 0, 0),
-          'Y Axis': 'first',
-          tooltip_column: 'tooltip value 1',
-          series: 'series value 1',
-        },
-        {
-          startTime: Date.UTC(2025, 1, 1, 18, 0, 0),
-          endTime: Date.UTC(2025, 1, 1, 20, 0, 0),
-          'Y Axis': 'second',
-          tooltip_column: 'tooltip value 2',
-          series: 'series value 2',
-        },
-      ],
-      colnames: ['startTime', 'endTime', 'Y Axis', 'tooltip_column', 'series'],
-    },
-  ];
-  const chartPropsConfig = {
-    formData,
-    queriesData,
-    theme: supersetTheme,
-  };
-
   it('should transform chart props', () => {
     const chartProps = new ChartProps(chartPropsConfig);
     const transformedProps = transformProps(
@@ -267,3 +268,38 @@ describe('Gantt transformProps', () => {
     });
   });
 });
+
+describe('legend sorting', () => {
+  const createChartProps = (overrides = {}) =>
+    new ChartProps({
+      ...chartPropsConfig,
+      formData: {
+        ...formData,
+        ...overrides,
+      },
+    });
+
+  it('preserves original data order when no sort specified', () => {
+    const props = createChartProps({ legendSort: null });
+    const result = transformProps(props as EchartsGanttChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual(['series value 1', 'series value 2']);
+  });
+
+  it('sorts alphabetically ascending when legendSort is "asc"', () => {
+    const props = createChartProps({ legendSort: 'asc' });
+    const result = transformProps(props as EchartsGanttChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual(['series value 1', 'series value 2']);
+  });
+
+  it('sorts alphabetically descending when legendSort is "desc"', () => {
+    const props = createChartProps({ legendSort: 'desc' });
+    const result = transformProps(props as EchartsGanttChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual(['series value 2', 'series value 1']);
+  });
+});

superset-frontend/plugins/plugin-chart-echarts/test/Graph/transformProps.test.ts

@@ -21,43 +21,43 @@ import transformProps from '../../src/Graph/transformProps';
 import { DEFAULT_GRAPH_SERIES_OPTION } from '../../src/Graph/constants';
 import { EchartsGraphChartProps } from '../../src/Graph/types';
 
+const formData: SqlaFormData = {
+  colorScheme: 'bnbColors',
+  datasource: '3__table',
+  granularity_sqla: 'ds',
+  metric: 'count',
+  source: 'source_column',
+  target: 'target_column',
+  category: null,
+  viz_type: 'graph',
+};
+const queriesData = [
+  {
+    colnames: ['source_column', 'target_column', 'count'],
+    data: [
+      {
+        source_column: 'source_value_1',
+        target_column: 'target_value_1',
+        count: 6,
+      },
+      {
+        source_column: 'source_value_2',
+        target_column: 'target_value_2',
+        count: 5,
+      },
+    ],
+  },
+];
+const chartPropsConfig = {
+  formData,
+  width: 800,
+  height: 600,
+  queriesData,
+  theme: supersetTheme,
+};
+
 describe('EchartsGraph transformProps', () => {
   it('should transform chart props for viz without category', () => {
-    const formData: SqlaFormData = {
-      colorScheme: 'bnbColors',
-      datasource: '3__table',
-      granularity_sqla: 'ds',
-      metric: 'count',
-      source: 'source_column',
-      target: 'target_column',
-      category: null,
-      viz_type: 'graph',
-    };
-    const queriesData = [
-      {
-        colnames: ['source_column', 'target_column', 'count'],
-        data: [
-          {
-            source_column: 'source_value_1',
-            target_column: 'target_value_1',
-            count: 6,
-          },
-          {
-            source_column: 'source_value_2',
-            target_column: 'target_value_2',
-            count: 5,
-          },
-        ],
-      },
-    ];
-    const chartPropsConfig = {
-      formData,
-      width: 800,
-      height: 600,
-      queriesData,
-      theme: supersetTheme,
-    };
-
     const chartProps = new ChartProps(chartPropsConfig);
     expect(transformProps(chartProps as EchartsGraphChartProps)).toEqual(
       expect.objectContaining({
@@ -263,3 +263,91 @@ describe('EchartsGraph transformProps', () => {
     );
   });
 });
+
+describe('legend sorting', () => {
+  const queriesData = [
+    {
+      colnames: [
+        'source_column',
+        'target_column',
+        'source_category_column',
+        'target_category_column',
+        'count',
+      ],
+      data: [
+        {
+          source_column: 'source_value',
+          target_column: 'target_value',
+          source_category_column: 'category_value_1',
+          target_category_column: 'category_value_3',
+          count: 6,
+        },
+        {
+          source_column: 'source_value',
+          target_column: 'target_value',
+          source_category_column: 'category_value_3',
+          target_category_column: 'category_value_2',
+          count: 5,
+        },
+        {
+          source_column: 'source_value',
+          target_column: 'target_value',
+          source_category_column: 'category_value_2',
+          target_category_column: 'category_value_1',
+          count: 4,
+        },
+      ],
+    },
+  ];
+
+  const getChartProps = (overrides = {}) =>
+    new ChartProps({
+      ...chartPropsConfig,
+      formData: {
+        ...formData,
+        ...overrides,
+        sourceCategory: 'source_category_column',
+        targetCategory: 'target_category_column',
+      },
+      queriesData,
+    });
+
+  it('sort legend by data', () => {
+    const chartProps = getChartProps({
+      legendSort: null,
+    });
+    const transformed = transformProps(chartProps as EchartsGraphChartProps);
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'category_value_1',
+      'category_value_3',
+      'category_value_2',
+    ]);
+  });
+
+  it('sort legend by label ascending', () => {
+    const chartProps = getChartProps({
+      legendSort: 'asc',
+    });
+    const transformed = transformProps(chartProps as EchartsGraphChartProps);
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'category_value_1',
+      'category_value_2',
+      'category_value_3',
+    ]);
+  });
+
+  it('sort legend by label descending', () => {
+    const chartProps = getChartProps({
+      legendSort: 'desc',
+    });
+    const transformed = transformProps(chartProps as EchartsGraphChartProps);
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'category_value_3',
+      'category_value_2',
+      'category_value_1',
+    ]);
+  });
+});

superset-frontend/plugins/plugin-chart-echarts/test/MixedTimeseries/transformProps.test.ts

@@ -81,6 +81,7 @@ const formData: EchartsMixedTimeseriesFormData = {
   forecastPeriods: [],
   forecastInterval: 0,
   forecastSeasonalityDaily: 0,
+  legendSort: null,
 };
 
 const queriesData = [
@@ -137,6 +138,24 @@ it('should transform chart props for viz with showQueryIdentifiers=false', () =>
   expect(seriesIds).not.toContain('sum__num (Query A), boy');
   expect(seriesIds).not.toContain('sum__num (Query B), girl');
   expect(seriesIds).not.toContain('sum__num (Query B), boy');
+
+  // Check that series name include query identifiers
+  const seriesName = (transformed.echartOptions.series as any[]).map(
+    (s: any) => s.name,
+  );
+  expect(seriesName).toContain('sum__num, girl');
+  expect(seriesName).toContain('sum__num, boy');
+  expect(seriesName).not.toContain('sum__num (Query A), girl');
+  expect(seriesName).not.toContain('sum__num (Query A), boy');
+  expect(seriesName).not.toContain('sum__num (Query B), girl');
+  expect(seriesName).not.toContain('sum__num (Query B), boy');
+
+  expect((transformed.echartOptions.legend as any).data).toEqual([
+    'sum__num, girl',
+    'sum__num, boy',
+    'sum__num, girl',
+    'sum__num, boy',
+  ]);
 });
 
 it('should transform chart props for viz with showQueryIdentifiers=true', () => {
@@ -160,4 +179,145 @@ it('should transform chart props for viz with showQueryIdentifiers=true', () =>
   expect(seriesIds).toContain('sum__num (Query B), boy');
   expect(seriesIds).not.toContain('sum__num, girl');
   expect(seriesIds).not.toContain('sum__num, boy');
+
+  // Check that series name include query identifiers
+  const seriesName = (transformed.echartOptions.series as any[]).map(
+    (s: any) => s.name,
+  );
+  expect(seriesName).toContain('sum__num (Query A), girl');
+  expect(seriesName).toContain('sum__num (Query A), boy');
+  expect(seriesName).toContain('sum__num (Query B), girl');
+  expect(seriesName).toContain('sum__num (Query B), boy');
+  expect(seriesName).not.toContain('sum__num, girl');
+  expect(seriesName).not.toContain('sum__num, boy');
+
+  expect((transformed.echartOptions.legend as any).data).toEqual([
+    'sum__num (Query A), girl',
+    'sum__num (Query A), boy',
+    'sum__num (Query B), girl',
+    'sum__num (Query B), boy',
+  ]);
+});
+
+describe('legend sorting', () => {
+  const getChartProps = (overrides = {}) =>
+    new ChartProps({
+      ...chartPropsConfig,
+      formData: {
+        ...formData,
+        ...overrides,
+        showQueryIdentifiers: true,
+      },
+    });
+
+  it('sort legend by data', () => {
+    const chartProps = getChartProps({
+      legendSort: null,
+    });
+    const transformed = transformProps(
+      chartProps as EchartsMixedTimeseriesProps,
+    );
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'sum__num (Query A), girl',
+      'sum__num (Query A), boy',
+      'sum__num (Query B), girl',
+      'sum__num (Query B), boy',
+    ]);
+  });
+
+  it('sort legend by label ascending', () => {
+    const chartProps = getChartProps({
+      legendSort: 'asc',
+    });
+    const transformed = transformProps(
+      chartProps as EchartsMixedTimeseriesProps,
+    );
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'sum__num (Query A), boy',
+      'sum__num (Query A), girl',
+      'sum__num (Query B), boy',
+      'sum__num (Query B), girl',
+    ]);
+  });
+
+  it('sort legend by label descending', () => {
+    const chartProps = getChartProps({
+      legendSort: 'desc',
+    });
+    const transformed = transformProps(
+      chartProps as EchartsMixedTimeseriesProps,
+    );
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'sum__num (Query B), girl',
+      'sum__num (Query B), boy',
+      'sum__num (Query A), girl',
+      'sum__num (Query A), boy',
+    ]);
+  });
+});
+
+it('legend margin: top orientation sets grid.top correctly', () => {
+  const chartPropsConfigWithoutIdentifiers = {
+    ...chartPropsConfig,
+    formData: {
+      ...formData,
+      legendMargin: 250,
+      showLegend: true,
+    },
+  };
+  const chartProps = new ChartProps(chartPropsConfigWithoutIdentifiers);
+  const transformed = transformProps(chartProps as EchartsMixedTimeseriesProps);
+
+  expect((transformed.echartOptions.grid as any).top).toEqual(270);
+});
+
+it('legend margin: bottom orientation sets grid.bottom correctly', () => {
+  const chartPropsConfigWithoutIdentifiers = {
+    ...chartPropsConfig,
+    formData: {
+      ...formData,
+      legendMargin: 250,
+      showLegend: true,
+      legendOrientation: LegendOrientation.Bottom,
+    },
+  };
+  const chartProps = new ChartProps(chartPropsConfigWithoutIdentifiers);
+  const transformed = transformProps(chartProps as EchartsMixedTimeseriesProps);
+
+  expect((transformed.echartOptions.grid as any).bottom).toEqual(270);
+});
+
+it('legend margin: left orientation sets grid.left correctly', () => {
+  const chartPropsConfigWithoutIdentifiers = {
+    ...chartPropsConfig,
+    formData: {
+      ...formData,
+      legendMargin: 250,
+      showLegend: true,
+      legendOrientation: LegendOrientation.Left,
+    },
+  };
+  const chartProps = new ChartProps(chartPropsConfigWithoutIdentifiers);
+  const transformed = transformProps(chartProps as EchartsMixedTimeseriesProps);
+
+  expect((transformed.echartOptions.grid as any).left).toEqual(270);
+});
+
+it('legend margin: right orientation sets grid.right correctly', () => {
+  const chartPropsConfigWithoutIdentifiers = {
+    ...chartPropsConfig,
+    formData: {
+      ...formData,
+      legendMargin: 270,
+      showLegend: true,
+      legendOrientation: LegendOrientation.Right,
+    },
+  };
+  const chartProps = new ChartProps(chartPropsConfigWithoutIdentifiers);
+  const transformed = transformProps(chartProps as EchartsMixedTimeseriesProps);
+
+  expect((transformed.echartOptions.grid as any).right).toEqual(270);
 });

superset-frontend/plugins/plugin-chart-echarts/test/Pie/transformProps.test.ts

@@ -446,7 +446,7 @@ describe('Other category', () => {
   });
 });
 
-describe('Sort Legend', () => {
+describe('legend sorting', () => {
   const defaultFormData: SqlaFormData = {
     colorScheme: 'bnbColors',
     datasource: '3__table',

superset-frontend/plugins/plugin-chart-echarts/test/Radar/transformProps.test.ts

@@ -42,54 +42,56 @@ interface RadarSeriesData {
   name: string;
 }
 
-describe('Radar transformProps', () => {
-  const formData: Partial<EchartsRadarFormData> = {
-    colorScheme: 'supersetColors',
-    datasource: '3__table',
-    granularity_sqla: 'ds',
-    columnConfig: {
-      'MAX(na_sales)': {
-        radarMetricMaxValue: null,
-        radarMetricMinValue: 0,
-      },
-      'SUM(eu_sales)': {
-        radarMetricMaxValue: 5000,
-      },
+const formData: Partial<EchartsRadarFormData> = {
+  colorScheme: 'supersetColors',
+  datasource: '3__table',
+  granularity_sqla: 'ds',
+  columnConfig: {
+    'MAX(na_sales)': {
+      radarMetricMaxValue: null,
+      radarMetricMinValue: 0,
     },
-    groupby: [],
-    metrics: [
-      'MAX(na_sales)',
-      'SUM(jp_sales)',
-      'SUM(other_sales)',
-      'SUM(eu_sales)',
-    ],
-    viz_type: 'radar',
-    numberFormat: 'SMART_NUMBER',
-    dateFormat: 'smart_date',
-    showLegend: true,
-    showLabels: true,
-    isCircle: false,
-  };
+    'SUM(eu_sales)': {
+      radarMetricMaxValue: 5000,
+    },
+  },
+  groupby: [],
+  metrics: [
+    'MAX(na_sales)',
+    'SUM(jp_sales)',
+    'SUM(other_sales)',
+    'SUM(eu_sales)',
+  ],
+  viz_type: 'radar',
+  numberFormat: 'SMART_NUMBER',
+  dateFormat: 'smart_date',
+  showLegend: true,
+  showLabels: true,
+  isCircle: false,
+};
 
-  const chartProps = new ChartProps({
-    formData,
-    width: 800,
-    height: 600,
-    queriesData: [
+const queriesData = [
+  {
+    data: [
       {
-        data: [
-          {
-            'MAX(na_sales)': 41.49,
-            'SUM(jp_sales)': 1290.99,
-            'SUM(other_sales)': 797.73,
-            'SUM(eu_sales)': 2434.13,
-          },
-        ],
+        'MAX(na_sales)': 41.49,
+        'SUM(jp_sales)': 1290.99,
+        'SUM(other_sales)': 797.73,
+        'SUM(eu_sales)': 2434.13,
       },
     ],
-    theme: supersetTheme,
-  });
+  },
+];
 
+const chartProps = new ChartProps({
+  formData,
+  width: 800,
+  height: 600,
+  queriesData,
+  theme: supersetTheme,
+});
+
+describe('Radar transformProps', () => {
   it('should transform chart props for normalized radar chart & normalize all metrics except the ones with custom min & max', () => {
     const transformedProps = transformProps(
       chartProps as EchartsRadarChartProps,
@@ -125,3 +127,77 @@ describe('Radar transformProps', () => {
     ]);
   });
 });
+
+describe('legend sorting', () => {
+  const legendSortData = [
+    {
+      data: [
+        {
+          name: 'Sylvester sales',
+          'SUM(jp_sales)': 1290.99,
+          'SUM(other_sales)': 797.73,
+          'SUM(eu_sales)': 2434.13,
+        },
+        {
+          name: 'Arnold sales',
+          'SUM(jp_sales)': 290.99,
+          'SUM(other_sales)': 627.73,
+          'SUM(eu_sales)': 434.13,
+        },
+        {
+          name: 'Mark sales',
+          'SUM(jp_sales)': 2290.99,
+          'SUM(other_sales)': 1297.73,
+          'SUM(eu_sales)': 934.13,
+        },
+      ],
+    },
+  ];
+  const createChartProps = (overrides = {}) =>
+    new ChartProps({
+      ...chartProps,
+      formData: {
+        ...formData,
+        groupby: ['name'],
+        metrics: ['SUM(jp_sales)', 'SUM(other_sales)', 'SUM(eu_sales)'],
+        ...overrides,
+      },
+      queriesData: legendSortData,
+    });
+
+  it('preserves original data order when no sort specified', () => {
+    const props = createChartProps({ legendSort: null });
+    const result = transformProps(props as EchartsRadarChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual([
+      'Sylvester sales',
+      'Arnold sales',
+      'Mark sales',
+    ]);
+  });
+
+  it('sorts alphabetically ascending when legendSort is "asc"', () => {
+    const props = createChartProps({ legendSort: 'asc' });
+    const result = transformProps(props as EchartsRadarChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual([
+      'Arnold sales',
+      'Mark sales',
+      'Sylvester sales',
+    ]);
+  });
+
+  it('sorts alphabetically descending when legendSort is "desc"', () => {
+    const props = createChartProps({ legendSort: 'desc' });
+    const result = transformProps(props as EchartsRadarChartProps);
+
+    const legendData = (result.echartOptions.legend as any).data;
+    expect(legendData).toEqual([
+      'Sylvester sales',
+      'Mark sales',
+      'Arnold sales',
+    ]);
+  });
+});

superset-frontend/plugins/plugin-chart-echarts/test/Timeseries/transformProps.test.ts

@@ -31,31 +31,31 @@ import {
 import { EchartsTimeseriesChartProps } from '../../src/types';
 import transformProps from '../../src/Timeseries/transformProps';
 
-describe('EchartsTimeseries transformProps', () => {
-  const formData: SqlaFormData = {
-    colorScheme: 'bnbColors',
-    datasource: '3__table',
-    granularity_sqla: 'ds',
-    metric: 'sum__num',
-    groupby: ['foo', 'bar'],
-    viz_type: 'my_viz',
-  };
-  const queriesData = [
-    {
-      data: [
-        { 'San Francisco': 1, 'New York': 2, __timestamp: 599616000000 },
-        { 'San Francisco': 3, 'New York': 4, __timestamp: 599916000000 },
-      ],
-    },
-  ];
-  const chartPropsConfig = {
-    formData,
-    width: 800,
-    height: 600,
-    queriesData,
-    theme: supersetTheme,
-  };
+const formData: SqlaFormData = {
+  colorScheme: 'bnbColors',
+  datasource: '3__table',
+  granularity_sqla: 'ds',
+  metric: 'sum__num',
+  groupby: ['foo', 'bar'],
+  viz_type: 'my_viz',
+};
+const queriesData = [
+  {
+    data: [
+      { 'San Francisco': 1, 'New York': 2, __timestamp: 599616000000 },
+      { 'San Francisco': 3, 'New York': 4, __timestamp: 599916000000 },
+    ],
+  },
+];
+const chartPropsConfig = {
+  formData,
+  width: 800,
+  height: 600,
+  queriesData,
+  theme: supersetTheme,
+};
 
+describe('EchartsTimeseries transformProps', () => {
   it('should transform chart props for viz', () => {
     const chartProps = new ChartProps(chartPropsConfig);
     expect(transformProps(chartProps as EchartsTimeseriesChartProps)).toEqual(
@@ -625,3 +625,101 @@ describe('Does transformProps transform series correctly', () => {
     });
   });
 });
+
+describe('legend sorting', () => {
+  const legendSortData = [
+    {
+      data: [
+        {
+          Milton: 40,
+          'San Francisco': 1,
+          'New York': 2,
+          Boston: 1,
+          __timestamp: 599616000000,
+        },
+        {
+          Milton: 20,
+          'San Francisco': 3,
+          'New York': 4,
+          Boston: 1,
+          __timestamp: 599916000000,
+        },
+        {
+          Milton: 60,
+          'San Francisco': 5,
+          'New York': 8,
+          Boston: 6,
+          __timestamp: 600216000000,
+        },
+        {
+          Milton: 10,
+          'San Francisco': 2,
+          'New York': 7,
+          Boston: 2,
+          __timestamp: 600516000000,
+        },
+      ],
+    },
+  ];
+
+  const getChartProps = (formData: Partial<SqlaFormData>) =>
+    new ChartProps({
+      ...chartPropsConfig,
+      formData: { ...formData },
+      queriesData: legendSortData,
+    });
+
+  it('sort legend by data', () => {
+    const chartProps = getChartProps({
+      legendSort: null,
+      sortSeriesType: 'min',
+      sortSeriesAscending: true,
+    });
+    const transformed = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    );
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'San Francisco',
+      'Boston',
+      'New York',
+      'Milton',
+    ]);
+  });
+
+  it('sort legend by label ascending', () => {
+    const chartProps = getChartProps({
+      legendSort: 'asc',
+      sortSeriesType: 'min',
+      sortSeriesAscending: true,
+    });
+    const transformed = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    );
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'Boston',
+      'Milton',
+      'New York',
+      'San Francisco',
+    ]);
+  });
+
+  it('sort legend by label descending', () => {
+    const chartProps = getChartProps({
+      legendSort: 'desc',
+      sortSeriesType: 'min',
+      sortSeriesAscending: true,
+    });
+    const transformed = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    );
+
+    expect((transformed.echartOptions.legend as any).data).toEqual([
+      'San Francisco',
+      'New York',
+      'Milton',
+      'Boston',
+    ]);
+  });
+});

superset-frontend/plugins/plugin-chart-handlebars/src/consts.ts

@@ -17,23 +17,7 @@
  * under the License.
  */
 import { debounce } from 'lodash';
-import { formatSelectOptions } from '@superset-ui/chart-controls';
 import { Constants } from '@superset-ui/core/components';
-import { t } from '@superset-ui/core';
-
-export const PAGE_SIZE_OPTIONS = formatSelectOptions<number>([
-  [0, t('page_size.all')],
-  1,
-  2,
-  3,
-  4,
-  5,
-  10,
-  20,
-  50,
-  100,
-  200,
-]);
 
 export const debounceFunc = debounce(
   (func: (val: string) => void, source: string) => func(source),

superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx

@@ -89,6 +89,7 @@ import { formatColumnValue } from './utils/formatValue';
 import { PAGE_SIZE_OPTIONS, SERVER_PAGE_SIZE_OPTIONS } from './consts';
 import { updateTableOwnState } from './DataTable/utils/externalAPIs';
 import getScrollBarSize from './DataTable/utils/getScrollBarSize';
+import DateWithFormatter from './utils/DateWithFormatter';
 
 type ValueRange = [number, number];
 
@@ -198,7 +199,7 @@ function SearchInput({
       {t('Search')}
       <Input
         aria-label={t('Search %s records', count)}
-        placeholder={tn('search.num_records', count)}
+        placeholder={tn('%s record', '%s records...', count, count)}
         value={value}
         onChange={onChange}
         onBlur={onBlur}
@@ -934,7 +935,10 @@ export default function TableChart<D extends DataRecord = DataRecord>(
             },
             className: [
               className,
-              value == null ? 'dt-is-null' : '',
+              value == null ||
+              (value instanceof DateWithFormatter && value.input == null)
+                ? 'dt-is-null'
+                : '',
               isActiveFilterValue(key, value) ? ' dt-is-active-filter' : '',
             ].join(' '),
             tabIndex: 0,

superset-frontend/plugins/plugin-chart-table/src/consts.ts

@@ -20,7 +20,7 @@ import { formatSelectOptions } from '@superset-ui/chart-controls';
 import { t } from '@superset-ui/core';
 
 export const PAGE_SIZE_OPTIONS = formatSelectOptions<number>([
-  [0, t('page_size.all')],
+  [0, t('All')],
   10,
   20,
   50,

superset-frontend/src/SqlLab/actions/sqlLab.js

@@ -272,10 +272,14 @@ export function logFailedQuery(query, errors) {
   };
 }
 
+export function createQueryFailedAction(query, msg, link, errors) {
+  return { type: QUERY_FAILED, query, msg, link, errors };
+}
+
 export function queryFailed(query, msg, link, errors) {
   return function (dispatch) {
     dispatch(logFailedQuery(query, errors));
-    dispatch({ type: QUERY_FAILED, query, msg, link, errors });
+    dispatch(createQueryFailedAction(query, msg, link, errors));
   };
 }
 
@@ -391,6 +395,7 @@ export function runQueryFromSqlEditor(
       dbId: qe.dbId,
       sql: qe.selectedText || qe.sql,
       sqlEditorId: qe.tabViewId ?? qe.id,
+      immutableId: qe.immutableId,
       tab: qe.name,
       catalog: qe.catalog,
       schema: qe.schema,
@@ -533,6 +538,7 @@ export function addQueryEditor(queryEditor) {
   const newQueryEditor = {
     ...queryEditor,
     id: nanoid(11),
+    immutableId: nanoid(11),
     loaded: true,
     inLocalStorage: true,
   };

superset-frontend/src/SqlLab/actions/sqlLab.test.js

@@ -441,6 +441,7 @@ describe('async actions', () => {
             queryLimit: undefined,
             maxRow: undefined,
             id: 'abcd',
+            immutableId: 'abcd',
             templateParams: undefined,
             inLocalStorage: true,
             loaded: true,
@@ -570,6 +571,7 @@ describe('async actions', () => {
           type: actions.ADD_QUERY_EDITOR,
           queryEditor: {
             ...queryEditor,
+            immutableId: 'abcd',
             inLocalStorage: true,
             loaded: true,
           },
@@ -597,6 +599,7 @@ describe('async actions', () => {
             type: actions.ADD_QUERY_EDITOR,
             queryEditor: {
               id: 'abcd',
+              immutableId: 'abcd',
               sql: expect.stringContaining('SELECT ...'),
               name: `Untitled Query 7`,
               dbId: defaultQueryEditor.dbId,
@@ -753,6 +756,7 @@ describe('async actions', () => {
             queryEditor: {
               ...queryEditor,
               id: 'abcd',
+              immutableId: 'abcd',
               loaded: true,
               inLocalStorage: true,
             },

superset-frontend/src/SqlLab/components/QueryAutoRefresh/index.tsx

@@ -33,7 +33,7 @@ import useInterval from 'src/SqlLab/utils/useInterval';
 import {
   refreshQueries,
   clearInactiveQueries,
-  logFailedQuery,
+  queryFailed,
 } from 'src/SqlLab/actions/sqlLab';
 import type { DatabaseObject } from 'src/features/databases/types';
 
@@ -119,7 +119,14 @@ function QueryAutoRefresh({
                   !failedQueries.current.has(id) &&
                   state === QueryState.Failed
                 ) {
-                  dispatch(logFailedQuery(query, query.extra?.errors));
+                  dispatch(
+                    queryFailed(
+                      query,
+                      query.errorMessage,
+                      query.extra?.errors?.[0]?.extra?.link,
+                      query.extra?.errors,
+                    ),
+                  );
                   failedQueries.current.set(id, true);
                 }
               });

superset-frontend/src/SqlLab/components/SqlEditor/SqlEditor.test.tsx

@@ -41,7 +41,7 @@ import {
 import SqlEditorLeftBar from 'src/SqlLab/components/SqlEditorLeftBar';
 import ResultSet from 'src/SqlLab/components/ResultSet';
 import { api } from 'src/hooks/apiResources/queryApi';
-import setupExtensions from 'src/setup/setupExtensions';
+import setupCodeOverrides from 'src/setup/setupCodeOverrides';
 import type { Action, Middleware, Store } from 'redux';
 import SqlEditor, { Props } from '.';
 
@@ -353,7 +353,7 @@ describe('SqlEditor', () => {
       <>sqleditor.extension.form extension component</>
     ));
 
-    setupExtensions();
+    setupCodeOverrides();
     const { findByText } = setup(mockedProps, store);
     expect(
       await findByText('sqleditor.extension.form extension component'),

superset-frontend/src/SqlLab/fixtures.ts

@@ -188,6 +188,7 @@ export const table = {
 export const defaultQueryEditor = {
   version: LatestQueryEditorVersion,
   id: 'dfsadfs',
+  immutableId: 'immutable-id',
   autorun: false,
   dbId: 1,
   latestQueryId: null,
@@ -204,6 +205,7 @@ export const defaultQueryEditor = {
 export const extraQueryEditor1 = {
   ...defaultQueryEditor,
   id: 'diekd23',
+  immutableId: 'immutable-id',
   sql: 'SELECT *\nFROM\nWHERE\nLIMIT',
   name: 'Untitled Query 2',
   selectedText: 'SELECT',
@@ -212,6 +214,7 @@ export const extraQueryEditor1 = {
 export const extraQueryEditor2 = {
   ...defaultQueryEditor,
   id: 'owkdi998',
+  immutableId: 'immutable-id',
   sql: '',
   name: 'Untitled Query 3',
 };
@@ -219,6 +222,7 @@ export const extraQueryEditor2 = {
 export const extraQueryEditor3 = {
   ...defaultQueryEditor,
   id: 'kvk23',
+  immutableId: 'immutable-id',
   sql: '',
   name: 'Untitled Query 4',
   tabViewId: 37,

superset-frontend/src/SqlLab/reducers/getInitialState.ts

@@ -17,6 +17,7 @@
  * under the License.
  */
 import { t } from '@superset-ui/core';
+import { nanoid } from 'nanoid';
 import type { BootstrapData } from 'src/types/bootstrapTypes';
 import type { InitialState } from 'src/hooks/apiResources/sqlLab';
 import {
@@ -55,6 +56,7 @@ export default function getInitialState({
   let queryEditors: Record<string, QueryEditor> = {};
   const defaultQueryEditor = {
     version: LatestQueryEditorVersion,
+    immutableId: nanoid(11),
     loaded: true,
     name: t('Untitled query'),
     sql: '',
@@ -78,6 +80,7 @@ export default function getInitialState({
       queryEditor = {
         version: activeTab.extra_json?.version ?? QueryEditorVersion.V1,
         id: id.toString(),
+        immutableId: activeTab.extra_json?.immutableId ?? nanoid(11),
         loaded: true,
         name: activeTab.label,
         sql: activeTab.sql || '',
@@ -100,6 +103,7 @@ export default function getInitialState({
       queryEditor = {
         ...defaultQueryEditor,
         id: id.toString(),
+        immutableId: nanoid(11),
         loaded: false,
         name: label,
         dbId: undefined,

superset-frontend/src/SqlLab/types.ts

@@ -49,6 +49,7 @@ export interface CursorPosition {
 export interface QueryEditor {
   version: QueryEditorVersion;
   id: string;
+  immutableId: string;
   dbId?: number;
   name: string;
   title?: string; // keep it optional for backward compatibility

superset-frontend/src/SqlLab/utils/reduxStateToLocalStorageHelper.ts

@@ -45,6 +45,7 @@ const PERSISTENT_QUERY_EDITOR_KEYS = new Set([
   'dbId',
   'height',
   'id',
+  'immutableId',
   'latestQueryId',
   'northPercent',
   'queryLimit',

superset-frontend/src/components/Chart/DrillBy/DrillByModal.test.tsx

@@ -356,3 +356,215 @@ describe('Embedded mode behavior', () => {
     );
   });
 });
+
+describe('Table view with pagination', () => {
+  beforeEach(() => {
+    // Mock a large dataset response for pagination testing
+    const mockLargeDataset = {
+      result: [
+        {
+          data: Array.from({ length: 100 }, (_, i) => ({
+            state: `State${i}`,
+            sum__num: 1000 + i,
+          })),
+          colnames: ['state', 'sum__num'],
+          coltypes: [1, 0],
+        },
+      ],
+    };
+
+    fetchMock.post(CHART_DATA_ENDPOINT, mockLargeDataset, {
+      overwriteRoutes: true,
+    });
+  });
+
+  afterEach(() => {
+    fetchMock.restore();
+  });
+
+  test('should render table view when Table radio is selected', async () => {
+    await renderModal({
+      column: { column_name: 'state', verbose_name: null },
+      drillByConfig: {
+        filters: [{ col: 'gender', op: '==', val: 'boy' }],
+        groupbyFieldName: 'groupby',
+      },
+    });
+
+    // Switch to table view
+    const tableRadio = await screen.findByRole('radio', { name: /table/i });
+    userEvent.click(tableRadio);
+
+    // Wait for table to render
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+
+    // Check that pagination is rendered (there's also a breadcrumb list)
+    const lists = screen.getAllByRole('list');
+    const paginationList = lists.find(list =>
+      list.className?.includes('pagination'),
+    );
+    expect(paginationList).toBeInTheDocument();
+  });
+
+  test('should handle pagination in table view', async () => {
+    await renderModal({
+      column: { column_name: 'state', verbose_name: null },
+      drillByConfig: {
+        filters: [{ col: 'gender', op: '==', val: 'boy' }],
+        groupbyFieldName: 'groupby',
+      },
+    });
+
+    // Switch to table view
+    const tableRadio = await screen.findByRole('radio', { name: /table/i });
+    userEvent.click(tableRadio);
+
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+
+    // Check that first page data is shown
+    expect(screen.getByText('State0')).toBeInTheDocument();
+
+    // Check pagination controls exist
+    const nextPageButton = screen.getByTitle('Next Page');
+    expect(nextPageButton).toBeInTheDocument();
+
+    // Click next page
+    userEvent.click(nextPageButton);
+
+    // Verify page changed (State0 should not be visible on page 2)
+    await waitFor(() => {
+      expect(screen.queryByText('State0')).not.toBeInTheDocument();
+    });
+  });
+
+  test('should maintain table state when switching between Chart and Table views', async () => {
+    await renderModal({
+      column: { column_name: 'state', verbose_name: null },
+      drillByConfig: {
+        filters: [{ col: 'gender', op: '==', val: 'boy' }],
+        groupbyFieldName: 'groupby',
+      },
+    });
+
+    const chartRadio = screen.getByRole('radio', { name: /chart/i });
+    const tableRadio = screen.getByRole('radio', { name: /table/i });
+
+    // Switch to table view
+    userEvent.click(tableRadio);
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+
+    // Switch back to chart view
+    userEvent.click(chartRadio);
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-chart')).toBeInTheDocument();
+    });
+
+    // Switch back to table view - should maintain state
+    userEvent.click(tableRadio);
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+  });
+
+  test('should not cause infinite re-renders with pagination', async () => {
+    // Mock console.error to catch potential infinite loop warnings
+    const originalError = console.error;
+    const consoleErrorSpy = jest.fn();
+    console.error = consoleErrorSpy;
+
+    await renderModal({
+      column: { column_name: 'state', verbose_name: null },
+      drillByConfig: {
+        filters: [{ col: 'gender', op: '==', val: 'boy' }],
+        groupbyFieldName: 'groupby',
+      },
+    });
+
+    // Switch to table view
+    const tableRadio = await screen.findByRole('radio', { name: /table/i });
+    userEvent.click(tableRadio);
+
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+
+    // Check that no infinite loop errors were logged
+    expect(consoleErrorSpy).not.toHaveBeenCalledWith(
+      expect.stringContaining('Maximum update depth exceeded'),
+    );
+
+    console.error = originalError;
+  });
+
+  test('should handle empty results in table view', async () => {
+    // Mock empty dataset response
+    fetchMock.post(
+      CHART_DATA_ENDPOINT,
+      {
+        result: [
+          {
+            data: [],
+            colnames: ['state', 'sum__num'],
+            coltypes: [1, 0],
+          },
+        ],
+      },
+      { overwriteRoutes: true },
+    );
+
+    await renderModal({
+      column: { column_name: 'state', verbose_name: null },
+      drillByConfig: {
+        filters: [{ col: 'gender', op: '==', val: 'boy' }],
+        groupbyFieldName: 'groupby',
+      },
+    });
+
+    // Switch to table view
+    const tableRadio = await screen.findByRole('radio', { name: /table/i });
+    userEvent.click(tableRadio);
+
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+
+    // Should show empty state
+    expect(screen.getByText('No data')).toBeInTheDocument();
+  });
+
+  test('should handle sorting in table view', async () => {
+    await renderModal({
+      column: { column_name: 'state', verbose_name: null },
+      drillByConfig: {
+        filters: [{ col: 'gender', op: '==', val: 'boy' }],
+        groupbyFieldName: 'groupby',
+      },
+    });
+
+    // Switch to table view
+    const tableRadio = await screen.findByRole('radio', { name: /table/i });
+    userEvent.click(tableRadio);
+
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+
+    // Find sortable column header
+    const sortableHeaders = screen.getAllByTestId('sort-header');
+    expect(sortableHeaders.length).toBeGreaterThan(0);
+
+    // Click to sort
+    userEvent.click(sortableHeaders[0]);
+
+    // Table should still be rendered without crashes
+    await waitFor(() => {
+      expect(screen.getByTestId('drill-by-results-table')).toBeInTheDocument();
+    });
+  });
+});

superset-frontend/src/components/Datasource/ChangeDatasourceModal/ChangeDatasourceModal.test.jsx

@@ -22,7 +22,7 @@ import fetchMock from 'fetch-mock';
 import thunk from 'redux-thunk';
 import sinon from 'sinon';
 import mockDatasource from 'spec/fixtures/mockDatasource';
-import { ChangeDatasourceModal } from '.';
+import ChangeDatasourceModal from '.';
 
 const mockStore = configureStore([thunk]);
 const store = mockStore({});

superset-frontend/src/components/Datasource/ChangeDatasourceModal/index.tsx

@@ -55,7 +55,7 @@ import {
 } from 'src/features/datasets/constants';
 import withToasts from 'src/components/MessageToasts/withToasts';
 import { InputRef } from 'antd';
-import type { Datasource, ChangeDatasourceModalProps } from './types';
+import type { Datasource, ChangeDatasourceModalProps } from '../types';
 
 const CONFIRM_WARNING_MESSAGE = t(
   'Warning! Changing the dataset may break the chart if the metadata does not exist.',

superset-frontend/src/components/Datasource/DatasourceModal/DatasourceModal.test.jsx

@@ -29,7 +29,7 @@ import fetchMock from 'fetch-mock';
 import sinon from 'sinon';
 import { SupersetClient } from '@superset-ui/core';
 import mockDatasource from 'spec/fixtures/mockDatasource';
-import { DatasourceModal } from '.';
+import DatasourceModal from '.';
 
 // Define your constants here
 const SAVE_ENDPOINT = 'glob:*/api/v1/dataset/7';