diff --git a/ui/src/components/IssueThreadInteractionCard.test.tsx b/ui/src/components/IssueThreadInteractionCard.test.tsx
index ca025ec3458..f36ff7816fd 100644
--- a/ui/src/components/IssueThreadInteractionCard.test.tsx
+++ b/ui/src/components/IssueThreadInteractionCard.test.tsx
@@ -480,6 +480,8 @@ describe("IssueThreadInteractionCard", () => {
button.textContent?.includes("+34 more"),
);
expect(moreButton).toBeTruthy();
+ moreButton?.focus();
+ expect(document.activeElement).toBe(moreButton);
act(() => {
moreButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
@@ -487,11 +489,13 @@ describe("IssueThreadInteractionCard", () => {
expect(host.textContent).not.toContain("+34 more");
expect(countSelectedChips()).toBe(42);
+ expect(document.activeElement).toBe(moreButton);
const showLessButton = Array.from(host.querySelectorAll("button")).find((button) =>
button.textContent?.includes("Show less"),
);
expect(showLessButton).toBeTruthy();
+ expect(showLessButton).toBe(moreButton);
act(() => {
showLessButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
@@ -499,6 +503,7 @@ describe("IssueThreadInteractionCard", () => {
expect(countSelectedChips()).toBe(8);
expect(host.textContent).toContain("+34 more");
+ expect(document.activeElement).toBe(moreButton);
});
it("stays compact and scrollable with around 100 options", () => {
diff --git a/ui/src/components/IssueThreadInteractionCard.tsx b/ui/src/components/IssueThreadInteractionCard.tsx
index 6bcf964a871..1117cf06088 100644
--- a/ui/src/components/IssueThreadInteractionCard.tsx
+++ b/ui/src/components/IssueThreadInteractionCard.tsx
@@ -1347,7 +1347,8 @@ function RequestCheckboxConfirmationResolution({
const visibleLabels = expanded
? selectedLabels
: selectedLabels.slice(0, CHECKBOX_SUMMARY_LABEL_LIMIT);
- const hiddenCount = selectedLabels.length - visibleLabels.length;
+ const hiddenCount = selectedLabels.length - CHECKBOX_SUMMARY_LABEL_LIMIT;
+ const hasHiddenLabels = hiddenCount > 0;
const chipClassName =
"inline-flex items-center rounded-sm border border-border/60 bg-transparent px-2 py-0.5 text-[10px] font-medium uppercase tracking-[0.16em] text-muted-foreground";
@@ -1366,30 +1367,17 @@ function RequestCheckboxConfirmationResolution({
{visibleLabels.map((label, index) => (
))}
- {hiddenCount > 0 ? (
+ {hasHiddenLabels ? (
- ) : null}
- {expanded && selectedLabels.length > CHECKBOX_SUMMARY_LABEL_LIMIT ? (
-
) : null}