(superset) branch master updated: fix(save-chart): fix info icon alignment in save chart modal (#37708)

[enzomartellucci]

This is an automated email from the ASF dual-hosted git repository.

enzomartellucci pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/master by this push:
     new bbafae5f62b fix(save-chart): fix info icon alignment in save chart 
modal (#37708)
bbafae5f62b is described below

commit bbafae5f62ba8a55e4a1c9b1e7ebdd1e4420a50f
Author: Enzo Martellucci <52219496+enx...@users.noreply.github.com>
AuthorDate: Thu Feb 26 18:11:07 2026 +0100

    fix(save-chart): fix info icon alignment in save chart modal (#37708)
    
    Co-authored-by: Diego Pucci <diegopucci...@gmail.com>
---
 .../src/explore/components/SaveModal.test.tsx      | 13 +++++++++
 .../src/explore/components/SaveModal.tsx           | 32 +++++++++++++++++-----
 2 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/superset-frontend/src/explore/components/SaveModal.test.tsx 
b/superset-frontend/src/explore/components/SaveModal.test.tsx
index 584d9a5cec4..e04994b1a2a 100644
--- a/superset-frontend/src/explore/components/SaveModal.test.tsx
+++ b/superset-frontend/src/explore/components/SaveModal.test.tsx
@@ -317,6 +317,19 @@ test('set dataset name when chart source is query', () => {
   expect(getByTestId('new-dataset-name')).toHaveValue('test');
 });
 
+test('renders InfoTooltip icon next to Dataset Name label when datasource type 
is query', () => {
+  const { getByTestId, getByText } = setup({}, queryStore);
+
+  const datasetNameLabel = getByText('Dataset Name');
+  expect(datasetNameLabel).toBeInTheDocument();
+
+  const infoTooltip = getByTestId('info-tooltip-icon');
+  expect(infoTooltip).toBeInTheDocument();
+
+  const labelContainer = datasetNameLabel.parentElement;
+  expect(labelContainer).toContainElement(infoTooltip);
+});
+
 test('make sure slice_id in the URLSearchParams before the redirect', () => {
   const myProps = {
     ...defaultProps,
diff --git a/superset-frontend/src/explore/components/SaveModal.tsx 
b/superset-frontend/src/explore/components/SaveModal.tsx
index e69f19ff423..91c27f90002 100644
--- a/superset-frontend/src/explore/components/SaveModal.tsx
+++ b/superset-frontend/src/explore/components/SaveModal.tsx
@@ -33,11 +33,18 @@ import {
   Input,
   Loading,
   Divider,
+  Flex,
   TreeSelect,
 } from '@superset-ui/core/components';
 import { t, logging } from '@apache-superset/core';
 import { DatasourceType, isDefined, SupersetClient } from '@superset-ui/core';
-import { css, styled, Alert } from '@apache-superset/core/ui';
+import {
+  css,
+  styled,
+  withTheme,
+  Alert,
+  type SupersetTheme,
+} from '@apache-superset/core/ui';
 import { Radio } from '@superset-ui/core/components/Radio';
 import { GRID_COLUMN_COUNT } from 'src/dashboard/util/constants';
 import { canUserEditDashboard } from 'src/dashboard/util/permissionUtils';
@@ -67,6 +74,7 @@ interface SaveModalProps extends RouteComponentProps {
   dashboardId: '' | number | null;
   isVisible: boolean;
   dispatch: Dispatch;
+  theme: SupersetTheme;
 }
 
 type SaveModalState = {
@@ -623,11 +631,21 @@ class SaveModal extends Component<SaveModalProps, 
SaveModalState> {
           />
         </FormItem>
         {this.props.datasource?.type === 'query' && (
-          <FormItem label={t('Dataset Name')} required>
-            <InfoTooltip
-              tooltip={t('A reusable dataset will be saved with your chart.')}
-              placement="right"
-            />
+          <FormItem
+            label={
+              <Flex align="center" gap={this.props.theme.sizeUnit}>
+                {t('Dataset Name')}
+                <InfoTooltip
+                  data-test="info-tooltip-icon"
+                  tooltip={t(
+                    'A reusable dataset will be saved with your chart.',
+                  )}
+                  placement="right"
+                />
+              </Flex>
+            }
+            required
+          >
             <Input
               name="dataset_name"
               type="text"
@@ -804,7 +822,7 @@ function mapStateToProps({
   };
 }
 
-export default withRouter(connect(mapStateToProps)(SaveModal));
+export default withRouter(connect(mapStateToProps)(withTheme(SaveModal)));
 
 // User for testing purposes need to revisit once we convert this to 
functional component
 export { SaveModal as PureSaveModal };