Merge pull request #1218 from getlarge/issue-1211-diary-detail-filter-bar

feat(console): diary detail filter bar + libs/diary-ui shared with MCP diary app

Author: getlarge

apps/console/Dockerfile

@@ -18,6 +18,7 @@ COPY pnpm-workspace.yaml pnpm-lock.yaml package.json ./
 COPY apps/console/package.json apps/console/
 COPY libs/design-system/package.json libs/design-system/
 COPY libs/task-ui/package.json libs/task-ui/
+COPY libs/diary-ui/package.json libs/diary-ui/
 COPY libs/api-client/package.json libs/api-client/
 COPY libs/models/package.json libs/models/
 

apps/console/__tests__/diaries-api.test.ts

@@ -1,5 +1,8 @@
+import { renderHook, waitFor } from '@testing-library/react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
+import { createTestWrapper } from './test-query-client.js';
+
 const mockListDiaries = vi.fn();
 const mockListDiaryEntries = vi.fn();
 const mockListDiaryTags = vi.fn();
@@ -8,18 +11,42 @@ vi.mock('@moltnet/api-client', () => ({
   listDiaries: (...args: unknown[]) => mockListDiaries(...args),
   listDiaryEntries: (...args: unknown[]) => mockListDiaryEntries(...args),
   listDiaryTags: (...args: unknown[]) => mockListDiaryTags(...args),
-  getDiary: vi.fn(),
-  getDiaryEntryById: vi.fn(),
-  verifyDiaryEntryById: vi.fn(),
+  // Generated *Options helpers from @moltnet/api-client/query are imported
+  // into hooks.ts but not exercised by useDiarySummaries — stubs are enough
+  // to avoid the resolver erroring.
+  searchDiary: vi.fn(),
+}));
+
+vi.mock('@moltnet/api-client/query', () => ({
+  getDiaryOptions: vi.fn(() => ({
+    queryKey: ['getDiary'],
+    queryFn: vi.fn(),
+  })),
+  getDiaryEntryByIdOptions: vi.fn(() => ({
+    queryKey: ['getDiaryEntryById'],
+    queryFn: vi.fn(),
+  })),
+  listDiaryEntriesInfiniteOptions: vi.fn(() => ({
+    queryKey: ['listDiaryEntries'],
+    queryFn: vi.fn(),
+  })),
+  listDiaryTagsOptions: vi.fn(() => ({
+    queryKey: ['listDiaryTags'],
+    queryFn: vi.fn(),
+  })),
+  verifyDiaryEntryByIdOptions: vi.fn(() => ({
+    queryKey: ['verifyDiaryEntryById'],
+    queryFn: vi.fn(),
+  })),
 }));
 
 vi.mock('../src/api.js', () => ({
   getApiClient: () => ({}),
 }));
 
-import { fetchDiarySummaries } from '../src/diaries/api.js';
+import { useDiarySummaries } from '../src/diaries/hooks.js';
 
-describe('fetchDiarySummaries', () => {
+describe('useDiarySummaries', () => {
   beforeEach(() => {
     vi.clearAllMocks();
     mockListDiaryEntries.mockResolvedValue({
@@ -33,7 +60,13 @@ describe('fetchDiarySummaries', () => {
   it('forwards x-moltnet-team-id header when teamId is provided', async () => {
     mockListDiaries.mockResolvedValue({ data: { items: [] } });
 
-    await fetchDiarySummaries('team-alpha');
+    const { result } = renderHook(() => useDiarySummaries('team-alpha'), {
+      wrapper: createTestWrapper(),
+    });
+
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
 
     expect(mockListDiaries).toHaveBeenCalledWith(
       expect.objectContaining({
@@ -45,20 +78,94 @@ describe('fetchDiarySummaries', () => {
   it('omits the team header when teamId is null', async () => {
     mockListDiaries.mockResolvedValue({ data: { items: [] } });
 
-    await fetchDiarySummaries(null);
+    const { result } = renderHook(() => useDiarySummaries(null), {
+      wrapper: createTestWrapper(),
+    });
+
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
 
     expect(mockListDiaries).toHaveBeenCalledWith(
       expect.objectContaining({ headers: undefined }),
     );
   });
 
-  it('omits the team header when teamId is undefined', async () => {
-    mockListDiaries.mockResolvedValue({ data: { items: [] } });
+  it('aggregates entryCount, tagCount, and latestEntryAt per diary', async () => {
+    mockListDiaries.mockResolvedValue({
+      data: {
+        items: [
+          {
+            id: 'd1',
+            name: 'b-diary',
+            visibility: 'private',
+            teamId: 't1',
+          },
+          {
+            id: 'd2',
+            name: 'a-diary',
+            visibility: 'private',
+            teamId: 't1',
+          },
+        ],
+      },
+    });
 
-    await fetchDiarySummaries();
+    mockListDiaryEntries.mockImplementation(
+      ({ path }: { path: { diaryId: string } }) => {
+        if (path.diaryId === 'd1') {
+          return Promise.resolve({
+            data: {
+              items: [{ createdAt: '2026-05-22T10:00:00Z' }],
+              total: 5,
+            },
+          });
+        }
+        return Promise.resolve({
+          data: { items: [], total: 0 },
+        });
+      },
+    );
 
-    expect(mockListDiaries).toHaveBeenCalledWith(
-      expect.objectContaining({ headers: undefined }),
+    mockListDiaryTags.mockImplementation(
+      ({ path }: { path: { diaryId: string } }) => {
+        if (path.diaryId === 'd1') {
+          return Promise.resolve({
+            data: {
+              tags: [
+                { tag: 'auth', count: 3 },
+                { tag: 'db', count: 2 },
+              ],
+              total: 2,
+            },
+          });
+        }
+        return Promise.resolve({ data: { tags: [], total: 0 } });
+      },
     );
+
+    const { result } = renderHook(() => useDiarySummaries('t1'), {
+      wrapper: createTestWrapper(),
+    });
+
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
+
+    const summaries = result.current.data ?? [];
+    // d1 has the most-recent latestEntryAt → sorts before d2.
+    expect(summaries.map((s) => s.id)).toEqual(['d1', 'd2']);
+    expect(summaries[0]).toMatchObject({
+      id: 'd1',
+      entryCount: 5,
+      tagCount: 2,
+      latestEntryAt: '2026-05-22T10:00:00Z',
+    });
+    expect(summaries[1]).toMatchObject({
+      id: 'd2',
+      entryCount: 0,
+      tagCount: 0,
+      latestEntryAt: null,
+    });
   });
 });

apps/console/e2e/diary-browser.e2e.ts

@@ -154,7 +154,10 @@ test.describe.serial('Diary browser', () => {
     await expect(
       page.getByRole('heading', { name: seeded.populatedDiaryName }),
     ).toBeVisible();
-    await expect(page.getByRole('heading', { name: 'Tags' })).toBeVisible();
+    // FilterBar replaces the old "Tags" card; the search input is the anchor.
+    await expect(
+      page.getByRole('searchbox', { name: /search entries/i }),
+    ).toBeVisible();
     await expect(page.getByRole('button', { name: 'Grid' })).toBeVisible();
     await expect(page.getByRole('button', { name: 'Timeline' })).toBeVisible();
     await expect(page.getByText(seeded.entryTitle)).toBeVisible();
@@ -165,8 +168,10 @@ test.describe.serial('Diary browser', () => {
     await page.goto(`${CONSOLE_URL}/diaries/${seeded.populatedDiaryId}`);
 
     await page.getByText(seeded.entryTag).first().click();
+    // URL contract changed in PR #1218: tag= → tags= (legacy alias still parsed
+    // on read; serializer always emits tags=).
     await expect(page).toHaveURL(
-      new RegExp(`tag=${encodeURIComponent(seeded.entryTag)}`),
+      new RegExp(`tags=${encodeURIComponent(seeded.entryTag)}`),
     );
     await expect(page.getByText(seeded.entryTitle)).toBeVisible();