diff --git a/ui/app/(prowler)/lighthouse/_components/panel/lighthouse-panel-chat.test.tsx b/ui/app/(prowler)/lighthouse/_components/panel/lighthouse-panel-chat.test.tsx index eff0a341d3..f3b6e1ef17 100644 --- a/ui/app/(prowler)/lighthouse/_components/panel/lighthouse-panel-chat.test.tsx +++ b/ui/app/(prowler)/lighthouse/_components/panel/lighthouse-panel-chat.test.tsx @@ -251,13 +251,15 @@ describe("LighthousePanelChat", () => { // When await user.click( - screen.getByRole("button", { name: "Remove Findings context" }), + screen.getByRole("button", { name: "Disable Findings context" }), ); // Then - expect( - screen.getByRole("button", { name: "Add Findings context" }), - ).toBeInTheDocument(); + const disabledContext = screen.getByRole("button", { + name: "Enable Findings context", + }); + expect(disabledContext).toHaveAttribute("aria-pressed", "false"); + expect(disabledContext).toHaveTextContent("@ Findings"); expect( screen.getByRole("button", { name: "Critical findings" }), ).toBeInTheDocument(); diff --git a/ui/components/lighthouse/context-chip.test.tsx b/ui/components/lighthouse/context-chip.test.tsx index 1e43ff93ea..006bf9a465 100644 --- a/ui/components/lighthouse/context-chip.test.tsx +++ b/ui/components/lighthouse/context-chip.test.tsx @@ -10,73 +10,75 @@ import { } from "./context-chip"; describe("LighthouseContextControl", () => { - it("should show the current page, selection count, and accessible details", async () => { + it("should show enabled context as a pressed badge and explain disabling it", async () => { // Given const user = userEvent.setup(); + const onDisable = vi.fn(); render( , ); + const contextControl = screen.getByRole("button", { + name: "Disable Findings context", + }); // When - await user.hover(screen.getByText("@ Findings +1")); + await user.hover(contextControl); // Then + expect(contextControl).toHaveAttribute("aria-pressed", "true"); + expect(contextControl).toHaveTextContent("@ Findings +1"); expect(await screen.findByRole("tooltip")).toHaveTextContent( - "Filters: severity: critical", - ); - expect(screen.getByRole("tooltip")).toHaveTextContent( - "Included types: page, finding", - ); - }); - - it("should disable and restore context through explicit actions", async () => { - // Given - const user = userEvent.setup(); - const onDisable = vi.fn(); - const onEnable = vi.fn(); - const view = render( - , + "Click to stop including Findings context in new messages.", ); // When - await user.click( - screen.getByRole("button", { name: "Remove Findings context" }), - ); + await user.click(contextControl); // Then expect(onDisable).toHaveBeenCalledOnce(); + }); + it("should keep the same badge label when disabled and explain enabling it", async () => { // Given - view.rerender( + const user = userEvent.setup(); + const onEnable = vi.fn(); + render( , ); + const contextControl = screen.getByRole("button", { + name: "Enable Findings context", + }); // When - await user.click( - screen.getByRole("button", { name: "Add Findings context" }), + await user.hover(contextControl); + + // Then + expect(contextControl).toHaveAttribute("aria-pressed", "false"); + expect(contextControl).toHaveTextContent("@ Findings +1"); + expect( + screen.queryByText("+ Add Findings context"), + ).not.toBeInTheDocument(); + expect(await screen.findByRole("tooltip")).toHaveTextContent( + "Click to include Findings context in new messages.", ); + // When + await user.click(contextControl); + // Then expect(onEnable).toHaveBeenCalledOnce(); }); @@ -90,7 +92,7 @@ describe("LighthouseContextBadge", () => { // Then expect(screen.getByText("@ Findings +1")).toBeInTheDocument(); expect( - screen.queryByRole("button", { name: /Remove Findings context/ }), + screen.queryByRole("button", { name: /Findings context/ }), ).not.toBeInTheDocument(); }); }); diff --git a/ui/components/lighthouse/context-chip.tsx b/ui/components/lighthouse/context-chip.tsx index 6e4cd7318a..f197f820a5 100644 --- a/ui/components/lighthouse/context-chip.tsx +++ b/ui/components/lighthouse/context-chip.tsx @@ -1,9 +1,6 @@ "use client"; -import { X } from "lucide-react"; - import { Badge } from "@/components/shadcn/badge/badge"; -import { Button } from "@/components/shadcn/button/button"; import { Tooltip, TooltipContent, @@ -34,39 +31,25 @@ export function LighthouseContextControl({ }: LighthouseContextControlProps) { if (!context) return null; - if (!enabled) { - return ( - - + Add {pageLabel} context - - ); - } - return ( - - - {buildContextLabel(pageLabel, selectionCount)} - - - - + + + {buildContextLabel(pageLabel, selectionCount)} + - + + {enabled + ? `Click to stop including ${pageLabel} context in new messages.` + : `Click to include ${pageLabel} context in new messages.`} + ); }