You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by "michael-s-molina (via GitHub)" <gi...@apache.org> on 2026/04/01 14:24:20 UTC
[PR] fix(dataset-editor): improve modal layout and fix Settings tab horizontal scroll [superset]
michael-s-molina opened a new pull request, #39009:
URL: https://github.com/apache/superset/pull/39009
### SUMMARY
- Vertically centers the dataset editor modal using viewport-relative sizing (`90vh` height, `5vh` top margin) instead of a fixed pixel height, and fixes the centering math by removing antd's default `padding-bottom` and `margin-top` offsets that were adding to the effective modal height
- Fixes resize support by moving the top offset from `.ant-modal-content` (which conflicted with the resizable container) to the modal root level
- Adds spacing between the tab bar and tab panel content
- Fixes horizontal scroll in the Settings tab caused by antd `Row` gutter negative margins bleeding outside the tab content area
### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
<!--- Skip this if not applicable -->
### TESTING INSTRUCTIONS
1. Open the dataset editor modal (Edit Dataset)
2. Verify the modal opens vertically centered with equal space above and below
3. Verify the modal can be resized from the bottom and right edges
4. Switch to the **Settings** tab and verify no horizontal scrollbar appears at the default modal width
5. Verify the two-column layout in Settings stacks correctly on narrow widths
### ADDITIONAL INFORMATION
- [ ] Has associated issue:
- [ ] Required feature flags:
- [x] Changes UI
- [ ] Includes DB Migration (follow approval process in [SIP-59](https://github.com/apache/superset/issues/13351))
- [ ] Migration is atomic, supports rollback & is backwards-compatible
- [ ] Confirm DB migration upgrade and downgrade tested
- [ ] Runtime estimates and downtime expectations provided
- [ ] Introduces new feature or API
- [ ] Removes existing feature or API
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
Re: [PR] fix(dataset-editor): improve modal layout and fix Settings tab horizontal scroll [superset]
Posted by "bito-code-review[bot] (via GitHub)" <gi...@apache.org>.
bito-code-review[bot] commented on PR #39009:
URL: https://github.com/apache/superset/pull/39009#issuecomment-4170964960
AI Code Review is in progress (usually takes 3 to 15 minutes unless it's a very large PR).
<details>
<summary>
Bito Usage Guide
</summary>
**Commands**
Type the following command in the pull request comment and save the comment.
- `/review` - Manually triggers a full AI review.
- `/pause` - Pauses automatic reviews on this pull request.
- `/resume` - Resumes automatic reviews.
- `/resolve` - Marks all Bito-posted review comments as resolved.
- `/abort` - Cancels all in-progress reviews.
Refer to the <a href="https://docs.bito.ai/bito-dev-agents/ai-code-review-agent/available-commands" target="_blank" rel="noopener noreferrer">documentation</a> for additional commands.
**Configuration**
This repository uses `Superset` You can customize the agent settings <a href="https://alpha.bito.ai/home/ai-agents/code-review-agent" target="_blank" rel="noopener noreferrer">here</a> or contact your Bito workspace admin at evan@preset.io.
**Documentation & Help**
- <a href="https://docs.bito.ai/bito-dev-agents/ai-code-review-agent/getting-started/install-run-using-bito-cloud/create-or-customize-an-agent-instance" target="_blank" rel="noopener noreferrer">Customize agent settings</a>
- <a href="https://docs.bito.ai/bito-dev-agents/ai-code-review-agent/implementing-custom-code-review-rules" target="_blank" rel="noopener noreferrer">Review rules</a>
- <a href="https://docs.bito.ai/bito-dev-agents/ai-code-review-agent" target="_blank" rel="noopener noreferrer">General documentation</a>
- <a href="https://docs.bito.ai/bito-dev-agents/ai-code-review-agent/faqs" target="_blank" rel="noopener noreferrer">FAQ</a>
</details>
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
Re: [PR] fix(dataset-editor): improve modal layout and fix Settings tab horizontal scroll [superset]
Posted by "codecov[bot] (via GitHub)" <gi...@apache.org>.
codecov[bot] commented on PR #39009:
URL: https://github.com/apache/superset/pull/39009#issuecomment-4170679472
## [Codecov](https://app.codecov.io/gh/apache/superset/pull/39009?dropdown=coverage&src=pr&el=h1&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache) Report
:white_check_mark: All modified and coverable lines are covered by tests.
:white_check_mark: Project coverage is 64.42%. Comparing base ([`8ed7578`](https://app.codecov.io/gh/apache/superset/commit/8ed75787cb39211433b79af95ac82733131033bf?dropdown=coverage&el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache)) to head ([`2ab946f`](https://app.codecov.io/gh/apache/superset/commit/2ab946f2c42c7ceb71ed0b823d3566913d384f2e?dropdown=coverage&el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache)).
<details><summary>Additional details and impacted files</summary>
```diff
@@ Coverage Diff @@
## master #39009 +/- ##
=======================================
Coverage 64.42% 64.42%
=======================================
Files 2536 2536
Lines 131103 131106 +3
Branches 30434 30434
=======================================
+ Hits 84467 84470 +3
Misses 45173 45173
Partials 1463 1463
```
| [Flag](https://app.codecov.io/gh/apache/superset/pull/39009/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache) | Coverage Δ | |
|---|---|---|
| [javascript](https://app.codecov.io/gh/apache/superset/pull/39009/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache) | `65.83% <100.00%> (+<0.01%)` | :arrow_up: |
Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache#carryforward-flags-in-the-pull-request-comment) to find out more.
</details>
[:umbrella: View full report in Codecov by Sentry](https://app.codecov.io/gh/apache/superset/pull/39009?dropdown=coverage&src=pr&el=continue&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache).
:loudspeaker: Have feedback on the report? [Share it here](https://about.codecov.io/codecov-pr-comment-feedback/?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=apache).
<details><summary> :rocket: New features to boost your workflow: </summary>
- :snowflake: [Test Analytics](https://docs.codecov.com/docs/test-analytics): Detect flaky tests, report on failures, and find test suite problems.
- :package: [JS Bundle Analysis](https://docs.codecov.com/docs/javascript-bundle-analysis): Save yourself from yourself by tracking and limiting bundle sizes in JS merges.
</details>
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
Re: [PR] fix(dataset-editor): improve modal layout and fix Settings tab horizontal scroll [superset]
Posted by "codeant-ai-for-open-source[bot] (via GitHub)" <gi...@apache.org>.
codeant-ai-for-open-source[bot] commented on code in PR #39009:
URL: https://github.com/apache/superset/pull/39009#discussion_r3022487273
##########
superset-frontend/src/components/Datasource/components/DatasourceEditor/DatasourceEditor.tsx:
##########
@@ -2525,18 +2526,20 @@ class DatasourceEditor extends PureComponent<
key: TABS_KEYS.SETTINGS,
label: t('Settings'),
children: (
- <Row gutter={16}>
- <Col xs={24} md={12}>
- <FormContainer>
- {this.renderSettingsFieldset()}
- </FormContainer>
- </Col>
- <Col xs={24} md={12}>
- <FormContainer>
- {this.renderAdvancedFieldset()}
- </FormContainer>
- </Col>
- </Row>
+ <div style={{ overflow: 'hidden' }}>
Review Comment:
**Suggestion:** Using `overflow: 'hidden'` on the Settings tab container clips child popups rendered inside the same DOM subtree. Superset `Select`/`AsyncSelect` components default to `getPopupContainer={triggerNode => triggerNode.parentNode}`, so controls like the Owners selector can have their dropdown menu cut off. Restrict the overflow fix to the horizontal axis only. [possible bug]
<details>
<summary><b>Severity Level:</b> Major ⚠️</summary>
```mdx
- ❌ Owners dropdown clipped in Dataset Editor Settings tab.
- ⚠️ Future popup-based Settings controls may render partially hidden.
```
</details>
```suggestion
<div style={{ overflowX: 'hidden' }}>
```
<details>
<summary><b>Steps of Reproduction ✅ </b></summary>
```mdx
1. The dataset editor modal is implemented by `StyledDatasourceModal` in
`superset-frontend/src/components/Datasource/DatasourceModal/index.tsx:44-72`, which
renders `<DatasourceEditor ... />` inside the Ant Design `Modal` body at `index.tsx:90-99,
383-388`.
2. In the `DatasourceEditor` render method, the Settings tab item uses a wrapper `<div
style={{ overflow: 'hidden' }}>` around its content at
`superset-frontend/src/components/Datasource/components/DatasourceEditor/DatasourceEditor.tsx:2527-2535`,
so this div becomes an ancestor with `overflow: hidden` for all Settings tab children.
3. The Settings tab's left column renders `renderSettingsFieldset()` (definition at
`DatasourceEditor.tsx:1546-1625`), which includes the `OwnersSelector` component at
`DatasourceEditor.tsx:1625-1631`.
4. `OwnersSelector` renders an `AsyncSelect` without overriding `getPopupContainer` at
`DatasourceEditor.tsx:7-11, 38-49`, so it inherits the default
`getPopupContainer={triggerNode => triggerNode.parentNode}` behavior from `AsyncSelect`
(`packages/superset-ui-core/src/components/Select/AsyncSelect.tsx:193-247`). The dropdown
menu is therefore rendered inside a parent element that is ultimately inside the
`overflow: 'hidden'` Settings wrapper. When the Owners dropdown needs to extend beyond the
wrapper's vertical bounds (e.g., in a shorter modal or smaller viewport), the absolutely
positioned dropdown content overflows that wrapper and is clipped by `overflow: hidden`,
making parts of the options list invisible. Changing the wrapper to `overflowX: 'hidden'`
keeps the horizontal scroll fix while allowing vertical dropdown overflow to remain
visible.
```
</details>
<details>
<summary><b>Prompt for AI Agent 🤖 </b></summary>
```mdx
This is a comment left during a code review.
**Path:** superset-frontend/src/components/Datasource/components/DatasourceEditor/DatasourceEditor.tsx
**Line:** 2529:2529
**Comment:**
*Possible Bug: Using `overflow: 'hidden'` on the Settings tab container clips child popups rendered inside the same DOM subtree. Superset `Select`/`AsyncSelect` components default to `getPopupContainer={triggerNode => triggerNode.parentNode}`, so controls like the Owners selector can have their dropdown menu cut off. Restrict the overflow fix to the horizontal axis only.
Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise.
```
</details>
<a href='https://app.codeant.ai/feedback?pr_url=https%3A%2F%2Fgithub.com%2Fapache%2Fsuperset%2Fpull%2F39009&comment_hash=e5701c7e98f3d3c80a595a4e029787b7d983c098af2f1635ad4489b9c52ca071&reaction=like'>👍</a> | <a href='https://app.codeant.ai/feedback?pr_url=https%3A%2F%2Fgithub.com%2Fapache%2Fsuperset%2Fpull%2F39009&comment_hash=e5701c7e98f3d3c80a595a4e029787b7d983c098af2f1635ad4489b9c52ca071&reaction=dislike'>👎</a>
##########
superset-frontend/src/components/Datasource/DatasourceModal/index.tsx:
##########
@@ -367,7 +375,9 @@ const DatasourceModal: FunctionComponent<DatasourceModalProps> = ({
}
responsive
resizable
- resizableConfig={{ defaultSize: { width: 'auto', height: '900px' } }}
+ resizableConfig={{
+ defaultSize: { width: 'auto', height: `${MODAL_HEIGHT_VH}vh` },
Review Comment:
**Suggestion:** Passing a partial `resizableConfig` replaces the modal's default resize constraints instead of extending them, so the modal can be resized to unusable dimensions and lose the intended handle behavior. Include the default min/max bounds and enabled edges when setting `defaultSize`. [logic error]
<details>
<summary><b>Severity Level:</b> Major ⚠️</summary>
```mdx
- ⚠️ Dataset editor modal can resize beyond intended min/max bounds.
- ⚠️ Resize handle behavior diverges from Modal default configuration.
- ⚠️ Affects dataset editing from Explore and Dataset List flows.
```
</details>
```suggestion
maxHeight: '100vh',
maxWidth: '100vw',
minHeight: 500,
minWidth: 500,
enable: {
bottom: true,
bottomLeft: false,
bottomRight: true,
left: false,
top: false,
topLeft: false,
topRight: false,
right: true,
},
```
<details>
<summary><b>Steps of Reproduction ✅ </b></summary>
```mdx
1. Open the Dataset List page (`superset-frontend/src/pages/DatasetList/index.tsx`, lines
872–901) and click an "Edit dataset" action so that `datasetCurrentlyEditing` is set and
`<DatasourceModal ... show />` is rendered (line 888).
2. This renders `DatasourceModal` which returns `<StyledDatasourceModal ... resizable
resizableConfig={{ defaultSize: { width: 'auto', height: `${MODAL_HEIGHT_VH}vh` } }} />`
(`superset-frontend/src/components/Datasource/DatasourceModal/index.tsx`, lines 325–332
and 377–380).
3. The `Modal` implementation at
`packages/superset-ui-core/src/components/Modal/Modal.tsx` computes `getResizableConfig`
(`Showing lines 260–519`, lines 37–42) which returns `defaultResizableConfig(hideFooter)`
only when `Object.keys(resizableConfig).length === 0`; otherwise it returns the provided
`resizableConfig` as-is, bypassing defaults defined in `defaultResizableConfig` (lines
186–203: maxHeight `100vh`, maxWidth `100vw`, minHeight based on header/footer, minWidth
`'380px'`, and the `enable` handle map).
4. Because `DatasourceModal` passes a non-empty `resizableConfig` object that only sets
`defaultSize` and omits min/max and `enable`, the modal's `Resizable` wrapper receives no
explicit min/max constraints or handle configuration from `defaultResizableConfig`. When a
user drags the resize handle on the dataset editor modal (visible because `resizable` is
true in the same JSX block), the outer resizable container can be shrunk or expanded
beyond the screen-friendly bounds enforced for other modals (e.g., Drill By at
`src/components/Chart/DrillBy/DrillByModal.tsx` lines 147–167 also overrides defaults
similarly), allowing the dataset editor modal to reach very small or very large dimensions
compared to the design defaults.
```
</details>
<details>
<summary><b>Prompt for AI Agent 🤖 </b></summary>
```mdx
This is a comment left during a code review.
**Path:** superset-frontend/src/components/Datasource/DatasourceModal/index.tsx
**Line:** 379:379
**Comment:**
*Logic Error: Passing a partial `resizableConfig` replaces the modal's default resize constraints instead of extending them, so the modal can be resized to unusable dimensions and lose the intended handle behavior. Include the default min/max bounds and enabled edges when setting `defaultSize`.
Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise.
```
</details>
<a href='https://app.codeant.ai/feedback?pr_url=https%3A%2F%2Fgithub.com%2Fapache%2Fsuperset%2Fpull%2F39009&comment_hash=563bfad7af57422fb1091c55f695a2e4d259b5e72670a955608a494e37f1c179&reaction=like'>👍</a> | <a href='https://app.codeant.ai/feedback?pr_url=https%3A%2F%2Fgithub.com%2Fapache%2Fsuperset%2Fpull%2F39009&comment_hash=563bfad7af57422fb1091c55f695a2e4d259b5e72670a955608a494e37f1c179&reaction=dislike'>👎</a>
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
Re: [PR] fix(dataset-editor): improve modal layout and fix Settings tab horizontal scroll [superset]
Posted by "michael-s-molina (via GitHub)" <gi...@apache.org>.
michael-s-molina merged PR #39009:
URL: https://github.com/apache/superset/pull/39009
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
Re: [PR] fix(dataset-editor): improve modal layout and fix Settings tab horizontal scroll [superset]
Posted by "bito-code-review[bot] (via GitHub)" <gi...@apache.org>.
bito-code-review[bot] commented on PR #39009:
URL: https://github.com/apache/superset/pull/39009#issuecomment-4170471507
AI Code Review is in progress (usually takes 3 to 15 minutes unless it's a very large PR).
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org