refactor(#81): replace nudge button with always-visible count badge

Show the discussion count badge on every state (including 0) instead of
a separate nudge button. Simpler, less intrusive, and works without
needing an extra element near the panel.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-03-26 18:43:48 +01:00
parent bf82ebfe1d
commit 20f6de4424
2 changed files with 10 additions and 46 deletions

View File

@@ -1,6 +1,6 @@
import { describe, it, expect, afterEach } from 'vitest';
import { cleanup, render } from 'vitest-browser-svelte';
import { page, userEvent } from 'vitest/browser';
import { page } from 'vitest/browser';
import DocumentBottomPanel from './DocumentBottomPanel.svelte';
import type { Comment } from '$lib/types';
@@ -30,45 +30,18 @@ const baseProps = {
};
describe('DocumentBottomPanel discussion badge', () => {
it('shows a badge with comment count on the Discussion tab when comments exist', async () => {
it('always shows a badge on the Discussion tab', async () => {
render(DocumentBottomPanel, { ...baseProps, comments: [], open: true });
await expect.element(page.getByTestId('discussion-count-badge')).toBeInTheDocument();
await expect.element(page.getByTestId('discussion-count-badge')).toHaveTextContent('0');
});
it('shows the correct count when comments exist', async () => {
render(DocumentBottomPanel, {
...baseProps,
comments: [makeComment('c-1'), makeComment('c-2')],
open: true
});
await expect.element(page.getByTestId('discussion-count-badge')).toBeInTheDocument();
await expect.element(page.getByTestId('discussion-count-badge')).toHaveTextContent('2');
});
it('does not show badge when there are no comments', async () => {
render(DocumentBottomPanel, { ...baseProps, comments: [], open: true });
await expect.element(page.getByTestId('discussion-count-badge')).not.toBeInTheDocument();
});
});
describe('DocumentBottomPanel start discussion nudge', () => {
it('shows nudge above drag handle when panel is closed and no comments', async () => {
render(DocumentBottomPanel, { ...baseProps, comments: [], open: false });
await expect.element(page.getByTestId('discussion-nudge')).toBeInTheDocument();
});
it('does not show nudge when panel is closed but comments exist', async () => {
render(DocumentBottomPanel, {
...baseProps,
comments: [makeComment('c-1')],
open: false
});
await expect.element(page.getByTestId('discussion-nudge')).not.toBeInTheDocument();
});
it('does not show nudge when panel is open', async () => {
render(DocumentBottomPanel, { ...baseProps, comments: [], open: true });
await expect.element(page.getByTestId('discussion-nudge')).not.toBeInTheDocument();
});
it('opens the discussion tab when the nudge is clicked', async () => {
render(DocumentBottomPanel, { ...baseProps, comments: [], open: false });
await userEvent.click(page.getByTestId('discussion-nudge'));
await expect.element(page.getByTestId('bottom-panel-content')).toBeInTheDocument();
});
});