feat(FN-3271): collapse mobile overview on live run select in AgentsView
Collapsed mobile overview panel now hides automatically when a live run is selected in the AgentsView, improving the mobile experience by reducing visual clutter during active agent sessions. Fusion-Task-Id: FN-3271
This commit is contained in:
@@ -634,6 +634,13 @@ export function AgentsView({ addToast, projectId, onOpenTaskLogs, agentOnboardin
|
||||
openAgentDetail(childId);
|
||||
}, [openAgentDetail]);
|
||||
|
||||
const handleOverviewAgentSelect = useCallback((agentId: string) => {
|
||||
openAgentDetail(agentId);
|
||||
if (isMobileViewport) {
|
||||
setIsOverviewOpen(false);
|
||||
}
|
||||
}, [isMobileViewport, openAgentDetail]);
|
||||
|
||||
const handleRunHeartbeat = async (agentId: string, agentName: string) => {
|
||||
try {
|
||||
await startAgentRun(agentId, projectId, { source: "on_demand", triggerDetail: "Triggered from dashboard" });
|
||||
@@ -855,7 +862,7 @@ export function AgentsView({ addToast, projectId, onOpenTaskLogs, agentOnboardin
|
||||
projectId={projectId}
|
||||
isOpen={isOverviewOpen}
|
||||
onToggle={() => setIsOverviewOpen((open) => !open)}
|
||||
onSelectAgent={setSelectedAgentId}
|
||||
onSelectAgent={handleOverviewAgentSelect}
|
||||
onOpenTaskLogs={onOpenTaskLogs}
|
||||
/>
|
||||
|
||||
|
||||
@@ -334,6 +334,32 @@ describe("AgentsView", () => {
|
||||
expect(container.querySelector(".agents-split-detail--hidden-mobile")).toBeTruthy();
|
||||
});
|
||||
|
||||
it("collapses mobile overview after selecting an active agent card", async () => {
|
||||
mockViewportMode.mockReturnValue("mobile");
|
||||
render(<AgentsView addToast={mockAddToast} />);
|
||||
|
||||
const overviewToggle = await openOverviewPanel();
|
||||
fireEvent.click(await screen.findByRole("button", { name: /select agent test agent 2/i }));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(screen.getByTestId("agent-detail-view")).toHaveTextContent("agent-002");
|
||||
expect(overviewToggle.getAttribute("aria-expanded")).toBe("false");
|
||||
});
|
||||
});
|
||||
|
||||
it("keeps desktop overview open after selecting an active agent card", async () => {
|
||||
mockViewportMode.mockReturnValue("desktop");
|
||||
render(<AgentsView addToast={mockAddToast} />);
|
||||
|
||||
const overviewToggle = await openOverviewPanel();
|
||||
fireEvent.click(await screen.findByRole("button", { name: /select agent test agent 2/i }));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(screen.getByTestId("agent-detail-view")).toHaveTextContent("agent-002");
|
||||
expect(overviewToggle.getAttribute("aria-expanded")).toBe("true");
|
||||
});
|
||||
});
|
||||
|
||||
it("shows a loading indicator while the initial agents fetch is pending", async () => {
|
||||
let resolveAgents: ((value: Agent[]) => void) | undefined;
|
||||
mockFetchAgents.mockImplementationOnce(
|
||||
|
||||
Reference in New Issue
Block a user