forked from farhoodlabs/paperclip
test: extract buildIssueTree utility and add tests for hierarchy logic
Extract the inline tree-building logic from IssuesList into a pure `buildIssueTree` function in lib/issue-tree.ts so it can be unit tested. Add six tests covering: flat lists, parent-child grouping, multi-level nesting, orphaned sub-tasks promoted to root, empty input, and list order preservation. Add two tests to IssueRow.test.tsx covering the new titleSuffix prop: renders inline after the title when provided, and renders cleanly when omitted. Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
@@ -136,4 +136,42 @@ describe("IssueRow", () => {
|
||||
root.unmount();
|
||||
});
|
||||
});
|
||||
|
||||
it("renders titleSuffix inline after the issue title", () => {
|
||||
const root = createRoot(container);
|
||||
const issue = createIssue({ title: "Parent task" });
|
||||
|
||||
act(() => {
|
||||
root.render(
|
||||
<IssueRow
|
||||
issue={issue}
|
||||
titleSuffix={<span data-testid="suffix">(3 sub-tasks)</span>}
|
||||
/>,
|
||||
);
|
||||
});
|
||||
|
||||
const titleEl = container.querySelector(".line-clamp-2, .truncate");
|
||||
expect(titleEl?.textContent).toContain("Parent task");
|
||||
expect(titleEl?.textContent).toContain("(3 sub-tasks)");
|
||||
expect(container.querySelector('[data-testid="suffix"]')).not.toBeNull();
|
||||
|
||||
act(() => {
|
||||
root.unmount();
|
||||
});
|
||||
});
|
||||
|
||||
it("renders without error when titleSuffix is omitted", () => {
|
||||
const root = createRoot(container);
|
||||
|
||||
act(() => {
|
||||
root.render(<IssueRow issue={createIssue()} />);
|
||||
});
|
||||
|
||||
const titleEl = container.querySelector(".line-clamp-2, .truncate");
|
||||
expect(titleEl?.textContent).toContain("Inbox item");
|
||||
|
||||
act(() => {
|
||||
root.unmount();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -23,6 +23,7 @@ import { Checkbox } from "@/components/ui/checkbox";
|
||||
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from "@/components/ui/collapsible";
|
||||
import { CircleDot, Plus, Filter, ArrowUpDown, Layers, Check, X, ChevronRight, List, Columns3, User, Search } from "lucide-react";
|
||||
import { KanbanBoard } from "./KanbanBoard";
|
||||
import { buildIssueTree } from "../lib/issue-tree";
|
||||
import type { Issue } from "@paperclipai/shared";
|
||||
|
||||
/* ── Helpers ── */
|
||||
@@ -667,16 +668,7 @@ export function IssuesList({
|
||||
)}
|
||||
<CollapsibleContent>
|
||||
{(() => {
|
||||
const itemIds = new Set(group.items.map((i) => i.id));
|
||||
const roots = group.items.filter((i) => !i.parentId || !itemIds.has(i.parentId));
|
||||
const childMap = new Map<string, Issue[]>();
|
||||
for (const item of group.items) {
|
||||
if (item.parentId && itemIds.has(item.parentId)) {
|
||||
const arr = childMap.get(item.parentId) ?? [];
|
||||
arr.push(item);
|
||||
childMap.set(item.parentId, arr);
|
||||
}
|
||||
}
|
||||
const { roots, childMap } = buildIssueTree(group.items);
|
||||
|
||||
const renderIssueRow = (issue: Issue, depth: number) => {
|
||||
const children = childMap.get(issue.id) ?? [];
|
||||
|
||||
Reference in New Issue
Block a user