fix(ProjectListItemCollapsable): fix border error

taskany-inc · Jun 28, 2023 · 9720c34 · 9720c34
1 parent 321e5b7
commit 9720c34
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 20 deletions.
diff --git a/src/components/CollapsableItem.tsx b/src/components/CollapsableItem.tsx
@@ -56,7 +56,7 @@ const StyledHeaderContent = styled.div<{ highlighted?: boolean }>`
     `}
 `;
 
-const StyledCollapsableContainer = styled.div<{ collapsed: boolean; deep: number; showLine: boolean }>`
+const StyledCollapsableContainer = styled.div<{ collapsed: boolean; deep: number }>`
     position: relative;
 
     border-radius: ${radiusM};
@@ -156,19 +156,16 @@ export const CollapsableItem: FC<{
     content: ReactNode;
     deep?: number;
     collapsed: boolean;
-    showLine?: boolean;
-}> = ({ onClick, children, header, collapsed, deep = 0, showLine = true, content }) => {
-    return (
-        <StyledCollapsableContainer collapsed={collapsed} deep={deep} showLine={showLine}>
-            <StyledCollapsableHeader onClick={onClick}>
-                <StyledParentDot />
-                <StyledDot />
-                <StyledHeaderContent highlighted={!!onClick && collapsed}>{header}</StyledHeaderContent>
-            </StyledCollapsableHeader>
-            {nullable(children, (ch) => (
-                <StyledCollapsableItem>{ch}</StyledCollapsableItem>
-            ))}
-            {!collapsed ? content : null}
-        </StyledCollapsableContainer>
-    );
-};
+}> = ({ onClick, children, header, collapsed, deep = 0, content }) => (
+    <StyledCollapsableContainer collapsed={collapsed} deep={deep}>
+        <StyledCollapsableHeader onClick={onClick}>
+            <StyledParentDot />
+            <StyledDot />
+            <StyledHeaderContent highlighted={!!onClick && collapsed}>{header}</StyledHeaderContent>
+        </StyledCollapsableHeader>
+        {nullable(children, (ch) => (
+            <StyledCollapsableItem>{ch}</StyledCollapsableItem>
+        ))}
+        {!collapsed ? content : null}
+    </StyledCollapsableContainer>
+);
diff --git a/src/components/ProjectListItemCollapsable/ProjectListItemCollapsable.tsx b/src/components/ProjectListItemCollapsable/ProjectListItemCollapsable.tsx
@@ -38,12 +38,12 @@ export const ProjectListItemCollapsable: React.FC<ProjectListItemCollapsableProp
     loading = false,
     deep = 0,
 }) => {
-    const contentHidden = collapsed || loading;
-
-    const offset = collapseOffset * (contentHidden ? deep - 1 : deep);
     const childs = useMemo(() => project.children.map(({ id }) => id), [project]);
 
     const onClickEnabled = childs.length;
+    const contentHidden = !childs.length || collapsed || loading;
+
+    const offset = collapseOffset * (contentHidden ? deep - 1 : deep);
 
     const onGoalsButtonClick = useCallback(
         (e: MouseEvent) => {