From 9b0dfd5ed7b5f172dcdbcd3b630c297b93027bbc Mon Sep 17 00:00:00 2001 From: thepetk Date: Sun, 28 Jun 2026 18:42:59 +0100 Subject: [PATCH 1/3] Take into account isLoading too for compactButtonDisabled Signed-off-by: Theofanis Petkos --- ui/desktop/src/components/ChatInput.tsx | 6 +-- .../alerts/__tests__/AlertBox.test.tsx | 37 +++++++++++++++++++ 2 files changed, 39 insertions(+), 4 deletions(-) diff --git a/ui/desktop/src/components/ChatInput.tsx b/ui/desktop/src/components/ChatInput.tsx index 89f6e55d1721..6e61c8b3ddad 100644 --- a/ui/desktop/src/components/ChatInput.tsx +++ b/ui/desktop/src/components/ChatInput.tsx @@ -655,7 +655,7 @@ export default function ChatInput({ total: tokenLimit, }, showCompactButton: true, - compactButtonDisabled: !totalTokens, + compactButtonDisabled: !totalTokens || isLoading, onCompact: () => { window.dispatchEvent(new CustomEvent(AppEvents.HIDE_ALERT_POPOVER)); handleSubmit({ msg: MANUAL_COMPACT_TRIGGER, images: [] }); @@ -664,9 +664,7 @@ export default function ChatInput({ }); } - // Keep alert recalculation scoped to token state changes. - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [totalTokens, tokenLimit, isTokenLimitLoaded, addAlert, clearAlerts]); + }, [totalTokens, tokenLimit, isTokenLimitLoaded, isLoading, addAlert, clearAlerts]); // Cleanup effect for component unmount - prevent memory leaks useEffect(() => { diff --git a/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx b/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx index 96470118652d..d20b646e02bc 100644 --- a/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx +++ b/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx @@ -201,6 +201,43 @@ describe('AlertBox', () => { expect(screen.queryByText('Compact now')).not.toBeInTheDocument(); }); + it('should disable compact button and not call onCompact when compactButtonDisabled is true', async () => { + const user = userEvent.setup(); + + const alert: Alert = { + type: AlertType.Info, + message: 'Context window', + progress: { current: 50, total: 100 }, + showCompactButton: true, + onCompact: mockOnCompact, + compactButtonDisabled: true, + }; + + renderWithIntl(); + + const compactButton = screen.getByRole('button', { name: /compact now/i }); + expect(compactButton).toBeDisabled(); + await user.click(compactButton); + expect(mockOnCompact).not.toHaveBeenCalled(); + }); + + it('should apply disabled styling when compactButtonDisabled is true', () => { + const alert: Alert = { + type: AlertType.Info, + message: 'Context window', + progress: { current: 50, total: 100 }, + showCompactButton: true, + onCompact: mockOnCompact, + compactButtonDisabled: true, + }; + + renderWithIntl(); + + const compactButton = screen.getByRole('button', { name: /compact now/i }); + expect(compactButton).toHaveClass('opacity-50', 'cursor-not-allowed'); + expect(compactButton).not.toHaveClass('hover:opacity-80', 'cursor-pointer'); + }); + it('should not render compact button when onCompact is not provided', () => { const alert: Alert = { type: AlertType.Info, From 98410be3e427a961ffbc9331a5fbbf0a544a4cee Mon Sep 17 00:00:00 2001 From: thepetk Date: Mon, 6 Jul 2026 09:22:25 +0100 Subject: [PATCH 2/3] Fix UI tests Signed-off-by: thepetk@gmail.com --- ui/desktop/src/components/ChatInput.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/ui/desktop/src/components/ChatInput.tsx b/ui/desktop/src/components/ChatInput.tsx index 6e61c8b3ddad..59bc9ed9de21 100644 --- a/ui/desktop/src/components/ChatInput.tsx +++ b/ui/desktop/src/components/ChatInput.tsx @@ -664,6 +664,7 @@ export default function ChatInput({ }); } + // eslint-disable-next-line react-hooks/exhaustive-deps }, [totalTokens, tokenLimit, isTokenLimitLoaded, isLoading, addAlert, clearAlerts]); // Cleanup effect for component unmount - prevent memory leaks From 990093e9c14b185a6fb42f3172523b31a0e3a39e Mon Sep 17 00:00:00 2001 From: Douwe M Osinga Date: Wed, 8 Jul 2026 16:50:49 -0700 Subject: [PATCH 3/3] Remove redundant compact button tests --- .../alerts/__tests__/AlertBox.test.tsx | 37 ------------------- 1 file changed, 37 deletions(-) diff --git a/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx b/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx index d20b646e02bc..96470118652d 100644 --- a/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx +++ b/ui/desktop/src/components/alerts/__tests__/AlertBox.test.tsx @@ -201,43 +201,6 @@ describe('AlertBox', () => { expect(screen.queryByText('Compact now')).not.toBeInTheDocument(); }); - it('should disable compact button and not call onCompact when compactButtonDisabled is true', async () => { - const user = userEvent.setup(); - - const alert: Alert = { - type: AlertType.Info, - message: 'Context window', - progress: { current: 50, total: 100 }, - showCompactButton: true, - onCompact: mockOnCompact, - compactButtonDisabled: true, - }; - - renderWithIntl(); - - const compactButton = screen.getByRole('button', { name: /compact now/i }); - expect(compactButton).toBeDisabled(); - await user.click(compactButton); - expect(mockOnCompact).not.toHaveBeenCalled(); - }); - - it('should apply disabled styling when compactButtonDisabled is true', () => { - const alert: Alert = { - type: AlertType.Info, - message: 'Context window', - progress: { current: 50, total: 100 }, - showCompactButton: true, - onCompact: mockOnCompact, - compactButtonDisabled: true, - }; - - renderWithIntl(); - - const compactButton = screen.getByRole('button', { name: /compact now/i }); - expect(compactButton).toHaveClass('opacity-50', 'cursor-not-allowed'); - expect(compactButton).not.toHaveClass('hover:opacity-80', 'cursor-pointer'); - }); - it('should not render compact button when onCompact is not provided', () => { const alert: Alert = { type: AlertType.Info,