dave/storkit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 7 Wiki Activity

story-kit: merge 213_story_remove_colored_left_border_from_work_item_cards

Browse Source
This commit is contained in:
Dave
2026-02-26 16:15:11 +00:00
parent 774a731042
commit 8715e648ba
2 changed files with 27 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
frontend/src/components/StagePanel.test.tsx
View File

@@ -162,59 +162,66 @@ describe("StagePanel", () => {
).not.toBeInTheDocument(); ).not.toBeInTheDocument();
}); });
it("applies green left border for story items", () => { it("card has uniform border on all sides for story items", () => {
const items: PipelineStageItem[] = [ const items: PipelineStageItem[] = [
{ {
story_id: "20_story_green_border", story_id: "20_story_uniform_border",
name: "Green Border", name: "Uniform Border",
error: null, error: null,
agent: null, agent: null,
}, },
]; ];
render(<StagePanel title="Upcoming" items={items} />); render(<StagePanel title="Upcoming" items={items} />);
const card = screen.getByTestId("card-20_story_green_border"); const card = screen.getByTestId("card-20_story_uniform_border");
expect(card.style.borderLeft).toContain("rgb(63, 185, 80)"); // No 3px colored left border - all sides match the uniform shorthand
expect(card.style.borderLeft).not.toContain("3px");
expect(card.style.borderLeft).toBe(card.style.borderTop);
expect(card.style.borderLeft).toBe(card.style.borderRight);
expect(card.style.borderLeft).toBe(card.style.borderBottom);
}); });
it("applies red left border for bug items", () => { it("card has uniform border on all sides for bug items", () => {
const items: PipelineStageItem[] = [ const items: PipelineStageItem[] = [
{ {
story_id: "21_bug_red_border", story_id: "21_bug_uniform_border",
name: "Red Border", name: "Uniform Border Bug",
error: null, error: null,
agent: null, agent: null,
}, },
]; ];
render(<StagePanel title="Current" items={items} />); render(<StagePanel title="Current" items={items} />);
const card = screen.getByTestId("card-21_bug_red_border"); const card = screen.getByTestId("card-21_bug_uniform_border");
expect(card.style.borderLeft).toContain("rgb(248, 81, 73)"); expect(card.style.borderLeft).not.toContain("3px");
expect(card.style.borderLeft).toBe(card.style.borderTop);
}); });
it("applies blue left border for spike items", () => { it("card has uniform border on all sides for spike items", () => {
const items: PipelineStageItem[] = [ const items: PipelineStageItem[] = [
{ {
story_id: "22_spike_blue_border", story_id: "22_spike_uniform_border",
name: "Blue Border", name: "Uniform Border Spike",
error: null, error: null,
agent: null, agent: null,
}, },
]; ];
render(<StagePanel title="QA" items={items} />); render(<StagePanel title="QA" items={items} />);
const card = screen.getByTestId("card-22_spike_blue_border"); const card = screen.getByTestId("card-22_spike_uniform_border");
expect(card.style.borderLeft).toContain("rgb(88, 166, 255)"); expect(card.style.borderLeft).not.toContain("3px");
expect(card.style.borderLeft).toBe(card.style.borderTop);
}); });
it("applies neutral left border for unrecognised type", () => { it("card has uniform border on all sides for unrecognised type", () => {
const items: PipelineStageItem[] = [ const items: PipelineStageItem[] = [
{ {
story_id: "23_task_neutral_border", story_id: "23_task_uniform_border",
name: "Neutral Border", name: "Uniform Border Task",
error: null, error: null,
agent: null, agent: null,
}, },
]; ];
render(<StagePanel title="Done" items={items} />); render(<StagePanel title="Done" items={items} />);
const card = screen.getByTestId("card-23_task_neutral_border"); const card = screen.getByTestId("card-23_task_uniform_border");
expect(card.style.borderLeft).toContain("rgb(68, 68, 68)"); expect(card.style.borderLeft).not.toContain("3px");
expect(card.style.borderLeft).toBe(card.style.borderTop);
}); });
}); });

1
frontend/src/components/StagePanel.tsx
View File

@@ -174,7 +174,6 @@ export function StagePanel({
border: item.agent border: item.agent
? "1px solid #2a3a4a" ? "1px solid #2a3a4a"
: "1px solid #2a2a2a", : "1px solid #2a2a2a",
borderLeft: `3px solid ${borderColor}`,
borderRadius: "8px", borderRadius: "8px",
padding: "8px 12px", padding: "8px 12px",
background: item.agent ? "#161e2a" : "#191919", background: item.agent ? "#161e2a" : "#191919",