ake/paperclip
1
0
Fork 0
mirror of https://github.com/alkimake/paperclip.git synced 2026-06-18 19:50:38 +09:00
Code Issues Projects Releases Packages Wiki Activity

fix: indent nested sub-tasks at all depths using depth-based padding

Browse source 
Replace the boolean isChild flag with a numeric depth counter.
Each depth level adds 16px left padding via inline style on the
wrapper div, so sub-tasks of sub-tasks (and deeper) are indented
proportionally rather than all aligning at the same level.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
Darren Davison 2026-04-04 03:37:50 +01:00
parent 12011fa9de
commit 58a1a20f5b
1 changed files with 4 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

9
ui/src/components/IssuesList.tsx
View file

@ -677,7 +677,7 @@ export function IssuesList({
} }
} }
const renderIssueRow = (issue: Issue, isChild: boolean) => { const renderIssueRow = (issue: Issue, depth: number) => {
const children = childMap.get(issue.id) ?? []; const children = childMap.get(issue.id) ?? [];
const hasChildren = children.length > 0; const hasChildren = children.length > 0;
const isExpanded = !collapsedParents.has(issue.id); const isExpanded = !collapsedParents.has(issue.id);
@ -692,11 +692,10 @@ export function IssuesList({
}; };
return ( return (
<div key={issue.id}> <div key={issue.id} style={depth > 0 ? { paddingLeft: `${depth * 16}px` } : undefined}>
<IssueRow <IssueRow
issue={issue} issue={issue}
issueLinkState={issueLinkState} issueLinkState={issueLinkState}
className={isChild ? "pl-6 sm:pl-7" : undefined}
titleSuffix={hasChildren && !isExpanded ? ( titleSuffix={hasChildren && !isExpanded ? (
<span className="ml-1.5 text-xs text-muted-foreground"> <span className="ml-1.5 text-xs text-muted-foreground">
({children.length} sub-task{children.length !== 1 ? "s" : ""}) ({children.length} sub-task{children.length !== 1 ? "s" : ""})
@ -875,12 +874,12 @@ export function IssuesList({
)} )}
trailingMeta={formatDate(issue.createdAt)} trailingMeta={formatDate(issue.createdAt)}
/> />
{hasChildren && isExpanded && children.map((child) => renderIssueRow(child, true))} {hasChildren && isExpanded && children.map((child) => renderIssueRow(child, depth + 1))}
</div> </div>
); );
}; };
return roots.map((issue) => renderIssueRow(issue, false)); return roots.map((issue) => renderIssueRow(issue, 0));
})()} })()}
</CollapsibleContent> </CollapsibleContent>
</Collapsible> </Collapsible>