Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-24 09:28:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix hidden component not being draggable if visibility changed using CSA

Browse source
This commit is contained in:
Nakul Nagargade 2025-03-21 00:25:06 +05:30
parent 227970a1d0
commit 4b3f0ed65d
3 changed files with 8 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
frontend/src/AppBuilder/AppCanvas/Grid/Grid.jsx
View file

@ -66,6 +66,7 @@ export default function Grid({ gridWidth, currentLayout }) {
const newDragParentId = useRef(null);
const [isGroupDragging, setIsGroupDragging] = useState(false);
const checkIfAnyWidgetVisibilityChanged = useStore((state) => state.checkIfAnyWidgetVisibilityChanged(), shallow);
const getExposedValueOfComponent = useStore((state) => state.getExposedValueOfComponent, shallow);
useEffect(() => {
const selectedSet = new Set(selectedComponents);
@ -329,6 +330,8 @@ export default function Grid({ gridWidth, currentLayout }) {
const isComponentVisible = (id) => {
const component = getResolvedComponent(id);
const componentExposedVisibility = getExposedValueOfComponent(id)?.isVisible;
if (componentExposedVisibility === false) return false;
let visibility;
if (isArray(component)) {
visibility = component?.[0]?.properties?.visibility ?? component?.[0]?.styles?.visibility ?? null;
@ -630,13 +633,13 @@ export default function Grid({ gridWidth, currentLayout }) {
// When clicked on widget boundary/resizer, select the component
setSelectedComponents([e.target.id]);
}
showGridLines();
if (!isComponentVisible(e.target.id)) {
return false;
}
handleActivateNonDraggingComponents();
useGridStore.getState().actions.setResizingComponentId(e.target.id);
e.setMin([gridWidth, GRID_HEIGHT]);
showGridLines();
}}
onResizeEnd={(e) => {
try {

1
frontend/src/AppBuilder/AppCanvas/RenderWidget.jsx
View file

@ -7,6 +7,7 @@ import { renderTooltip } from '@/_helpers/appUtils';
import { useTranslation } from 'react-i18next';
import ErrorBoundary from '@/_ui/ErrorBoundary';
import { BOX_PADDING } from './appCanvasConstants';
const shouldAddBoxShadowAndVisibility = [
'Table',
'TextInput',

6
frontend/src/AppBuilder/AppCanvas/WidgetWrapper.jsx
View file

@ -62,9 +62,9 @@ const WidgetWrapper = memo(
<>
<div
className={cx(`moveable-box ele-${id}`, {
[`target widget-target target1 moveable-box widget-${id}`]: !readOnly && visibility !== false,
[`widget-${id} nested-target`]: id !== 'canvas' && !readOnly && visibility !== false,
'position-absolute': readOnly || visibility === false,
[`target widget-target target1 moveable-box widget-${id}`]: !readOnly,
[`widget-${id} nested-target`]: id !== 'canvas' && !readOnly,
'position-absolute': readOnly,
'active-target': isWidgetActive,
'opacity-0': isDragging || isResizing,
})}