You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ms...@apache.org on 2025/09/19 12:20:50 UTC
(superset) branch msyavuz/fix/sql-expression-popover created (now 3fd481e3f3)
This is an automated email from the ASF dual-hosted git repository.
msyavuz pushed a change to branch msyavuz/fix/sql-expression-popover
in repository https://gitbox.apache.org/repos/asf/superset.git
at 3fd481e3f3 fix(SQLPopover): use correct component
This branch includes the following new commits:
new 3fd481e3f3 fix(SQLPopover): use correct component
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
(superset) 01/01: fix(SQLPopover): use correct component
Posted by ms...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
msyavuz pushed a commit to branch msyavuz/fix/sql-expression-popover
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 3fd481e3f36280df980cfdc20652e1f9f3fcd05c
Author: Mehmet Salih Yavuz <sa...@proton.me>
AuthorDate: Fri Sep 19 15:20:21 2025 +0300
fix(SQLPopover): use correct component
---
.../src/components/SQLPopover.tsx | 25 ++++++----------------
1 file changed, 6 insertions(+), 19 deletions(-)
diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/components/SQLPopover.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/components/SQLPopover.tsx
index 4542c8f163..42d88901c7 100644
--- a/superset-frontend/packages/superset-ui-chart-controls/src/components/SQLPopover.tsx
+++ b/superset-frontend/packages/superset-ui-chart-controls/src/components/SQLPopover.tsx
@@ -16,9 +16,11 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { useEffect, useState } from 'react';
-import { Popover, type PopoverProps } from '@superset-ui/core/components';
-import type ReactAce from 'react-ace';
+import {
+ Popover,
+ type PopoverProps,
+ SQLEditor,
+} from '@superset-ui/core/components';
import { CalculatorOutlined } from '@ant-design/icons';
import { css, styled, useTheme, t } from '@superset-ui/core';
@@ -35,24 +37,10 @@ const StyledCalculatorIcon = styled(CalculatorOutlined)`
export const SQLPopover = (props: PopoverProps & { sqlExpression: string }) => {
const theme = useTheme();
- const [AceEditor, setAceEditor] = useState<typeof ReactAce | null>(null);
- useEffect(() => {
- Promise.all([
- import('react-ace'),
- import('ace-builds/src-min-noconflict/mode-sql'),
- ]).then(([reactAceModule]) => {
- setAceEditor(() => reactAceModule.default);
- });
- }, []);
-
- if (!AceEditor) {
- return null;
- }
return (
<Popover
content={
- <AceEditor
- mode="sql"
+ <SQLEditor
value={props.sqlExpression}
editorProps={{ $blockScrolling: true }}
setOptions={{
@@ -65,7 +53,6 @@ export const SQLPopover = (props: PopoverProps & { sqlExpression: string }) => {
wrapEnabled
style={{
border: `1px solid ${theme.colorBorder}`,
- background: theme.colorPrimaryBg,
maxWidth: theme.sizeUnit * 100,
}}
/>