From c70892ba802b22c8136fc2e5c3996350477e5a13 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Wed, 26 Feb 2025 23:16:29 +0530 Subject: [PATCH 01/45] Fixed bug causing component definition to be copied on copying text --- frontend/src/AppBuilder/AppCanvas/appCanvasUtils.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/frontend/src/AppBuilder/AppCanvas/appCanvasUtils.js b/frontend/src/AppBuilder/AppCanvas/appCanvasUtils.js index 04ae6aa896..027734a6a1 100644 --- a/frontend/src/AppBuilder/AppCanvas/appCanvasUtils.js +++ b/frontend/src/AppBuilder/AppCanvas/appCanvasUtils.js @@ -240,6 +240,12 @@ const getSelectedText = () => { // TODO: Move this function to componentSlice export const copyComponents = ({ isCut = false, isCloning = false }) => { + const selectedText = window.getSelection()?.toString().trim(); + if (selectedText) { + navigator.clipboard.writeText(selectedText); + return; + } + const selectedComponents = useStore.getState().getSelectedComponentsDefinition(); if (selectedComponents.length < 1) return getSelectedText(); const allComponents = useStore.getState().getCurrentPageComponents(); From 161fffcb42785b4f8aef48ee9371c5a4a21e7756 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Thu, 27 Feb 2025 02:44:31 +0530 Subject: [PATCH 02/45] Automatically resizing codehinter input based on content --- .../QueryEditors/Restapi/TabContent.jsx | 4 ++-- .../TooljetDatabase/DropDownSelect.jsx | 4 +++- .../TooljetDatabase/JoinConstraint.jsx | 3 +-- .../TooljetDatabase/JoinSelect.jsx | 5 +---- .../QueryEditors/TooljetDatabase/JoinSort.jsx | 5 +---- .../TooljetDatabase/JoinTable.jsx | 3 +-- .../TooljetDatabase/RenderColumnUI.jsx | 5 +---- .../TooljetDatabase/RenderFilterSectionUI.jsx | 5 +---- .../TooljetDatabase/RenderSortUI.jsx | 5 +---- frontend/src/_styles/queryManager.scss | 21 +++++++++++++++++-- frontend/src/_styles/theme.scss | 1 + 11 files changed, 32 insertions(+), 29 deletions(-) diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/Restapi/TabContent.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/Restapi/TabContent.jsx index cf47ded427..ee55937b1c 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/Restapi/TabContent.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/Restapi/TabContent.jsx @@ -30,7 +30,7 @@ export default ({ return ( <>
-
+
) : ( -
+
{index > 0 && ( diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSelect.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSelect.jsx index 4734addb26..863c826b8a 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSelect.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSelect.jsx @@ -340,10 +340,7 @@ const JsonBfieldsForSelect = ({ selectedJsonbColumns, handleJSonChange, table }) handleRemove(colDetails.id, colDetails.name, colDetails.table)} > diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSort.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSort.jsx index 2d5a2de518..9e129e9eb4 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSort.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinSort.jsx @@ -164,10 +164,7 @@ export default function JoinSort({ darkMode }) { setJoinOrderByOptions(joinOrderByOptions.filter((opt, idx) => idx !== i))} > diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinTable.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinTable.jsx index eba36f37a3..cf14448967 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinTable.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/JoinTable.jsx @@ -535,12 +535,11 @@ const RenderFilterSection = ({ darkMode }) => { removeFilterConditionEntry(index)} > diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderColumnUI.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderColumnUI.jsx index 1766691d66..89323c1c3c 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderColumnUI.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderColumnUI.jsx @@ -54,10 +54,7 @@ const RenderColumnUI = ({ removeColumnOptionsPair(id)} > diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderFilterSectionUI.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderFilterSectionUI.jsx index 983019697a..cd7f94abf3 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderFilterSectionUI.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderFilterSectionUI.jsx @@ -117,10 +117,7 @@ const RenderFilterSectionUI = ({ removeFilterConditionPair(id)} > diff --git a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderSortUI.jsx b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderSortUI.jsx index b5021974ba..a349b9e5ed 100644 --- a/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderSortUI.jsx +++ b/frontend/src/AppBuilder/QueryManager/QueryEditors/TooljetDatabase/RenderSortUI.jsx @@ -86,10 +86,7 @@ const RenderSortUI = ({ removeSortConditionPair(id)} > diff --git a/frontend/src/_styles/queryManager.scss b/frontend/src/_styles/queryManager.scss index 8a9eaf972a..ece491e06a 100644 --- a/frontend/src/_styles/queryManager.scss +++ b/frontend/src/_styles/queryManager.scss @@ -1851,8 +1851,9 @@ $border-radius: 4px; .tjdb-codhinter-wrapper{ .codehinter-input{ .cm-editor{ - height: 30px !important; + // height: 30px !important; min-height: 30px !important; + max-height:100px !important; border-radius: 0 !important; border-right: 0 ; } @@ -1860,8 +1861,9 @@ $border-radius: 4px; } .tjdb-limit-offset-codehinter{ .cm-editor{ - height: 30px !important; + // height: 30px !important; min-height: 30px !important; + max-height:100px !important; } } @@ -1899,4 +1901,19 @@ $border-radius: 4px; line-height: 18px; } } +} + + +.qm-delete-btn { + min-height: 30px; + height: 100% !important; + align-items: flex-start !important; + padding-top: 6px; +} + +.restapi-key-value { + .code-hinter-wrapper, .code-editor-basic-wrapper, .codehinter-container, .cm-codehinter, .code-editor-query-panel{ + height:100%; + max-height: 100px; + } } \ No newline at end of file diff --git a/frontend/src/_styles/theme.scss b/frontend/src/_styles/theme.scss index c999eaa525..5a223dd733 100644 --- a/frontend/src/_styles/theme.scss +++ b/frontend/src/_styles/theme.scss @@ -15810,6 +15810,7 @@ tbody { } .rest-api-options-codehinter { + height: 100%; .cm-content>.cm-line { // max-width: 357px !important; } From 6952cd2292e79d36b127f247ec92949f6f70e598 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Sun, 2 Mar 2025 00:57:01 +0530 Subject: [PATCH 03/45] Fixed query panel resizing causing black bars issue --- .../src/AppBuilder/LeftSidebar/LeftSidebar.jsx | 14 ++++++++++---- frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx | 1 + frontend/src/_styles/left-sidebar.scss | 1 + 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx b/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx index 4146c4a28e..aaf12714b9 100644 --- a/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx +++ b/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx @@ -34,6 +34,7 @@ export const BaseLeftSidebar = ({ resetUnreadErrorCount, toggleLeftSidebar, isSidebarOpen, + isDraggingQueryPane, ] = useStore( (state) => [ state.isLeftSideBarPinned, @@ -46,6 +47,7 @@ export const BaseLeftSidebar = ({ state.debugger.resetUnreadErrorCount, state.toggleLeftSidebar, state.isSidebarOpen, + state.queryPanel.isDraggingQueryPane, ], shallow ); @@ -68,11 +70,15 @@ export const BaseLeftSidebar = ({ }; useEffect(() => { - setPopoverContentHeight( - ((window.innerHeight - (queryPanelHeight == 0 ? 40 : queryPanelHeight) - 45) / window.innerHeight) * 100 - ); + if (!isDraggingQueryPane) { + setPopoverContentHeight( + ((window.innerHeight - (queryPanelHeight == 0 ? 40 : queryPanelHeight) - 45) / window.innerHeight) * 100 + ); + } else { + setPopoverContentHeight(100); + } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [queryPanelHeight]); + }, [queryPanelHeight, isDraggingQueryPane]); const renderPopoverContent = () => { if (selectedSidebarItem === null || !isSidebarOpen) return null; diff --git a/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx b/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx index 827efe6d33..ea8623b0c1 100644 --- a/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx +++ b/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx @@ -185,6 +185,7 @@ export const QueryPanel = ({ darkMode }) => { id="query-manager" style={{ height: `calc(100% - ${isExpanded ? height : 100}%)`, + maxHeight: '93.5%', cursor: isDraggingQueryPane || isTopOfQueryPanel ? 'row-resize' : 'default', ...(!isExpanded && { border: 'none', diff --git a/frontend/src/_styles/left-sidebar.scss b/frontend/src/_styles/left-sidebar.scss index 3f68e1486b..82b6762b54 100644 --- a/frontend/src/_styles/left-sidebar.scss +++ b/frontend/src/_styles/left-sidebar.scss @@ -701,6 +701,7 @@ .sidebar-h-100-popover { position: relative; height: 100vh; + overflow-y:scroll !important; margin-top: 0px; border-radius: 0px !important; From b4ff440e8705d56207cfa7e8fd8255af6dc5caaf Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Sun, 2 Mar 2025 13:09:56 +0530 Subject: [PATCH 04/45] Fixed popover values not saving when clicking on draggable items on inspector --- .../RightSideBar/Inspector/Components/Select.jsx | 5 +++++ .../RightSideBar/Inspector/Components/Table/Table.jsx | 8 +++++++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx index a57c879121..d0b058b7b0 100644 --- a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx +++ b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx @@ -388,6 +388,11 @@ export function Select({ componentMeta, darkMode, ...restProps }) { placement="left" rootClose overlay={_renderOverlay(item, index)} + onToggle={(isOpen) => { + if (!isOpen) { + document.activeElement?.blur(); // Manually trigger blur when popover closes + } + }} >
this.setState({ showPopOver: showing })} + onToggle={(showing) => { + if (!showing) { + document.activeElement?.blur(); // Manually trigger blur when popover closes + } + this.setState({ showPopOver: showing }); + }} >
@@ -647,6 +652,7 @@ class TableComponent extends React.Component { if (show) { this.handleToggleColumnPopover(index); } else { + document.activeElement?.blur(); // Manually trigger blur when popover closes this.handleToggleColumnPopover(null); } }} From 3c68cd6f5a6c3b2fe390e5570b5afc7795ea99fb Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Mon, 3 Mar 2025 02:39:32 +0530 Subject: [PATCH 05/45] Code hinter issue fix --- .../src/AppBuilder/CodeEditor/PreviewBox.jsx | 16 ++- .../CodeEditor/SingleLineCodeEditor.jsx | 120 +++++++++++------- .../src/AppBuilder/CodeEditor/styles.scss | 5 + frontend/src/_styles/theme.scss | 7 +- 4 files changed, 99 insertions(+), 49 deletions(-) diff --git a/frontend/src/AppBuilder/CodeEditor/PreviewBox.jsx b/frontend/src/AppBuilder/CodeEditor/PreviewBox.jsx index 2429973c25..ce12c1b250 100644 --- a/frontend/src/AppBuilder/CodeEditor/PreviewBox.jsx +++ b/frontend/src/AppBuilder/CodeEditor/PreviewBox.jsx @@ -294,13 +294,9 @@ const PreviewContainer = ({ ...restProps }) => { const { validationSchema, isWorkspaceVariable, errorStateActive, previewPlacement, validationFn } = restProps; - const [errorMessage, setErrorMessage] = useState(''); - const typeofError = getCurrentNodeType(errorMessage); - const errorMsg = typeofError === 'Array' ? errorMessage[0] : errorMessage; - const darkMode = localStorage.getItem('darkMode') === 'true'; const popover = ( { + // Force position update on first render + // This is done to avoid scroll issue + if (state.elements.popper) { + state.elements.popper.style.position = 'fixed'; + } + }, }} > {(props) => React.cloneElement(popover, props)} diff --git a/frontend/src/AppBuilder/CodeEditor/SingleLineCodeEditor.jsx b/frontend/src/AppBuilder/CodeEditor/SingleLineCodeEditor.jsx index 1243f26f43..98325df3a8 100644 --- a/frontend/src/AppBuilder/CodeEditor/SingleLineCodeEditor.jsx +++ b/frontend/src/AppBuilder/CodeEditor/SingleLineCodeEditor.jsx @@ -1,5 +1,5 @@ /* eslint-disable import/no-unresolved */ -import React, { useContext, useEffect, useMemo, useRef, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { PreviewBox } from './PreviewBox'; import { ToolTip } from '@/Editor/Inspector/Elements/Components/ToolTip'; import { useTranslation } from 'react-i18next'; @@ -31,6 +31,7 @@ const SingleLineCodeEditor = ({ componentName, fieldMeta = {}, componentId, ...r const [currentValue, setCurrentValue] = useState(''); const [errorStateActive, setErrorStateActive] = useState(false); const [cursorInsidePreview, setCursorInsidePreview] = useState(false); + const [showSuggestions, setShowSuggestions] = useState(true); const validationFn = restProps?.validationFn; const componentDefinition = useStore((state) => state.getComponentDefinition(componentId), shallow); const parentId = componentDefinition?.component?.parent; @@ -38,6 +39,30 @@ const SingleLineCodeEditor = ({ componentName, fieldMeta = {}, componentId, ...r const customVariables = customResolvables?.[parentId]?.[0] || {}; + useEffect(() => { + const observer = new IntersectionObserver( + ([entry]) => { + if (entry.intersectionRatio < 1) { + setShowPreview(false); + setShowSuggestions(false); + } else { + setShowSuggestions(true); + } + }, + { root: null, threshold: [1] } // Fires when any part of the element is out of view + ); + + if (wrapperRef.current) { + observer.observe(wrapperRef.current); + } + + return () => { + if (wrapperRef.current) { + observer.unobserve(wrapperRef.current); + } + }; + }, []); + const isPreviewFocused = useRef(false); const wrapperRef = useRef(null); @@ -136,6 +161,7 @@ const SingleLineCodeEditor = ({ componentName, fieldMeta = {}, componentId, ...r componentName={componentName} setShowPreview={setShowPreview} showPreview={showPreview} + showSuggestions={showSuggestions} {...restProps} />
@@ -168,6 +194,7 @@ const EditorInput = ({ previewRef, setShowPreview, onInputChange, + showSuggestions, }) => { const getSuggestions = useStore((state) => state.getSuggestions, shallow); function autoCompleteExtensionConfig(context) { @@ -223,7 +250,7 @@ const EditorInput = ({ defaultKeymap: true, positionInfo: () => { return { - class: 'cm-completionInfo-top cm-custom-completion-info', + class: 'cm-completionInfo-top cm-custom-completion-info cm-custom-singleline-completion-info', }; }, maxRenderedOptions: 10, @@ -339,15 +366,6 @@ const EditorInput = ({ data-cy={`${cyLabel}-input-field`} > {/* sticky element to position the preview box correctly on top without flowing out of container */} -
{usePortalEditor && ( - { - setFirstTimeFocus(false); - handleOnChange(val); - onInputChange && onInputChange(val); +
handleFocus()} - onBlur={() => handleOnBlur()} - className={customClassNames} - theme={theme} - indentWithTab={false} - readOnly={disabled} - /> + className="check-here" + ref={previewRef} + > + { + setFirstTimeFocus(false); + handleOnChange(val); + onInputChange && onInputChange(val); + }} + basicSetup={{ + lineNumbers: showLineNumbers, + syntaxHighlighting: true, + bracketMatching: true, + foldGutter: false, + highlightActiveLine: false, + autocompletion: showSuggestions, + completionKeymap: true, + searchKeymap: false, + }} + onMouseDown={() => handleFocus()} + onBlur={() => handleOnBlur()} + className={customClassNames} + theme={theme} + indentWithTab={false} + readOnly={disabled} + /> +
diff --git a/frontend/src/AppBuilder/CodeEditor/styles.scss b/frontend/src/AppBuilder/CodeEditor/styles.scss index c646fd30b1..73ba4ac36e 100644 --- a/frontend/src/AppBuilder/CodeEditor/styles.scss +++ b/frontend/src/AppBuilder/CodeEditor/styles.scss @@ -651,4 +651,9 @@ .cm-searchMatch.cm-searchMatch-selected { background-color: #F28F2D; +} + + +.cm-custom-singleline-completion-info { + display: none; } \ No newline at end of file diff --git a/frontend/src/_styles/theme.scss b/frontend/src/_styles/theme.scss index c999eaa525..84b1d6dc80 100644 --- a/frontend/src/_styles/theme.scss +++ b/frontend/src/_styles/theme.scss @@ -1544,7 +1544,7 @@ button { .tab-content { overflow-y: auto; // TAB HEADER HEIGHT + FOOTER HEIGHT + Extra padding = 120px - height: calc(100vh - 7.5rem); + height: calc(100vh - 10.4rem); // Hide scrollbar -ms-overflow-style: none; /* IE and Edge */ @@ -18562,4 +18562,9 @@ section.ai-message-prompt-input-wrapper { margin-left: 8px; flex-grow: 1; } +} + + +.cm-tooltip { + z-index: 9999 !important; } \ No newline at end of file From 5e826c2f6fe60575760d6fd02f91fd59a09f8f78 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Mon, 3 Mar 2025 12:33:17 +0530 Subject: [PATCH 06/45] Dropdown breaking fix --- .../RightSideBar/Inspector/Components/Select.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx index d0b058b7b0..456b54cd02 100644 --- a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx +++ b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx @@ -297,7 +297,7 @@ export function Select({ componentMeta, darkMode, ...restProps }) {
{options?.map((item, index) => { return ( - + {(provided, snapshot) => (
-
+
setHoveredOptionIndex(index)} @@ -406,7 +406,7 @@ export function Select({ componentMeta, darkMode, ...restProps }) {
- {getResolvedValue(item.label)} + {getResolvedValue(item?.label)}
{index === hoveredOptionIndex && ( From 49c2a5b5a8a759fe78fb80eaa2d546e4f18098f6 Mon Sep 17 00:00:00 2001 From: devanshu052000 Date: Tue, 18 Feb 2025 21:58:59 +0530 Subject: [PATCH 07/45] Fix: Application crash on startup due to invalid query parameters --- frontend/src/_helpers/utils.js | 24 +++++++++++++----------- 1 file changed, 13 insertions(+), 11 deletions(-) diff --git a/frontend/src/_helpers/utils.js b/frontend/src/_helpers/utils.js index 07f0b6dccb..7373260691 100644 --- a/frontend/src/_helpers/utils.js +++ b/frontend/src/_helpers/utils.js @@ -242,18 +242,20 @@ export function resolveReferences( } else { const dynamicVariables = getDynamicVariables(object); - for (const dynamicVariable of dynamicVariables) { - const value = resolveString( - dynamicVariable, - state, - customObjects, - reservedKeyword, - withError, - forPreviewBox - ); + if (dynamicVariables) { + for (const dynamicVariable of dynamicVariables) { + const value = resolveString( + dynamicVariable, + state, + customObjects, + reservedKeyword, + withError, + forPreviewBox + ); - if (typeof value !== 'function') { - object = object.replace(dynamicVariable, value); + if (typeof value !== 'function') { + object = object.replace(dynamicVariable, value); + } } } } From 154927404baf6b8553be9df326ad3162d3b4720e Mon Sep 17 00:00:00 2001 From: Nakul Nagargade Date: Thu, 6 Mar 2025 15:18:40 +0530 Subject: [PATCH 08/45] Fix alignment issues arising due to label width setting for input components --- frontend/src/_ui/Label.jsx | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/_ui/Label.jsx b/frontend/src/_ui/Label.jsx index 3cd7f886cb..721ac05203 100644 --- a/frontend/src/_ui/Label.jsx +++ b/frontend/src/_ui/Label.jsx @@ -13,6 +13,7 @@ function Label({ label, width, labelRef, color, defaultAlignment, direction, aut justifyContent: direction == 'right' ? 'flex-end' : 'flex-start', fontSize: '12px', height: defaultAlignment === 'top' && '20px', + overflow: 'hidden', }} >

Date: Tue, 18 Feb 2025 01:24:23 +0530 Subject: [PATCH 09/45] feat: added method for unsetting all page and global variables --- frontend/src/AppBuilder/CodeBuilder/utils.js | 2 ++ .../AppBuilder/_stores/slices/eventsSlice.js | 28 +++++++++++++++++ .../_stores/slices/resolvedSlice.js | 30 +++++++++++++++++++ frontend/src/AppBuilder/_stores/utils.js | 2 ++ frontend/src/Editor/ActionTypes.js | 9 ++++++ 5 files changed, 71 insertions(+) diff --git a/frontend/src/AppBuilder/CodeBuilder/utils.js b/frontend/src/AppBuilder/CodeBuilder/utils.js index 7a75bdb3b8..be3674aa1f 100644 --- a/frontend/src/AppBuilder/CodeBuilder/utils.js +++ b/frontend/src/AppBuilder/CodeBuilder/utils.js @@ -74,6 +74,7 @@ export function getSuggestionKeys(refState) { 'setVariable', 'getVariable', 'unSetVariable', + 'unsetAllVariables', 'showAlert', 'logout', 'showModal', @@ -85,6 +86,7 @@ export function getSuggestionKeys(refState) { 'setPageVariable', 'getPageVariable', 'unsetPageVariable', + 'unsetAllPageVariables', 'switchPage', ]; diff --git a/frontend/src/AppBuilder/_stores/slices/eventsSlice.js b/frontend/src/AppBuilder/_stores/slices/eventsSlice.js index 948ac39b39..995050d023 100644 --- a/frontend/src/AppBuilder/_stores/slices/eventsSlice.js +++ b/frontend/src/AppBuilder/_stores/slices/eventsSlice.js @@ -690,6 +690,12 @@ export const createEventsSlice = (set, get) => ({ return getVariable(key); } + case 'unset-all-custom-variables': { + const { unsetAllVariables } = get(); + unsetAllVariables(); + return Promise.resolve(); + } + case 'unset-custom-variable': { const { unsetVariable } = get(); const key = getResolvedValue(event.key, customVariables); @@ -746,6 +752,12 @@ export const createEventsSlice = (set, get) => ({ return getPageVariable(key); } + case 'unset-all-page-variables': { + const { unsetAllPageVariables } = get(); + unsetAllPageVariables(); + return Promise.resolve(); + } + case 'unset-page-variable': { const { unsetPageVariable } = get(); const key = getResolvedValue(event.key, customVariables); @@ -953,6 +965,13 @@ export const createEventsSlice = (set, get) => ({ } }; + const unsetAllVariables = () => { + const event = { + actionId: 'unset-all-custom-variables', + }; + return executeAction(event, mode, {}); + }; + const unSetVariable = (key = '') => { if (key) { const event = { @@ -1066,6 +1085,13 @@ export const createEventsSlice = (set, get) => ({ return executeAction(event, mode, {}); }; + const unsetAllPageVariables = () => { + const event = { + actionId: 'unset-all-page-variables', + }; + return executeAction(event, mode, {}); + }; + const unsetPageVariable = (key = '') => { const event = { actionId: 'unset-page-variable', @@ -1133,6 +1159,7 @@ export const createEventsSlice = (set, get) => ({ runQuery, setVariable, getVariable, + unsetAllVariables, unSetVariable, showAlert, logout, @@ -1144,6 +1171,7 @@ export const createEventsSlice = (set, get) => ({ generateFile, setPageVariable, getPageVariable, + unsetAllPageVariables, unsetPageVariable, switchPage, logInfo, diff --git a/frontend/src/AppBuilder/_stores/slices/resolvedSlice.js b/frontend/src/AppBuilder/_stores/slices/resolvedSlice.js index ebbd524fd1..b76c8b072d 100644 --- a/frontend/src/AppBuilder/_stores/slices/resolvedSlice.js +++ b/frontend/src/AppBuilder/_stores/slices/resolvedSlice.js @@ -140,6 +140,21 @@ export const createResolvedSlice = (set, get) => ({ get().updateDependencyValues(`variables.${key}`); }, + unsetAllVariables: (moduleId = 'canvas') => { + const variables = get().resolvedStore.modules[moduleId].exposedValues.variables; + set( + (state) => { + state.resolvedStore.modules[moduleId].exposedValues.variables = {}; + }, + false, + 'unsetAllVariables' + ); + Object.keys(variables).forEach((key) => { + get().removeNode(`variables.${key}`); + get().updateDependencyValues(`variables.${key}`); + }); + }, + // page.variables setPageVariable: (key, value, moduleId = 'canvas') => { set( @@ -167,6 +182,21 @@ export const createResolvedSlice = (set, get) => ({ get().updateDependencyValues(`page.variables.${key}`); }, + unsetAllPageVariables: (moduleId = 'canvas') => { + const pageVariables = get().resolvedStore.modules[moduleId].exposedValues.page.variables; + set( + (state) => { + state.resolvedStore.modules[moduleId].exposedValues.page.variables = {}; + }, + false, + 'unsetAllPageVariables' + ); + Object.keys(pageVariables).forEach((key) => { + get().removeNode(`page.variables.${key}`); + get().updateDependencyValues(`page.variables.${key}`); + }); + }, + setResolvedQuery: (queryId, details, moduleId = 'canvas') => { set( (state) => { diff --git a/frontend/src/AppBuilder/_stores/utils.js b/frontend/src/AppBuilder/_stores/utils.js index bb08c620da..33e50eb9cc 100644 --- a/frontend/src/AppBuilder/_stores/utils.js +++ b/frontend/src/AppBuilder/_stores/utils.js @@ -473,6 +473,7 @@ export function createReferencesLookup(currentState, forQueryParams = false, ini const actions = [ 'runQuery', 'setVariable', + 'unsetAllVariables', 'unSetVariable', 'showAlert', 'logout', @@ -483,6 +484,7 @@ export function createReferencesLookup(currentState, forQueryParams = false, ini 'goToApp', 'generateFile', 'setPageVariable', + 'unsetAllPageVariables', 'unsetPageVariable', 'switchPage', 'logInfo', diff --git a/frontend/src/Editor/ActionTypes.js b/frontend/src/Editor/ActionTypes.js index 01b0a34759..0bad71b3ac 100644 --- a/frontend/src/Editor/ActionTypes.js +++ b/frontend/src/Editor/ActionTypes.js @@ -78,6 +78,10 @@ export const ActionTypes = [ { name: 'value', type: 'code', default: '' }, ], }, + { + name: 'Unset all variables', + id: 'unset-all-custom-variables', + }, { name: 'Unset variable', id: 'unset-custom-variable', @@ -96,6 +100,10 @@ export const ActionTypes = [ { name: 'value', type: 'code', default: '' }, ], }, + { + name: 'Unset all page variables', + id: 'unset-all-page-variables', + }, { name: 'Unset page variable', id: 'unset-page-variable', @@ -104,6 +112,7 @@ export const ActionTypes = [ { name: 'value', type: 'code', default: '' }, ], }, + { name: 'Control component', id: 'control-component', From 8c0e2c9396daa76fa95f7eed8aa7eb29cccaf5e9 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Fri, 21 Feb 2025 02:22:14 +0530 Subject: [PATCH 10/45] Fixed transformation issue causing query to not retain multiple transformation types --- .../Components/Transformation.jsx | 28 ++++++++++--------- 1 file changed, 15 insertions(+), 13 deletions(-) diff --git a/frontend/src/AppBuilder/QueryManager/Components/Transformation.jsx b/frontend/src/AppBuilder/QueryManager/Components/Transformation.jsx index 52178043cf..2234fa8e50 100644 --- a/frontend/src/AppBuilder/QueryManager/Components/Transformation.jsx +++ b/frontend/src/AppBuilder/QueryManager/Components/Transformation.jsx @@ -108,7 +108,8 @@ export const Transformation = ({ changeOption, options, darkMode, queryId, rende const [codeEditorKey, setCodeEditorKey] = useState(uuidv4()); const [state, setState] = useState({ ...defaultValue, - [options.transformationLanguage ?? 'javascript']: options?.transformation, + ...(options?.transformation ? { [options.transformationLanguage ?? 'javascript']: options?.transformation } : {}), + ...options?.transformations, }); const { t } = useTranslation(); @@ -119,7 +120,6 @@ export const Transformation = ({ changeOption, options, darkMode, queryId, rende useEffect(() => { if (lang !== (options.transformationLanguage ?? 'javascript')) { changeOption('transformationLanguage', lang); - changeOption('transformation', state[lang]); } // eslint-disable-next-line react-hooks/exhaustive-deps }, [lang]); @@ -127,20 +127,24 @@ export const Transformation = ({ changeOption, options, darkMode, queryId, rende useEffect(() => { if (prevQueryId.current === queryId) { lang !== (options.transformationLanguage ?? 'javascript') && changeOption('transformationLanguage', lang); - setState({ ...state, [lang]: options.transformation ?? state[lang] ?? defaultValue[lang] }); + setState((prevState) => { + return { + ...prevState, + ...(options?.transformation + ? { [options.transformationLanguage ?? 'javascript']: options?.transformation } + : {}), + ...options?.transformations, + }; + }); } prevQueryId.current = queryId; // eslint-disable-next-line react-hooks/exhaustive-deps - }, [JSON.stringify(options.transformation)]); + }, [JSON.stringify(options?.transformation || {}), JSON.stringify(options.transformations)]); useEffect(() => { if (selectedQueryId !== queryId) { - const nonLangdefaultCode = getNonActiveTransformations(options?.transformationLanguage ?? 'javascript'); - const finalState = _.merge( - {}, - { [options?.transformationLanguage ?? lang]: options.transformation ?? defaultValue[lang] }, - nonLangdefaultCode - ); + const olderTransformation = options?.transformation ? { [lang]: options?.transformation } : {}; + const finalState = _.merge({}, defaultValue, olderTransformation, options?.transformations); setState(finalState); } @@ -206,8 +210,6 @@ export const Transformation = ({ changeOption, options, darkMode, queryId, rende activeKey={lang} onSelect={(value) => { setLang(value); - changeOption('transformationLanguage', value); - changeOption('transformation', state[value]); }} defaultActiveKey="javascript" > @@ -250,7 +252,7 @@ export const Transformation = ({ changeOption, options, darkMode, queryId, rende height={400} className="query-hinter" onChange={(value) => { - changeOption('transformation', value); + changeOption('transformations', { ...state, [lang]: value }); }} renderCopilot={renderCopilot} componentName={`transformation`} From 064953b7501a506127c6cb14642381b37572b94e Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Mon, 3 Mar 2025 23:17:37 +0530 Subject: [PATCH 11/45] Fixed issue causing field is empty error to popup on 0 --- frontend/src/AppBuilder/_stores/slices/componentsSlice.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/AppBuilder/_stores/slices/componentsSlice.js b/frontend/src/AppBuilder/_stores/slices/componentsSlice.js index 702bb8dfcc..1cd904efe2 100644 --- a/frontend/src/AppBuilder/_stores/slices/componentsSlice.js +++ b/frontend/src/AppBuilder/_stores/slices/componentsSlice.js @@ -502,7 +502,7 @@ export const createComponentsSlice = (set, get) => ({ const resolvedMandatory = getResolvedValue(mandatory, customResolveObjects) || false; - if (resolvedMandatory == true && !widgetValue) { + if (resolvedMandatory == true && !widgetValue && widgetValue !== 0) { return { isValid: false, validationError: `Field cannot be empty`, From 3c4f9a1c7a09fc80a24104b87e1207daaeeaff9f Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Tue, 4 Mar 2025 16:32:19 +0530 Subject: [PATCH 12/45] Button group csa added --- .../WidgetManager/widgets/buttonGroup.js | 7 +++++ .../src/Editor/Components/ButtonGroup.jsx | 29 +++++++++++++++++++ .../services/widget-config/buttonGroup.js | 8 +++++ 3 files changed, 44 insertions(+) diff --git a/frontend/src/AppBuilder/WidgetManager/widgets/buttonGroup.js b/frontend/src/AppBuilder/WidgetManager/widgets/buttonGroup.js index c0fa889dd5..ab3eb40c2c 100644 --- a/frontend/src/AppBuilder/WidgetManager/widgets/buttonGroup.js +++ b/frontend/src/AppBuilder/WidgetManager/widgets/buttonGroup.js @@ -127,6 +127,13 @@ export const buttonGroupConfig = { exposedVariables: { selected: [1], }, + actions: [ + { + handle: 'setSelected', + displayName: 'Select option', + params: [{ handle: 'selected', displayName: 'Value' }], + }, + ], definition: { others: { showOnDesktop: { value: '{{true}}' }, diff --git a/frontend/src/Editor/Components/ButtonGroup.jsx b/frontend/src/Editor/Components/ButtonGroup.jsx index 7364348271..a9526576ff 100644 --- a/frontend/src/Editor/Components/ButtonGroup.jsx +++ b/frontend/src/Editor/Components/ButtonGroup.jsx @@ -66,6 +66,35 @@ export const ButtonGroup = function Button({ // eslint-disable-next-line react-hooks/exhaustive-deps }, [multiSelection]); + const setSelected = (selected) => { + if (multiSelection) { + if (Array.isArray(selected)) { + const filteredItems = selected.filter((item) => values.includes(item)); + setDefaultActive(filteredItems); + setExposedVariable('selected', filteredItems.join(',')); + } else if ((typeof selected === 'string' || typeof selected === 'number') && values.includes(selected)) { + setDefaultActive([selected]); + setExposedVariable('selected', String(selected)); + } + } else { + if (Array.isArray(selected)) { + const filteredItems = selected.filter((item) => values.includes(item)); + console.log('filterdItems', filteredItems); + if (filteredItems?.length >= 1) { + setDefaultActive([filteredItems[0]]); + setExposedVariable('selected', String(filteredItems[0])); + } + } else if ((typeof selected === 'string' || typeof selected === 'number') && values.includes(selected)) { + setDefaultActive([selected]); + setExposedVariable('selected', String(selected)); + } + } + }; + + useEffect(() => { + setExposedVariable('setSelected', setSelected); + }, [multiSelection]); + const buttonClick = (index) => { if (defaultActive?.includes(values[index]) && multiSelection) { const copyDefaultActive = [...defaultActive]; diff --git a/server/src/modules/apps/services/widget-config/buttonGroup.js b/server/src/modules/apps/services/widget-config/buttonGroup.js index c0fa889dd5..4523a98bb7 100644 --- a/server/src/modules/apps/services/widget-config/buttonGroup.js +++ b/server/src/modules/apps/services/widget-config/buttonGroup.js @@ -127,6 +127,14 @@ export const buttonGroupConfig = { exposedVariables: { selected: [1], }, + actions: [ + { + handle: 'setSelected', + displayName: 'Select option', + params: [{ handle: 'selected', displayName: 'Value' }], + }, + ], + definition: { others: { showOnDesktop: { value: '{{true}}' }, From 791b60a17e7565d8d5e0cfc2fcfc17eaa8542011 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Tue, 4 Mar 2025 19:58:43 +0530 Subject: [PATCH 13/45] Small issue fix --- frontend/src/Editor/Components/ButtonGroup.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/frontend/src/Editor/Components/ButtonGroup.jsx b/frontend/src/Editor/Components/ButtonGroup.jsx index a9526576ff..67618a61ab 100644 --- a/frontend/src/Editor/Components/ButtonGroup.jsx +++ b/frontend/src/Editor/Components/ButtonGroup.jsx @@ -79,7 +79,6 @@ export const ButtonGroup = function Button({ } else { if (Array.isArray(selected)) { const filteredItems = selected.filter((item) => values.includes(item)); - console.log('filterdItems', filteredItems); if (filteredItems?.length >= 1) { setDefaultActive([filteredItems[0]]); setExposedVariable('selected', String(filteredItems[0])); @@ -93,7 +92,7 @@ export const ButtonGroup = function Button({ useEffect(() => { setExposedVariable('setSelected', setSelected); - }, [multiSelection]); + }, [multiSelection, values]); const buttonClick = (index) => { if (defaultActive?.includes(values[index]) && multiSelection) { From 1d83543abf4784d70d98984c027d6695c24a14ec Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Sun, 2 Mar 2025 13:09:56 +0530 Subject: [PATCH 14/45] Fixed popover values not saving when clicking on draggable items on inspector --- .../RightSideBar/Inspector/Components/Select.jsx | 5 +++++ .../RightSideBar/Inspector/Components/Table/Table.jsx | 8 +++++++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx index db52205467..cb5065efda 100644 --- a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx +++ b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx @@ -386,6 +386,11 @@ export function Select({ componentMeta, darkMode, ...restProps }) { placement="left" rootClose overlay={_renderOverlay(item, index)} + onToggle={(isOpen) => { + if (!isOpen) { + document.activeElement?.blur(); // Manually trigger blur when popover closes + } + }} >

this.setState({ showPopOver: showing })} + onToggle={(showing) => { + if (!showing) { + document.activeElement?.blur(); // Manually trigger blur when popover closes + } + this.setState({ showPopOver: showing }); + }} >
@@ -647,6 +652,7 @@ class TableComponent extends React.Component { if (show) { this.handleToggleColumnPopover(index); } else { + document.activeElement?.blur(); // Manually trigger blur when popover closes this.handleToggleColumnPopover(null); } }} From 6d8f00557fc7372a40b3ae42bc5402d29712402b Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Mon, 3 Mar 2025 12:33:17 +0530 Subject: [PATCH 15/45] Dropdown breaking fix --- .../RightSideBar/Inspector/Components/Select.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx index cb5065efda..ded481fadb 100644 --- a/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx +++ b/frontend/src/AppBuilder/RightSideBar/Inspector/Components/Select.jsx @@ -295,7 +295,7 @@ export function Select({ componentMeta, darkMode, ...restProps }) {
{options?.map((item, index) => { return ( - + {(provided, snapshot) => (
-
+
setHoveredOptionIndex(index)} @@ -404,7 +404,7 @@ export function Select({ componentMeta, darkMode, ...restProps }) {
- {getResolvedValue(item.label)} + {getResolvedValue(item?.label)}
{index === hoveredOptionIndex && ( From 293c3d7939fac977fb5f610d73f5c9f2d7285654 Mon Sep 17 00:00:00 2001 From: Shaurya Sharma Date: Sun, 2 Mar 2025 00:57:01 +0530 Subject: [PATCH 16/45] Fixed query panel resizing causing black bars issue --- .../src/AppBuilder/LeftSidebar/LeftSidebar.jsx | 14 ++++++++++---- frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx | 1 + frontend/src/_styles/left-sidebar.scss | 1 + 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx b/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx index 4146c4a28e..aaf12714b9 100644 --- a/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx +++ b/frontend/src/AppBuilder/LeftSidebar/LeftSidebar.jsx @@ -34,6 +34,7 @@ export const BaseLeftSidebar = ({ resetUnreadErrorCount, toggleLeftSidebar, isSidebarOpen, + isDraggingQueryPane, ] = useStore( (state) => [ state.isLeftSideBarPinned, @@ -46,6 +47,7 @@ export const BaseLeftSidebar = ({ state.debugger.resetUnreadErrorCount, state.toggleLeftSidebar, state.isSidebarOpen, + state.queryPanel.isDraggingQueryPane, ], shallow ); @@ -68,11 +70,15 @@ export const BaseLeftSidebar = ({ }; useEffect(() => { - setPopoverContentHeight( - ((window.innerHeight - (queryPanelHeight == 0 ? 40 : queryPanelHeight) - 45) / window.innerHeight) * 100 - ); + if (!isDraggingQueryPane) { + setPopoverContentHeight( + ((window.innerHeight - (queryPanelHeight == 0 ? 40 : queryPanelHeight) - 45) / window.innerHeight) * 100 + ); + } else { + setPopoverContentHeight(100); + } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [queryPanelHeight]); + }, [queryPanelHeight, isDraggingQueryPane]); const renderPopoverContent = () => { if (selectedSidebarItem === null || !isSidebarOpen) return null; diff --git a/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx b/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx index 827efe6d33..ea8623b0c1 100644 --- a/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx +++ b/frontend/src/AppBuilder/QueryPanel/QueryPanel.jsx @@ -185,6 +185,7 @@ export const QueryPanel = ({ darkMode }) => { id="query-manager" style={{ height: `calc(100% - ${isExpanded ? height : 100}%)`, + maxHeight: '93.5%', cursor: isDraggingQueryPane || isTopOfQueryPanel ? 'row-resize' : 'default', ...(!isExpanded && { border: 'none', diff --git a/frontend/src/_styles/left-sidebar.scss b/frontend/src/_styles/left-sidebar.scss index 3f68e1486b..82b6762b54 100644 --- a/frontend/src/_styles/left-sidebar.scss +++ b/frontend/src/_styles/left-sidebar.scss @@ -701,6 +701,7 @@ .sidebar-h-100-popover { position: relative; height: 100vh; + overflow-y:scroll !important; margin-top: 0px; border-radius: 0px !important; From ecd9055090dbbef63154555722ac01ae10ef23a7 Mon Sep 17 00:00:00 2001 From: Nakul Nagargade Date: Fri, 7 Mar 2025 21:48:04 +0530 Subject: [PATCH 17/45] fix --- frontend/src/_ui/Label.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/_ui/Label.jsx b/frontend/src/_ui/Label.jsx index 721ac05203..443f4ddc6e 100644 --- a/frontend/src/_ui/Label.jsx +++ b/frontend/src/_ui/Label.jsx @@ -13,7 +13,7 @@ function Label({ label, width, labelRef, color, defaultAlignment, direction, aut justifyContent: direction == 'right' ? 'flex-end' : 'flex-start', fontSize: '12px', height: defaultAlignment === 'top' && '20px', - overflow: 'hidden', + overflow: auto ? 'visible' : 'hidden', }} >

Date: Mon, 10 Mar 2025 13:38:17 +0530 Subject: [PATCH 18/45] fix: appbuilder modularisation bugs --- .../QueryManager/Components/DataSourceSelect.jsx | 8 ++++++-- server/src/modules/versions/util.service.ts | 6 +++++- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/frontend/src/AppBuilder/QueryManager/Components/DataSourceSelect.jsx b/frontend/src/AppBuilder/QueryManager/Components/DataSourceSelect.jsx index 0cdcdb844b..f0a3bbe811 100644 --- a/frontend/src/AppBuilder/QueryManager/Components/DataSourceSelect.jsx +++ b/frontend/src/AppBuilder/QueryManager/Components/DataSourceSelect.jsx @@ -7,7 +7,7 @@ import { getWorkspaceId, decodeEntities } from '@/_helpers/utils'; import { ButtonSolid } from '@/_ui/AppButton/AppButton'; import { useDataSources, useGlobalDataSources, useSampleDataSource } from '@/_stores/dataSourcesStore'; import { useDataQueriesActions } from '@/_stores/dataQueriesStore'; -import { staticDataSources as staticDatasources } from '../constants'; +import { defaultSources, staticDataSources as staticDatasources } from '../constants'; import { useQueryPanelActions } from '@/_stores/queryPanelStore'; import Search from '@/_ui/Icon/solidIcons/Search'; import { Tooltip } from 'react-tooltip'; @@ -135,7 +135,7 @@ function DataSourceSelect({ isDisabled, selectRef, closePopup, workflowDataSourc

{' '} - {source.name} + {defaultSources[cleanWord(source.name)].name}
), @@ -178,6 +178,10 @@ function DataSourceSelect({ isDisabled, selectRef, closePopup, workflowDataSourc } }; + function cleanWord(word) { + return word.replace(/default/g, ''); + } + return (
- +
handleEncryptedFieldsToggle(name)} + data-cy={`button-${(disabled ? 'Edit' : 'Cancel').toLowerCase().replace(/\s+/g, '-')}`} > {disabled ? 'Edit' : 'Cancel'} diff --git a/frontend/src/_ui/Accordion/AccordionItem.js b/frontend/src/_ui/Accordion/AccordionItem.js index 22fe54512d..79fd86a41f 100644 --- a/frontend/src/_ui/Accordion/AccordionItem.js +++ b/frontend/src/_ui/Accordion/AccordionItem.js @@ -1,5 +1,5 @@ -import React, { useEffect } from 'react'; -import cx from 'classnames'; +import React, { useEffect } from "react"; +import cx from "classnames"; const AccordionItem = ({ open = true, index, title, children }) => { const [show, setShow] = React.useState(open); @@ -13,7 +13,7 @@ const AccordionItem = ({ open = true, index, title, children }) => { function isNotEmpty(item) { if (Array.isArray(item)) { return item.some(isNotEmpty); // Check if any element in the array is not empty - } else if (typeof item === 'object') { + } else if (typeof item === "object") { return Object.keys(item).some((key) => isNotEmpty(item[key])); // Check if any key in the object is not empty } else { return Boolean(item); // Check if the item itself is truthy @@ -23,7 +23,7 @@ const AccordionItem = ({ open = true, index, title, children }) => { function removeEmptyItems(input) { if (Array.isArray(input)) { return input.filter(isNotEmpty); - } else if (typeof input === 'object') { + } else if (typeof input === "object") { return isNotEmpty(input) ? input : null; } else { return input; @@ -31,22 +31,38 @@ const AccordionItem = ({ open = true, index, title, children }) => { } return (
-

-
- {title} +

+
+ + {title} +

{newChildren}
diff --git a/frontend/src/_ui/HttpHeaders/SourceEditor.jsx b/frontend/src/_ui/HttpHeaders/SourceEditor.jsx index a7ebbd368c..959c25941c 100644 --- a/frontend/src/_ui/HttpHeaders/SourceEditor.jsx +++ b/frontend/src/_ui/HttpHeaders/SourceEditor.jsx @@ -14,13 +14,15 @@ export default ({ workspaceConstants, isDisabled, width, + dataCy, }) => { const darkMode = localStorage.getItem('darkMode') === 'true'; return (
{options.length === 0 && ( -
+
There are no key value pairs added
@@ -29,6 +31,7 @@ export default ({ {options.map((option, index) => (
keyValuePairValueChanged(e.target.value, 0, index)} @@ -47,6 +50,7 @@ export default ({ />