From 7b45e4f10872fa1292b677c1ed0337657e4400ec Mon Sep 17 00:00:00 2001
From: Igor D <igorDykhta@users.noreply.github.com>
Date: Tue, 20 Jun 2023 20:08:19 +0300
Subject: [PATCH] [fix] collapsible layer config group ui improvements (#2268)

---
 .../side-panel/layer-panel/layer-config-group.tsx | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/src/side-panel/layer-panel/layer-config-group.tsx b/src/components/src/side-panel/layer-panel/layer-config-group.tsx
index 49375c03cc..87bdcaca5e 100644
--- a/src/components/src/side-panel/layer-panel/layer-config-group.tsx
+++ b/src/components/src/side-panel/layer-panel/layer-config-group.tsx
@@ -91,16 +91,21 @@ export const StyledLayerConfigGroup = styled.div`
   }
 `;
 
+interface StyledConfigGroupHeaderProps {
+  collapsible?: boolean;
+}
+
 export const StyledConfigGroupHeader = styled.div.attrs({
   className: 'layer-config-group__header'
-})`
+})<StyledConfigGroupHeaderProps>`
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 12px;
+  cursor: default;
 
   :hover {
-    cursor: pointer;
+    ${props => props.collapsible && 'cursor: pointer;'}
     .layer-config-group__label {
       color: ${props => props.theme.textColorHl};
     }
@@ -175,12 +180,12 @@ function LayerConfigGroupFactory(
   }) => {
     const [collapsed, toggleCollapsed] = useState(!expanded);
     const onToggleCollapsed = useCallback(() => {
-      toggleCollapsed(!collapsed);
-    }, [collapsed, toggleCollapsed]);
+      collapsible && toggleCollapsed(!collapsed);
+    }, [collapsed, toggleCollapsed, collapsible]);
 
     return (
       <StyledLayerConfigGroup className={classnames('layer-config-group', {collapsed, disabled})}>
-        <StyledConfigGroupHeader onClick={onToggleCollapsed}>
+        <StyledConfigGroupHeader onClick={onToggleCollapsed} collapsible={collapsible}>
           <LayerConfigGroupLabel label={label} description={description} collapsed={collapsed} />
           <StyledLayerConfigGroupAction className="layer-config-group__action">
             {property ? (