hotfix: Make component hidden only when visibility is set to false (#…

…9029)

* fix: make visibility none only when its set to false

* add visibility only for components which have visibility in styles

* making logic for visibility central

* version bump

.version

@@ -1 +1 @@
-2.32.2
+2.32.3

frontend/.version

@@ -1 +1 @@
-2.32.2
+2.32.3

frontend/src/Editor/Box.jsx

@@ -156,6 +156,7 @@ export const Box = memo(
     const backgroundColor = yellow ? 'yellow' : '';
     const currentState = useCurrentState();
     const { events } = useAppInfo();
+    const shouldAddBoxShadowAndVisibility = ['TextInput', 'PasswordInput', 'NumberInput', 'Text'];
 
     const componentMeta = useMemo(() => {
       return componentTypes.find((comp) => component.component === comp.component);
@@ -171,22 +172,26 @@ export const Box = memo(
       mode === 'edit' && component.validate
         ? validateProperties(resolvedProperties, componentMeta.properties)
         : [resolvedProperties, []];
+    if (shouldAddBoxShadowAndVisibility.includes(component.component)) {
+      validatedProperties.visibility = validatedProperties.visibility !== false ? true : false;
+    }
 
     const resolvedStyles = resolveStyles(component, currentState, null, customResolvables);
-
     const [validatedStyles, styleErrors] =
       mode === 'edit' && component.validate
         ? validateProperties(resolvedStyles, componentMeta.styles)
         : [resolvedStyles, []];
-
+    if (!shouldAddBoxShadowAndVisibility.includes(component.component)) {
+      validatedStyles.visibility = validatedStyles.visibility !== false ? true : false;
+    }
     const resolvedGeneralProperties = resolveGeneralProperties(component, currentState, null, customResolvables);
     const [validatedGeneralProperties, generalPropertiesErrors] =
       mode === 'edit' && component.validate
         ? validateProperties(resolvedGeneralProperties, componentMeta.general)
         : [resolvedGeneralProperties, []];
 
     const resolvedGeneralStyles = resolveGeneralStyles(component, currentState, null, customResolvables);
-    resolvedStyles.visibility = resolvedStyles.visibility !== false ? true : false;
+
     const [validatedGeneralStyles, generalStylesErrors] =
       mode === 'edit' && component.validate
         ? validateProperties(resolvedGeneralStyles, componentMeta.generalStyles)
@@ -276,13 +281,12 @@ export const Box = memo(
         ...{ validationObject: component.definition.validation, currentState },
         customResolveObjects: customResolvables,
       });
-    const shouldAddBoxShadow = ['TextInput', 'PasswordInput', 'NumberInput', 'Text'];
     return (
       <OverlayTrigger
         placement={inCanvas ? 'auto' : 'top'}
         delay={{ show: 500, hide: 0 }}
         trigger={
-          inCanvas && shouldAddBoxShadow.includes(component.component)
+          inCanvas && shouldAddBoxShadowAndVisibility.includes(component.component)
             ? !validatedProperties.tooltip?.toString().trim()
               ? null
               : ['hover', 'focus']
@@ -295,7 +299,7 @@ export const Box = memo(
             props,
             text: inCanvas
               ? `${
-                  shouldAddBoxShadow.includes(component.component)
+                  shouldAddBoxShadowAndVisibility.includes(component.component)
                     ? validatedProperties.tooltip
                     : validatedGeneralProperties.tooltip
                 }`
@@ -332,7 +336,7 @@ export const Box = memo(
               exposedVariables={exposedVariables}
               styles={{
                 ...validatedStyles,
-                ...(!shouldAddBoxShadow.includes(component.component)
+                ...(!shouldAddBoxShadowAndVisibility.includes(component.component)
                   ? { boxShadow: validatedGeneralStyles?.boxShadow }
                   : {}),
               }}

server/.version

@@ -1 +1 @@
-2.32.2
+2.32.3