nicer border around selected issue in table

This commit is contained in:
2026-01-30 14:12:59 +00:00
parent 8b24a4e119
commit a00cf1c023

View File

@@ -170,12 +170,14 @@ export function IssuesTable({
</TableRow>
</TableHeader>
<TableBody>
{issues.map((issueData) => (
{issues.map((issueData) => {
const isSelected = issueData.Issue.id === selectedIssueId;
return (
<TableRow
key={issueData.Issue.id}
className={cn("cursor-pointer max-w-full")}
onClick={() => {
if (issueData.Issue.id === selectedIssueId) {
if (isSelected) {
selectIssue(null);
return;
}
@@ -186,7 +188,8 @@ export function IssuesTable({
<TableCell
className={cn(
"font-medium border-r text-right p-0",
issueData.Issue.id === selectedIssueId && "shadow-[inset_2px_0_0_0_var(--personality)]",
isSelected &&
"shadow-[inset_2px_2px_0_0_var(--personality),inset_0_-2px_0_0_var(--personality)]",
)}
>
<a
@@ -202,9 +205,8 @@ export function IssuesTable({
<TableCell
className={cn(
"min-w-0 p-0",
!showId &&
issueData.Issue.id === selectedIssueId &&
"shadow-[inset_2px_0_0_0_var(--personality)]",
isSelected &&
"shadow-[inset_0_2px_0_0_var(--personality),inset_0_-2px_0_0_var(--personality)]",
)}
>
<a
@@ -222,14 +224,23 @@ export function IssuesTable({
)}
{selectedOrganisation?.Organisation.features.issueStatus &&
(columns.status == null || columns.status === true) && (
<StatusTag status={issueData.Issue.status} colour={statuses[issueData.Issue.status]} />
<StatusTag
status={issueData.Issue.status}
colour={statuses[issueData.Issue.status]}
/>
)}
<span className="truncate">{issueData.Issue.title}</span>
</a>
</TableCell>
)}
{showDescription && (
<TableCell className="overflow-hidden p-0">
<TableCell
className={cn(
"overflow-hidden p-0",
isSelected &&
"shadow-[inset_0_2px_0_0_var(--personality),inset_0_-2px_0_0_var(--personality)]",
)}
>
<a
href={getIssueUrl(issueData.Issue.number)}
onClick={handleLinkClick}
@@ -240,7 +251,13 @@ export function IssuesTable({
</TableCell>
)}
{showAssignee && (
<TableCell className="h-[32px] p-0">
<TableCell
className={cn(
"h-[32px] p-0",
isSelected &&
"shadow-[inset_0_2px_0_0_var(--personality),inset_-2px_0_0_0_var(--personality),inset_0_-2px_0_0_var(--personality)]",
)}
>
<a
href={getIssueUrl(issueData.Issue.number)}
onClick={handleLinkClick}
@@ -271,7 +288,8 @@ export function IssuesTable({
</TableCell>
)}
</TableRow>
))}
);
})}
</TableBody>
</Table>
);