chore: refactorings for sidebar handling

This commit is contained in:
2026-02-23 12:33:14 +01:00
parent bf945716f9
commit fe05cc5a2d
8 changed files with 587 additions and 293 deletions

View File

@@ -0,0 +1,67 @@
import React from 'react';
import { describe, it, expect, beforeEach, vi } from 'vitest';
import { act, render, screen } from '@testing-library/react';
import { Sidebar } from '../../../src/renderer/components/Sidebar/Sidebar';
import { useAppStore } from '../../../src/renderer/store';
describe('Sidebar chat list behavior', () => {
beforeEach(() => {
vi.clearAllMocks();
(window as any).electronAPI = {
...(window as any).electronAPI,
chat: {
getConversations: vi.fn(),
checkReady: vi.fn().mockResolvedValue({ ready: true }),
onTitleUpdated: vi.fn(() => () => {}),
createConversation: vi.fn(),
deleteConversation: vi.fn(),
},
};
useAppStore.setState({
activeProject: null,
activeView: 'chat',
sidebarVisible: true,
tabs: [],
activeTabId: null,
});
});
it('reloads chat conversations when active project becomes available after mount', async () => {
const getConversationsMock = vi
.fn()
.mockResolvedValueOnce([])
.mockResolvedValueOnce([
{
id: 'conv-1',
title: 'Project Conversation',
createdAt: '2026-02-22T00:00:00.000Z',
updatedAt: '2026-02-22T00:00:00.000Z',
},
]);
(window as any).electronAPI.chat.getConversations = getConversationsMock;
render(<Sidebar />);
expect(await screen.findByText('No conversations yet')).toBeInTheDocument();
act(() => {
useAppStore.setState({
activeProject: {
id: 'project-1',
name: 'Project 1',
slug: 'project-1',
dataPath: '/tmp/project-1',
isActive: true,
createdAt: '2026-02-22T00:00:00.000Z',
updatedAt: '2026-02-22T00:00:00.000Z',
},
});
});
expect(await screen.findByText('Project Conversation')).toBeInTheDocument();
expect(getConversationsMock).toHaveBeenCalledTimes(2);
});
});

View File

@@ -0,0 +1,54 @@
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
import { formatSidebarRelativeDate } from '../../../src/renderer/components/Sidebar/sidebarDateFormatting';
describe('formatSidebarRelativeDate', () => {
beforeEach(() => {
vi.useFakeTimers();
vi.setSystemTime(new Date('2026-02-23T12:00:00.000Z'));
});
afterEach(() => {
vi.useRealTimers();
});
it('formats same-day dates as time', () => {
const result = formatSidebarRelativeDate({
dateString: '2026-02-23T10:30:00.000Z',
language: 'en',
t: () => 'Yesterday',
});
expect(result).toMatch(/\d/);
expect(result).not.toBe('Yesterday');
});
it('formats one-day-old dates as localized yesterday label', () => {
const result = formatSidebarRelativeDate({
dateString: '2026-02-22T10:30:00.000Z',
language: 'en',
t: () => 'Yesterday',
});
expect(result).toBe('Yesterday');
});
it('formats older dates within a week using weekday', () => {
const result = formatSidebarRelativeDate({
dateString: '2026-02-20T10:30:00.000Z',
language: 'en',
t: () => 'Yesterday',
});
expect(result).toMatch(/^[A-Za-z]{3}$/);
});
it('formats older dates with month/day', () => {
const result = formatSidebarRelativeDate({
dateString: '2026-02-10T10:30:00.000Z',
language: 'en',
t: () => 'Yesterday',
});
expect(result).toMatch(/[A-Za-z]{3}/);
});
});

View File

@@ -0,0 +1,72 @@
import React from 'react';
import { describe, it, expect, vi } from 'vitest';
import { fireEvent, render, screen } from '@testing-library/react';
import { SidebarEntityList } from '../../../src/renderer/components/Sidebar/SidebarEntityList';
describe('SidebarEntityList', () => {
it('renders loading state with header', () => {
render(
<SidebarEntityList
header="Header"
createTitle="Create"
onCreate={vi.fn()}
isLoading
loadingLabel="Loading..."
emptyMessage="Empty"
emptyActionLabel="Create first"
onEmptyAction={vi.fn()}
items={[]}
renderItem={() => null}
/>,
);
expect(screen.getByText('Header')).toBeInTheDocument();
expect(screen.getByText('Loading...')).toBeInTheDocument();
});
it('renders empty state and triggers empty action', () => {
const onEmptyAction = vi.fn();
render(
<SidebarEntityList
header="Header"
createTitle="Create"
onCreate={vi.fn()}
isLoading={false}
loadingLabel="Loading..."
emptyMessage="Empty"
emptyActionLabel="Create first"
onEmptyAction={onEmptyAction}
items={[]}
renderItem={() => null}
/>,
);
fireEvent.click(screen.getByRole('button', { name: 'Create first' }));
expect(onEmptyAction).toHaveBeenCalledTimes(1);
});
it('renders rows and create button action', () => {
const onCreate = vi.fn();
render(
<SidebarEntityList
header="Header"
createTitle="Create"
onCreate={onCreate}
isLoading={false}
loadingLabel="Loading..."
emptyMessage="Empty"
emptyActionLabel="Create first"
onEmptyAction={vi.fn()}
items={[{ id: 'a' }]}
getItemKey={(item) => item.id}
renderItem={(item) => <div>{item.id}</div>}
/>,
);
expect(screen.getByText('a')).toBeInTheDocument();
fireEvent.click(screen.getByRole('button', { name: 'Create' }));
expect(onCreate).toHaveBeenCalledTimes(1);
});
});

View File

@@ -1,6 +1,6 @@
import React from 'react';
import { describe, it, expect, beforeEach, vi } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/react';
import { act, render, screen, fireEvent } from '@testing-library/react';
import { Sidebar } from '../../../src/renderer/components/Sidebar/Sidebar';
import { useAppStore } from '../../../src/renderer/store';
@@ -227,4 +227,57 @@ describe('Sidebar scripts list behavior', () => {
expect(await screen.findByRole('button', { name: 'Renamed Script' })).toBeInTheDocument();
});
it('reloads scripts when active project context becomes available after mount', async () => {
const getAllMock = vi
.fn()
.mockResolvedValueOnce([])
.mockResolvedValueOnce([
{
id: 'script-1',
projectId: 'project-1',
slug: 'hello_script',
title: 'Hello Script',
kind: 'utility',
entrypoint: 'render',
enabled: true,
version: 1,
filePath: '/tmp/hello-script.py',
content: 'print("hello")',
createdAt: '2026-02-22T00:00:00.000Z',
updatedAt: '2026-02-22T00:00:00.000Z',
},
]);
(window as any).electronAPI.scripts.getAll = getAllMock;
useAppStore.setState({
activeProject: null,
activeView: 'scripts',
sidebarVisible: true,
tabs: [],
activeTabId: null,
});
render(<Sidebar />);
expect(await screen.findByText('No scripts yet')).toBeInTheDocument();
act(() => {
useAppStore.setState({
activeProject: {
id: 'project-1',
name: 'Project 1',
slug: 'project-1',
dataPath: '/tmp/project-1',
isActive: true,
createdAt: '2026-02-22T00:00:00.000Z',
updatedAt: '2026-02-22T00:00:00.000Z',
},
});
});
expect(await screen.findByRole('button', { name: 'Hello Script' })).toBeInTheDocument();
expect(getAllMock).toHaveBeenCalledTimes(2);
});
});