diff --git a/packages/frontend/src/pages/Issues.tsx b/packages/frontend/src/pages/Issues.tsx index 5d8c8c8..e9834a0 100644 --- a/packages/frontend/src/pages/Issues.tsx +++ b/packages/frontend/src/pages/Issues.tsx @@ -2,10 +2,12 @@ import { useEffect, useMemo, useRef, useState } from "react"; import { useLocation } from "react-router-dom"; +import Avatar from "@/components/avatar"; import { IssueDetailPane } from "@/components/issue-detail-pane"; import { IssueModal } from "@/components/issue-modal"; import { defaultIssuesTableFilters, IssuesTable, type IssuesTableFilters } from "@/components/issues-table"; import { useSelection } from "@/components/selection-provider"; +import SmallSprintDisplay from "@/components/small-sprint-display"; import SmallUserDisplay from "@/components/small-user-display"; import StatusTag from "@/components/status-tag"; import TopBar from "@/components/top-bar"; @@ -353,12 +355,6 @@ export default function Issues() { "title-desc": "Title Z-A", status: "Status", }; - const sprintLabel = useMemo(() => { - if (issueFilters.sprintId === "all") return "Sprint"; - if (issueFilters.sprintId === "none") return "No sprint"; - const sprintMatch = sprintsData.find((sprint) => sprint.id === issueFilters.sprintId); - return sprintMatch?.name ?? "Sprint"; - }, [issueFilters.sprintId, sprintsData]); return (
@@ -384,7 +380,17 @@ export default function Issues() { {selectedOrganisation?.Organisation.features.issueStatus && ( - Status + {issueFilters.statuses.length === 0 ? ( + "Status" + ) : ( +
+ {Object.entries(statuses) + .filter(([status]) => issueFilters.statuses.includes(status)) + .map(([status, colour]) => ( + + ))} +
+ )}
Status @@ -414,7 +420,20 @@ export default function Issues() { {selectedOrganisation?.Organisation.features.issueTypes && ( - Type + {issueFilters.types.length === 0 ? ( + "Type" + ) : ( +
+ {Object.entries(issueTypes) + .filter(([type]) => issueFilters.types.includes(type)) + .map(([type, definition]) => ( +
+ + {type} +
+ ))} +
+ )}
Type @@ -446,7 +465,25 @@ export default function Issues() { )} - Assignee + {issueFilters.assignees.length === 0 ? ( + "Assignee" + ) : ( +
+ {issueFilters.assignees.includes("unassigned") && Unassigned} + {members + .filter((member) => issueFilters.assignees.includes(String(member.id))) + .map((member) => ( + + ))} +
+ )}
Assignee @@ -486,7 +523,16 @@ export default function Issues() { {selectedOrganisation?.Organisation.features.sprints && ( - {sprintLabel} + {issueFilters.sprintId === "all" ? ( + "Sprint" + ) : issueFilters.sprintId === "none" ? ( + + ) : ( + (() => { + const sprint = sprintsData.find((s) => s.id === issueFilters.sprintId); + return sprint ? : "Sprint"; + })() + )} Sprint