From 34b547c16a1f0af452f969a3266ab411218693c5 Mon Sep 17 00:00:00 2001
From: Quadcom <admin@quadcom.ca>
Date: Thu, 17 Sep 2026 13:26:35 -0400
Subject: [PATCH 1/2] feat(board): filter the public board by status, hiding
 completed by default

The board showed every card regardless of where it had got to, so finished
work crowded out what was still live. A status control in the toolbar now
narrows the list, defaulting to everything that is not completed.

`?s=` mirrors the existing `?b=`: the default view carries no parameter, so a
bare board URL is still the default and any other selection is a shareable
link.

The list and boards endpoints take `status` as one name or a comma-separated
list, so "everything still live" is one round trip; a single value keeps the
old `eq` behaviour, leaving existing callers untouched. The board counts take
the same filter, since a badge reading 8 above a list of 3 reads as a bug.

Search is the one place the filter is applied client-side: the endpoint
returns a fixed nearest-N set, so filtering narrows those matches rather than
searching deeper. Search here is a duplicate check, not a way to browse.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01E7qmtvZDwy69A484ArAJ2i
---
 app/components/board/BoardSearchToolbar.vue |   6 +-
 app/components/board/BoardStatusPicker.vue  | 119 ++++++++++++++++++++
 app/pages/index.vue                         |  86 +++++++++++++-
 app/stores/board.ts                         |  17 ++-
 i18n/locales/en.json                        |   5 +
 i18n/locales/zh.json                        |   5 +
 server/api/boards/index.get.ts              |   6 +-
 server/api/posts/index.get.ts               |   7 +-
 server/services/boards.ts                   |  12 +-
 server/services/feedback-web-queries.ts     |   4 +-
 shared/types/post.ts                        |  28 +++++
 11 files changed, 274 insertions(+), 21 deletions(-)
 create mode 100644 app/components/board/BoardStatusPicker.vue

diff --git a/app/components/board/BoardSearchToolbar.vue b/app/components/board/BoardSearchToolbar.vue
index c9a1fa4d..e4687744 100644
--- a/app/components/board/BoardSearchToolbar.vue
+++ b/app/components/board/BoardSearchToolbar.vue
@@ -2,6 +2,7 @@
 import { useMediaQuery } from '@vueuse/core'
 const q = defineModel<string>({ default: '' })
 const sortBy = defineModel<'top' | 'recent'>('sort', { default: 'recent' })
+const statusFilter = defineModel<BoardStatusFilter>('status', { default: 'active' })
 const emit = defineEmits<{ 'new-request': [] }>()
 
 const searchOpen = ref(false)
@@ -98,6 +99,7 @@ defineExpose({ reset })
     <div ref="controlsRow" class="fl-rightbar flex items-center relative">
       <Transition name="fl-controls">
         <div v-if="!searchOpen" class="flex items-center gap-3">
+          <BoardStatusPicker v-model="statusFilter" />
           <div class="flex bg-border/50 p-1 rounded-lg">
             <button
               class="px-4 py-1.5 rounded-[12px] text-sm font-medium transition-colors"
@@ -292,7 +294,9 @@ defineExpose({ reset })
 }
 .fl-controls-enter-to,
 .fl-controls-leave-from {
-  max-width: 320px;
+  /* Wide enough for the status filter, the sort switch and the search button —
+     the accordion clips whatever this cap cuts off. */
+  max-width: 520px;
 }
 
 .fl-rightbar {
diff --git a/app/components/board/BoardStatusPicker.vue b/app/components/board/BoardStatusPicker.vue
new file mode 100644
index 00000000..7820d874
--- /dev/null
+++ b/app/components/board/BoardStatusPicker.vue
@@ -0,0 +1,119 @@
+<script setup lang="ts">
+// Status filter for the public board. Sits beside the Top/Recent switch and
+// reads as one of that pair — same height, same 12px radius as .fl-toolbtn.
+const filter = defineModel<BoardStatusFilter>({ default: 'active' })
+
+// 'active' and 'all' are views rather than statuses, so they lead; the four real
+// statuses follow the separator in roadmap order.
+const VIEWS: BoardStatusFilter[] = ['active', 'all']
+
+function labelKey(value: BoardStatusFilter): string {
+  return value === 'active' || value === 'all'
+    ? `board.status${value === 'active' ? 'Active' : 'All'}`
+    : statusLabelKey(value)
+}
+
+// The trigger's dot colours only make sense for a single status; the two views
+// span several, so they get the neutral filter icon instead.
+const activeCssVar = computed(() => (
+  filter.value === 'active' || filter.value === 'all'
+    ? null
+    : STATUS_CONFIG[filter.value].cssVar
+))
+</script>
+
+<template>
+  <DropdownMenu>
+    <DropdownMenuTrigger as-child>
+      <button
+        type="button"
+        class="fl-toolbtn fl-toolbtn--status"
+        :class="{ 'fl-toolbtn--on': filter !== 'active' }"
+        :aria-label="$t('board.statusFilter')"
+      >
+        <span
+          v-if="activeCssVar"
+          class="fl-dot"
+          :style="{ backgroundColor: `var(${activeCssVar})` }"
+        />
+        <Icon v-else name="lucide:list-filter" size="18" />
+        <span class="hidden sm:inline">{{ $t(labelKey(filter)) }}</span>
+      </button>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent align="end" class="w-44">
+      <DropdownMenuItem
+        v-for="v in VIEWS"
+        :key="v"
+        class="cursor-pointer"
+        @click="filter = v"
+      >
+        <span class="flex-1">{{ $t(labelKey(v)) }}</span>
+        <Icon v-if="filter === v" name="lucide:check" size="14" class="text-primary" />
+      </DropdownMenuItem>
+      <DropdownMenuSeparator />
+      <DropdownMenuItem
+        v-for="s in POST_STATUSES"
+        :key="s"
+        class="cursor-pointer"
+        @click="filter = s"
+      >
+        <span class="fl-dot" :style="{ backgroundColor: `var(${STATUS_CONFIG[s].cssVar})` }" />
+        <span class="flex-1">{{ $t(statusLabelKey(s)) }}</span>
+        <Icon v-if="filter === s" name="lucide:check" size="14" class="text-primary" />
+      </DropdownMenuItem>
+    </DropdownMenuContent>
+  </DropdownMenu>
+</template>
+
+<style scoped>
+/* Mirrors .fl-toolbtn in BoardSearchToolbar — scoped styles do not reach across
+   components, so the shape is repeated rather than shared. */
+.fl-toolbtn {
+  height: 40px;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 16px;
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  background: var(--card);
+  color: var(--muted-foreground);
+  font-size: 14px;
+  font-weight: 500;
+  white-space: nowrap;
+  transition: border-color 0.15s ease, color 0.15s ease;
+}
+.fl-toolbtn:hover {
+  border-color: var(--primary);
+  color: var(--foreground);
+}
+
+/* Any selection other than the default is a state the visitor should be able to
+   spot without opening the menu. */
+.fl-toolbtn--on {
+  border-color: var(--primary);
+  color: var(--foreground);
+}
+
+.fl-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 999px;
+  flex: none;
+}
+
+@media (max-width: 639.98px) {
+  .fl-toolbtn--status {
+    width: 40px;
+    padding: 0;
+    gap: 0;
+    justify-content: center;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .fl-toolbtn {
+    transition: none;
+  }
+}
+</style>
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 1e5d0ad0..3af84e13 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -17,7 +17,6 @@ const timeAgo = useTimeAgo()
 
 // Board store
 const boardStore = useBoardStore()
-await callOnce(() => boardStore.fetchBoards())
 const { boards, boardMap, totalPostCount } = storeToRefs(boardStore)
 
 // Currently selected board and sort order
@@ -38,6 +37,28 @@ const activeBoardId = computed(() => {
 })
 const sortBy = ref<'top' | 'recent'>('recent')
 
+// `?s=` mirrors `?b=`: the default view carries no param, so a bare board URL is
+// the default and every other selection is a shareable link. Unrecognised values
+// fall back to the default rather than emptying the board.
+const STATUS_FILTERS = new Set<string>(['active', 'all', ...POST_STATUSES])
+const statusFilter = computed<BoardStatusFilter>(() => {
+  const raw = (route.query.s as string) || ''
+  return STATUS_FILTERS.has(raw) ? raw as BoardStatusFilter : 'active'
+})
+// null = no status condition at all ("all").
+const statusList = computed(() => statusFilterToStatuses(statusFilter.value))
+
+function selectStatus(value: BoardStatusFilter) {
+  const query = { ...route.query }
+  if (value === 'active') delete query.s
+  else query.s = value
+  router.push({ query })
+}
+
+// Sidebar counts are fetched with the same filter — a badge reading 8 above a
+// list of 3 reads as a bug.
+await callOnce(() => boardStore.fetchBoards(statusList.value))
+
 // Post list
 const sort = computed(() => sortBy.value === 'top' ? 'votes' : 'createdAt')
 
@@ -53,6 +74,7 @@ async function fetchPosts(cursor?: string) {
   const data = await useApiFetch<CursorPaginatedList<PostListItem>>('/api/posts', {
     query: {
       boardId: activeBoardId.value || undefined,
+      status: statusList.value?.join(',') || undefined,
       sort: sort.value,
       pageSize: 10,
       cursor,
@@ -87,6 +109,23 @@ watch(activeBoardId, async () => {
   }
 })
 
+watch(statusFilter, async () => {
+  void boardStore.fetchBoards(statusList.value)
+  // A committed search is filtered client-side (see `visiblePosts`), so there is
+  // nothing to refetch.
+  if (searchActive.value) return
+  startLoading()
+  fetchingPosts.value = true
+  try {
+    const data = await fetchPosts()
+    posts.value = data.data
+    nextCursor.value = data.pagination.nextCursor
+  } finally {
+    finishLoading()
+    fetchingPosts.value = false
+  }
+})
+
 watch(sort, async () => {
   if (searchActive.value) return
   fetchingPosts.value = true
@@ -122,6 +161,16 @@ watch(searchQuery, async () => {
   }
 })
 
+// Search asks the server for a fixed nearest-N set, so the status filter is
+// applied to what comes back rather than pushed into the query: it narrows those
+// matches rather than searching deeper. Right trade — search here is a
+// duplicate check, not a way to browse.
+const visiblePosts = computed(() => {
+  if (!searchActive.value || !statusList.value) return posts.value
+  const allowed = new Set<string>(statusList.value)
+  return posts.value.filter(p => allowed.has(p.status))
+})
+
 async function loadMore() {
   if (!nextCursor.value || loadingMore.value) return
   loadingMore.value = true
@@ -210,7 +259,7 @@ function onPostUpdated(updated: { id: string; status?: string; boardId?: string
   // Board changed → the sidebar's per-board counts (served from the board store)
   // are now stale. Compare against the pre-update boardId, then refresh the store.
   if (updated.boardId !== undefined && updated.boardId !== posts.value[idx].boardId) {
-    void boardStore.fetchBoards()
+    void boardStore.fetchBoards(statusList.value)
   }
 
   // If status or board changed and no longer matches current filter, remove
@@ -219,6 +268,15 @@ function onPostUpdated(updated: { id: string; status?: string; boardId?: string
     return
   }
 
+  // Status moved out of the current filter → drop it, same as a board change does.
+  if (updated.status !== undefined && statusList.value) {
+    void boardStore.fetchBoards(statusList.value) // the counts just shifted between statuses
+    if (!statusList.value.includes(updated.status as PostStatus)) {
+      posts.value.splice(idx, 1)
+      return
+    }
+  }
+
   // Update fields in place
   Object.assign(posts.value[idx], updated)
 }
@@ -227,7 +285,7 @@ function onPostDeleted(postId: string) {
   const idx = posts.value.findIndex(p => p.id === postId)
   if (idx !== -1) posts.value.splice(idx, 1)
   // A deleted post drops its board's count (and the total) → refresh the store.
-  void boardStore.fetchBoards()
+  void boardStore.fetchBoards(statusList.value)
 }
 
 // Vote / unvote on list items
@@ -364,6 +422,8 @@ async function handleVote(post: PostListItem) {
       ref="searchToolbar"
       v-model="searchQuery"
       v-model:sort="sortBy"
+      :status="statusFilter"
+      @update:status="selectStatus"
       @new-request="openSubmit()"
     />
 
@@ -371,7 +431,7 @@ async function handleVote(post: PostListItem) {
     <div :class="{ 'opacity-50 pointer-events-none': fetchingPosts || searching }" class="transition-opacity duration-200">
 
     <!-- Empty state -->
-    <div v-if="posts.length === 0" class="flex flex-col items-center justify-center py-16 text-muted-foreground">
+    <div v-if="visiblePosts.length === 0" class="flex flex-col items-center justify-center py-16 text-muted-foreground">
       <!-- Search yielded nothing: nudge toward raising it (duplicate-prevention payoff) -->
       <template v-if="searchActive">
         <Icon name="lucide:search-x" size="48" class="mb-4 opacity-50" />
@@ -387,6 +447,13 @@ async function handleVote(post: PostListItem) {
           {{ $t('board.newRequest') }}
         </Button>
       </template>
+      <template v-else-if="statusFilter !== 'all'">
+        <Icon name="lucide:filter-x" size="48" class="mb-4 opacity-50" />
+        <p class="text-lg font-medium">{{ $t('board.noFeedbackFiltered') }}</p>
+        <button class="fl-empty__link" @click="selectStatus('all')">
+          {{ $t('board.showAllStatuses') }}
+        </button>
+      </template>
       <template v-else>
         <Icon name="lucide:inbox" size="48" class="mb-4 opacity-50" />
         <p class="text-lg font-medium">{{ $t('board.noFeedback') }}</p>
@@ -396,7 +463,7 @@ async function handleVote(post: PostListItem) {
     <!-- Feedback card list -->
     <div v-else class="flex flex-col gap-4">
       <article
-        v-for="p in posts"
+        v-for="p in visiblePosts"
         :key="p.id"
         class="feedback-card flex items-stretch gap-4 bg-card border border-border rounded-lg p-4 cursor-pointer"
         data-fdl-action="feedback_open"
@@ -513,6 +580,15 @@ nav::-webkit-scrollbar {
   display: none;
 }
 
+.fl-empty__link {
+  font-size: 14px;
+  margin-top: 8px;
+  font-weight: 500;
+  color: var(--primary);
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+
 .fl-empty__hint {
   font-size: 14px;
   margin: 4px 0 20px;
diff --git a/app/stores/board.ts b/app/stores/board.ts
index bec54728..84a6fee4 100644
--- a/app/stores/board.ts
+++ b/app/stores/board.ts
@@ -11,9 +11,18 @@ export const useBoardStore = defineStore('board', () => {
 
   const totalPostCount = ref(0)
 
+  // Statuses the counts are currently narrowed to, remembered so the refetches
+  // below keep the portal's filter rather than silently widening back to "all".
+  // Passing nothing clears it — which is what the dashboard pages do, since the
+  // store is one instance for the whole session and their counts are unfiltered.
+  const countStatuses = ref<string[] | null>(null)
+
   // Read
-  async function fetchBoards() {
-    const res = await useApiFetch<{ data: BoardItem[]; totalPostCount: number }>('/api/boards')
+  async function fetchBoards(statuses?: string[] | null) {
+    countStatuses.value = statuses?.length ? statuses : null
+    const res = await useApiFetch<{ data: BoardItem[]; totalPostCount: number }>('/api/boards', {
+      query: { status: countStatuses.value?.join(',') || undefined },
+    })
     boards.value = res.data
     totalPostCount.value = res.totalPostCount
   }
@@ -21,13 +30,13 @@ export const useBoardStore = defineStore('board', () => {
   // Admin: create
   async function createBoard(data: { name: string; description?: string }) {
     await useApiFetch('/api/admin/boards', { method: 'POST', body: data })
-    await fetchBoards()
+    await fetchBoards(countStatuses.value)
   }
 
   // Admin: update
   async function updateBoard(id: string, data: { name?: string; description?: string | null }) {
     await useApiFetch(`/api/admin/boards/${id}`, { method: 'PATCH', body: data })
-    await fetchBoards()
+    await fetchBoards(countStatuses.value)
   }
 
   // Admin: delete
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index c9f72530..592bf2b5 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -61,12 +61,17 @@
     "recentRequests": "Recent Requests",
     "sortTop": "Top",
     "sortRecent": "Recent",
+    "statusFilter": "Filter by status",
+    "statusActive": "Active",
+    "statusAll": "All statuses",
     "search": "Search",
     "searchPlaceholder": "Search feedback…",
     "clearSearch": "Clear search",
     "closeSearch": "Close search",
     "newRequest": "New Request",
     "noFeedback": "No feedback yet",
+    "noFeedbackFiltered": "Nothing matches this status",
+    "showAllStatuses": "Show all statuses",
     "noMatches": "No matches for “{query}”",
     "noMatchesHint": "Nobody’s raised this yet — be the first.",
     "comments": "{n} comments",
diff --git a/i18n/locales/zh.json b/i18n/locales/zh.json
index 47cd921d..cbedb666 100644
--- a/i18n/locales/zh.json
+++ b/i18n/locales/zh.json
@@ -61,12 +61,17 @@
     "recentRequests": "最新请求",
     "sortTop": "热门",
     "sortRecent": "最新",
+    "statusFilter": "按状态筛选",
+    "statusActive": "进行中",
+    "statusAll": "全部状态",
     "search": "搜索",
     "searchPlaceholder": "搜索反馈…",
     "clearSearch": "清除搜索",
     "closeSearch": "关闭搜索",
     "newRequest": "新建反馈",
     "noFeedback": "还没有反馈",
+    "noFeedbackFiltered": "没有符合该状态的反馈",
+    "showAllStatuses": "显示全部状态",
     "noMatches": "没有匹配“{query}”的结果",
     "noMatchesHint": "还没有人提过 —— 来做第一个吧。",
     "comments": "{n} 条评论",
diff --git a/server/api/boards/index.get.ts b/server/api/boards/index.get.ts
index ad7acf37..99018ad9 100644
--- a/server/api/boards/index.get.ts
+++ b/server/api/boards/index.get.ts
@@ -1,3 +1,7 @@
 import { boardOverview } from '../../services/boards'
+import { parseStatusParam } from '#layers/feedlog/shared/types/post'
 
-export default defineEventHandler(event => boardOverview({ db: useDB(), orgId: event.context.orgId! }))
+export default defineEventHandler(event => boardOverview(
+  { db: useDB(), orgId: event.context.orgId! },
+  parseStatusParam(getQuery(event).status),
+))
diff --git a/server/api/posts/index.get.ts b/server/api/posts/index.get.ts
index 89ef0ff7..4688f0ef 100644
--- a/server/api/posts/index.get.ts
+++ b/server/api/posts/index.get.ts
@@ -1,11 +1,14 @@
 import { listPublicFeedback } from '#layers/feedlog/server/services/feedback-web-queries'
+import { parseStatusParam } from '#layers/feedlog/shared/types/post'
 
 export default defineEventHandler(async (event): Promise<CursorPaginatedList<PostListItem>> => {
   const session = await getUserSession(event)
   const query = getQuery(event)
 
   const boardId = query.boardId as string | undefined
-  const status = query.status as string | undefined
+  // `status` takes one name or a comma-separated list, so the board can ask for
+  // "everything still live" in one round trip. Unknown names are dropped.
+  const statuses = parseStatusParam(query.status)
   const sort = (query.sort as string) || 'createdAt'
   const order = (query.order as string) || 'desc'
   const cursor = query.cursor as string | undefined
@@ -13,5 +16,5 @@ export default defineEventHandler(async (event): Promise<CursorPaginatedList<Pos
 
   const orgId = event.context.orgId!
 
-  return listPublicFeedback({ db: useDB(), orgId }, { boardId, status, sort, order, cursor, pageSize }, session?.user.id)
+  return listPublicFeedback({ db: useDB(), orgId }, { boardId, status: statuses, sort, order, cursor, pageSize }, session?.user.id)
 })
diff --git a/server/services/boards.ts b/server/services/boards.ts
index a295290e..f702fcc5 100644
--- a/server/services/boards.ts
+++ b/server/services/boards.ts
@@ -38,19 +38,19 @@ export const boardFields = {
 }
 // Both dashboard counts and paginated board summaries exclude merged children.
 const boardFeedbackCount = sql<number>`count(${post.id})::int`
-export async function listBoards(context: ContentReader, input?: CursorPageInput) {
-  const scope = { kind: 'boards', organizationId: context.orgId, filter: {}, sort: 'position', ascending: true }
+export async function listBoards(context: ContentReader, input?: CursorPageInput, statuses?: string[]) {
+  const scope = { kind: 'boards', organizationId: context.orgId, filter: statuses?.length ? { status: statuses } : {}, sort: 'position', ascending: true }
   const page = input ? await cursorPage(input, scope, board.position, board.id, true, true) : undefined
   const query = context.db.select({ ...boardFields, feedbackCount: boardFeedbackCount, cursorKey: board.position }).from(board)
-    .leftJoin(post, and(eq(post.boardId, board.id), ...postFilterConditions({ orgId: context.orgId })))
+    .leftJoin(post, and(eq(post.boardId, board.id), ...postFilterConditions({ orgId: context.orgId, status: statuses })))
     .where(and(eq(board.orgId, context.orgId), page?.after)).groupBy(board.id).orderBy(asc(board.position), asc(board.id))
   const rows = await (input ? query.limit(input.limit + 1) : query)
   return page ? page.finish(rows) : { items: rows.map(({ cursorKey: _key, ...row }) => row), nextCursor: null }
 }
-export async function boardOverview(context: ContentReader) {
+export async function boardOverview(context: ContentReader, statuses?: string[]) {
   const [page, totals] = await Promise.all([
-    listBoards(context),
-    context.db.select({ count: sql<number>`count(*)::int` }).from(post).where(and(...postFilterConditions({ orgId: context.orgId }))),
+    listBoards(context, undefined, statuses),
+    context.db.select({ count: sql<number>`count(*)::int` }).from(post).where(and(...postFilterConditions({ orgId: context.orgId, status: statuses }))),
   ])
   return {
     data: page.items.map(({ id, name, description, position, feedbackCount, createdAt }) => ({ id, name, description, position, postCount: feedbackCount, createdAt })),
diff --git a/server/services/feedback-web-queries.ts b/server/services/feedback-web-queries.ts
index 05fd93ae..3d484959 100644
--- a/server/services/feedback-web-queries.ts
+++ b/server/services/feedback-web-queries.ts
@@ -8,11 +8,11 @@ import { z } from 'zod'
 import { encodeWebCursor, decodeWebCursor } from './web-pagination'
 import { createError } from 'h3'
 
-export async function listPublicFeedback(context: ContentReader, input: { boardId?: string; status?: string; sort: string; order: string; cursor?: string; pageSize: number }, viewerId?: string) {
+export async function listPublicFeedback(context: ContentReader, input: { boardId?: string; status?: string[]; sort: string; order: string; cursor?: string; pageSize: number }, viewerId?: string) {
   const { db, orgId } = context
   const { boardId, status, sort, order, cursor, pageSize } = input
   // Default: exclude merged posts
-  const conditions = postFilterConditions({ orgId, boardId: boardId ? [boardId] : undefined, status: status ? [status] : undefined })
+  const conditions = postFilterConditions({ orgId, boardId: boardId ? [boardId] : undefined, status })
 
   // Cursor conditions
   if (cursor) {
diff --git a/shared/types/post.ts b/shared/types/post.ts
index eb89d167..05bab5f3 100644
--- a/shared/types/post.ts
+++ b/shared/types/post.ts
@@ -2,6 +2,34 @@
 export const POST_STATUSES = ['open', 'planned', 'in_progress', 'done'] as const
 export type PostStatus = typeof POST_STATUSES[number]
 
+// The board's default view: work that is still live. 'done' is the only status
+// a visitor has to ask for explicitly, because a finished card answers nothing
+// they came to the board for.
+export const ACTIVE_STATUSES = ['open', 'planned', 'in_progress'] as const
+
+/** What the board's status control can be set to. */
+export type BoardStatusFilter = 'active' | 'all' | PostStatus
+
+/** Statuses a filter selection admits, or null for "no status condition". */
+export function statusFilterToStatuses(filter: BoardStatusFilter): PostStatus[] | null {
+  if (filter === 'all') return null
+  if (filter === 'active') return [...ACTIVE_STATUSES]
+  return [filter]
+}
+
+/**
+ * Parse a `status` query value: one status name, or a comma-separated list of
+ * them. Unknown names are dropped rather than rejected — a hand-written link
+ * with a typo should still return a board, not a 400.
+ */
+export function parseStatusParam(raw: unknown): PostStatus[] {
+  if (typeof raw !== 'string') return []
+  return raw
+    .split(',')
+    .map(s => s.trim())
+    .filter((s): s is PostStatus => (POST_STATUSES as readonly string[]).includes(s))
+}
+
 // Roadmap only shows these three statuses (excludes 'open')
 export const ROADMAP_STATUSES = ['planned', 'in_progress', 'done'] as const
 export type RoadmapStatus = typeof ROADMAP_STATUSES[number]

From 7509d23206b95847c6ce5b8ff6d80770fc3d1451 Mon Sep 17 00:00:00 2001
From: canghai118 <3394863+canghai118@users.noreply.github.com>
Date: Fri, 16 Oct 2026 04:07:34 +0000
Subject: [PATCH 2/2] fix(board): keep status filters consistent across
 searches and counts

Filter semantic and trigram searches before their result limits, preserve status
parameters when switching boards, and keep portal counts separate from shared
unfiltered board metadata. Refresh both views after mutations and discard stale
list, pagination and count responses. Give Active a distinct Chinese label.

Add HTTP integration coverage for search limits, status pagination, merged
feedback and organization boundaries. Verify portal navigation, submissions,
deletions and reordered responses in the browser.

Signed-off-by: canghai118 <3394863+canghai118@users.noreply.github.com>
---
 app/pages/index.vue                    | 146 ++++++++++++-------------
 app/stores/board.ts                    |  17 +--
 i18n/locales/zh.json                   |   2 +-
 server/api/posts/search.get.ts         |  11 +-
 tests/board-status.integration.test.ts | 116 ++++++++++++++++++++
 5 files changed, 197 insertions(+), 95 deletions(-)
 create mode 100644 tests/board-status.integration.test.ts

diff --git a/app/pages/index.vue b/app/pages/index.vue
index 3af84e13..6c475f2d 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -17,7 +17,10 @@ const timeAgo = useTimeAgo()
 
 // Board store
 const boardStore = useBoardStore()
-const { boards, boardMap, totalPostCount } = storeToRefs(boardStore)
+// Portal counts belong to this view; dialogs and other pages use unfiltered metadata.
+const boards = ref<BoardItem[]>([])
+const totalPostCount = ref(0)
+const boardMap = computed(() => new Map(boards.value.map(board => [board.id, board.name])))
 
 // Currently selected board and sort order
 const route = useRoute()
@@ -55,9 +58,21 @@ function selectStatus(value: BoardStatusFilter) {
   router.push({ query })
 }
 
-// Sidebar counts are fetched with the same filter — a badge reading 8 above a
-// list of 3 reads as a bug.
-await callOnce(() => boardStore.fetchBoards(statusList.value))
+let countSequence = 0
+async function refreshBoardCounts() {
+  const current = ++countSequence
+  const result = await useApiFetch<{ data: BoardItem[]; totalPostCount: number }>('/api/boards', {
+    query: { status: statusList.value?.join(',') || undefined },
+  })
+  if (current !== countSequence) return
+  boards.value = result.data
+  totalPostCount.value = result.totalPostCount
+}
+
+await Promise.all([
+  callOnce(() => boardStore.fetchBoards()),
+  refreshBoardCounts(),
+])
 
 // Post list
 const sort = computed(() => sortBy.value === 'top' ? 'votes' : 'createdAt')
@@ -94,88 +109,59 @@ const searchActive = computed(() => searchQuery.value.trim().length > 0)
 const searchToolbar = ref<{ reset: () => void } | null>(null)
 let boardSwitchClearing = false
 
-// Reset list when filters change
-watch(activeBoardId, async () => {
-  if (searchActive.value) return
+let postSequence = 0
+async function refreshPosts() {
+  const current = ++postSequence
+  const q = searchQuery.value.trim()
+  searching.value = !!q
+  fetchingPosts.value = !q
   startLoading()
-  fetchingPosts.value = true
   try {
-    const data = await fetchPosts()
-    posts.value = data.data
-    nextCursor.value = data.pagination.nextCursor
+    const result: { data: PostListItem[]; pagination?: { nextCursor: string | null } } = q
+      ? await useApiFetch<{ data: PostListItem[] }>('/api/posts/search', {
+          query: { q, status: statusList.value?.join(',') || undefined },
+        })
+      : await fetchPosts()
+    if (current !== postSequence) return
+    posts.value = result.data
+    nextCursor.value = result.pagination?.nextCursor ?? null
   } finally {
-    finishLoading()
-    fetchingPosts.value = false
+    if (current === postSequence) {
+      searching.value = false
+      fetchingPosts.value = false
+      finishLoading()
+    }
   }
-})
+}
 
+watch(activeBoardId, () => refreshPosts())
 watch(statusFilter, async () => {
-  void boardStore.fetchBoards(statusList.value)
-  // A committed search is filtered client-side (see `visiblePosts`), so there is
-  // nothing to refetch.
-  if (searchActive.value) return
-  startLoading()
-  fetchingPosts.value = true
-  try {
-    const data = await fetchPosts()
-    posts.value = data.data
-    nextCursor.value = data.pagination.nextCursor
-  } finally {
-    finishLoading()
-    fetchingPosts.value = false
-  }
+  await Promise.all([refreshBoardCounts(), refreshPosts()])
 })
-
 watch(sort, async () => {
-  if (searchActive.value) return
-  fetchingPosts.value = true
-  try {
-    const data = await fetchPosts()
-    posts.value = data.data
-    nextCursor.value = data.pagination.nextCursor
-  } finally {
-    fetchingPosts.value = false
-  }
+  if (!searchActive.value) await refreshPosts()
 })
-
-async function refreshPosts() {
-  const data = await fetchPosts()
-  posts.value = data.data
-  nextCursor.value = data.pagination.nextCursor
-}
-
 watch(searchQuery, async () => {
-  const q = searchQuery.value.trim()
-  if (!q) {
-    if (boardSwitchClearing) { boardSwitchClearing = false; return }
-    await refreshPosts()
+  if (!searchActive.value && boardSwitchClearing) {
+    boardSwitchClearing = false
     return
   }
-  searching.value = true
-  try {
-    const res = await useApiFetch<{ data: PostListItem[] }>('/api/posts/search', { query: { q } })
-    posts.value = res.data
-    nextCursor.value = null // search returns a flat capped set — no "load more"
-  } finally {
-    searching.value = false
-  }
+  await refreshPosts()
 })
 
-// Search asks the server for a fixed nearest-N set, so the status filter is
-// applied to what comes back rather than pushed into the query: it narrows those
-// matches rather than searching deeper. Right trade — search here is a
-// duplicate check, not a way to browse.
-const visiblePosts = computed(() => {
-  if (!searchActive.value || !statusList.value) return posts.value
-  const allowed = new Set<string>(statusList.value)
-  return posts.value.filter(p => allowed.has(p.status))
+onBeforeUnmount(() => {
+  postSequence++
+  countSequence++
+  finishLoading()
 })
 
 async function loadMore() {
-  if (!nextCursor.value || loadingMore.value) return
+  if (!nextCursor.value || loadingMore.value || fetchingPosts.value || searchActive.value) return
+  const current = postSequence
   loadingMore.value = true
   try {
     const data = await fetchPosts(nextCursor.value)
+    if (current !== postSequence) return
     posts.value.push(...data.data)
     nextCursor.value = data.pagination.nextCursor
   } finally {
@@ -192,7 +178,10 @@ async function selectBoard(boardId: string | null) {
     boardSwitchClearing = true
     searchQuery.value = ''
   }
-  router.push({ query: boardId ? { b: boardId } : {} })
+  const query = { ...route.query }
+  if (boardId) query.b = boardId
+  else delete query.b
+  await router.push({ query })
   if (wasCommitted && sameBoard) await refreshPosts()
 }
 
@@ -256,10 +245,10 @@ function onPostUpdated(updated: { id: string; status?: string; boardId?: string
   const idx = posts.value.findIndex(p => p.id === updated.id)
   if (idx === -1) return
 
-  // Board changed → the sidebar's per-board counts (served from the board store)
-  // are now stale. Compare against the pre-update boardId, then refresh the store.
-  if (updated.boardId !== undefined && updated.boardId !== posts.value[idx].boardId) {
-    void boardStore.fetchBoards(statusList.value)
+  const previous = posts.value[idx]!
+  if ((updated.boardId !== undefined && updated.boardId !== previous.boardId)
+    || (updated.status !== undefined && updated.status !== previous.status)) {
+    void Promise.all([refreshBoardCounts(), boardStore.fetchBoards()])
   }
 
   // If status or board changed and no longer matches current filter, remove
@@ -270,7 +259,6 @@ function onPostUpdated(updated: { id: string; status?: string; boardId?: string
 
   // Status moved out of the current filter → drop it, same as a board change does.
   if (updated.status !== undefined && statusList.value) {
-    void boardStore.fetchBoards(statusList.value) // the counts just shifted between statuses
     if (!statusList.value.includes(updated.status as PostStatus)) {
       posts.value.splice(idx, 1)
       return
@@ -284,8 +272,12 @@ function onPostUpdated(updated: { id: string; status?: string; boardId?: string
 function onPostDeleted(postId: string) {
   const idx = posts.value.findIndex(p => p.id === postId)
   if (idx !== -1) posts.value.splice(idx, 1)
-  // A deleted post drops its board's count (and the total) → refresh the store.
-  void boardStore.fetchBoards(statusList.value)
+  // Refresh both the filtered portal counts and unfiltered metadata consumers.
+  void Promise.all([refreshBoardCounts(), boardStore.fetchBoards()])
+}
+
+async function onPostCreated() {
+  await Promise.all([refreshPosts(), refreshBoardCounts()])
 }
 
 // Vote / unvote on list items
@@ -431,7 +423,7 @@ async function handleVote(post: PostListItem) {
     <div :class="{ 'opacity-50 pointer-events-none': fetchingPosts || searching }" class="transition-opacity duration-200">
 
     <!-- Empty state -->
-    <div v-if="visiblePosts.length === 0" class="flex flex-col items-center justify-center py-16 text-muted-foreground">
+    <div v-if="posts.length === 0" class="flex flex-col items-center justify-center py-16 text-muted-foreground">
       <!-- Search yielded nothing: nudge toward raising it (duplicate-prevention payoff) -->
       <template v-if="searchActive">
         <Icon name="lucide:search-x" size="48" class="mb-4 opacity-50" />
@@ -463,7 +455,7 @@ async function handleVote(post: PostListItem) {
     <!-- Feedback card list -->
     <div v-else class="flex flex-col gap-4">
       <article
-        v-for="p in visiblePosts"
+        v-for="p in posts"
         :key="p.id"
         class="feedback-card flex items-stretch gap-4 bg-card border border-border rounded-lg p-4 cursor-pointer"
         data-fdl-action="feedback_open"
@@ -559,7 +551,7 @@ async function handleVote(post: PostListItem) {
     v-model:open="showSubmit"
     :default-board-id="activeBoardId ?? undefined"
     :prefill="submitPrefill"
-    @created="refreshPosts()"
+    @created="onPostCreated"
   />
 </template>
 
diff --git a/app/stores/board.ts b/app/stores/board.ts
index 84a6fee4..bec54728 100644
--- a/app/stores/board.ts
+++ b/app/stores/board.ts
@@ -11,18 +11,9 @@ export const useBoardStore = defineStore('board', () => {
 
   const totalPostCount = ref(0)
 
-  // Statuses the counts are currently narrowed to, remembered so the refetches
-  // below keep the portal's filter rather than silently widening back to "all".
-  // Passing nothing clears it — which is what the dashboard pages do, since the
-  // store is one instance for the whole session and their counts are unfiltered.
-  const countStatuses = ref<string[] | null>(null)
-
   // Read
-  async function fetchBoards(statuses?: string[] | null) {
-    countStatuses.value = statuses?.length ? statuses : null
-    const res = await useApiFetch<{ data: BoardItem[]; totalPostCount: number }>('/api/boards', {
-      query: { status: countStatuses.value?.join(',') || undefined },
-    })
+  async function fetchBoards() {
+    const res = await useApiFetch<{ data: BoardItem[]; totalPostCount: number }>('/api/boards')
     boards.value = res.data
     totalPostCount.value = res.totalPostCount
   }
@@ -30,13 +21,13 @@ export const useBoardStore = defineStore('board', () => {
   // Admin: create
   async function createBoard(data: { name: string; description?: string }) {
     await useApiFetch('/api/admin/boards', { method: 'POST', body: data })
-    await fetchBoards(countStatuses.value)
+    await fetchBoards()
   }
 
   // Admin: update
   async function updateBoard(id: string, data: { name?: string; description?: string | null }) {
     await useApiFetch(`/api/admin/boards/${id}`, { method: 'PATCH', body: data })
-    await fetchBoards(countStatuses.value)
+    await fetchBoards()
   }
 
   // Admin: delete
diff --git a/i18n/locales/zh.json b/i18n/locales/zh.json
index cbedb666..8e45bfb3 100644
--- a/i18n/locales/zh.json
+++ b/i18n/locales/zh.json
@@ -62,7 +62,7 @@
     "sortTop": "热门",
     "sortRecent": "最新",
     "statusFilter": "按状态筛选",
-    "statusActive": "进行中",
+    "statusActive": "待解决",
     "statusAll": "全部状态",
     "search": "搜索",
     "searchPlaceholder": "搜索反馈…",
diff --git a/server/api/posts/search.get.ts b/server/api/posts/search.get.ts
index 24a1f571..9ea6ea9f 100644
--- a/server/api/posts/search.get.ts
+++ b/server/api/posts/search.get.ts
@@ -1,7 +1,9 @@
-import { eq, and, isNull, inArray, sql } from 'drizzle-orm'
+import { eq, and, inArray, sql } from 'drizzle-orm'
 import { post, postSearch, user, vote } from '#layers/feedlog/server/db/schemas'
+import { parseStatusParam } from '#layers/feedlog/shared/types/post'
+import { postFilterConditions } from '#layers/feedlog/server/utils/postFilterConditions'
 
-// GET /api/posts/search?q=&limit= — Public semantic search over an org's feedback.
+// GET /api/posts/search?q=&status= — Public semantic search over an org's feedback.
 //
 // Fully consistent with the similar-posts search: embed the query and return the nearest N by
 // pgvector cosine distance with NO threshold — always shows the closest posts (no
@@ -16,6 +18,7 @@ export default defineEventHandler(async (event) => {
   const session = await getUserSession(event)
   const query = getQuery(event)
   const orgId = event.context.orgId!
+  const filter = { orgId, status: parseStatusParam(query.status), merged: 'canonical_only' as const }
 
   const q = ((query.q as string | undefined) ?? '').trim()
   if (!q) return { data: [] as PostListItem[] }
@@ -29,7 +32,7 @@ export default defineEventHandler(async (event) => {
   let rows
   if (embedding) {
     rows = await searchPostsBySemantic(embedding, {
-      filter: { orgId, merged: 'canonical_only' },
+      filter,
       limit: PUBLIC_SEARCH_LIMIT,
     })
   }
@@ -57,7 +60,7 @@ export default defineEventHandler(async (event) => {
       .from(post)
       .innerJoin(postSearch, eq(post.id, postSearch.postId))
       .leftJoin(user, eq(post.authorId, user.id))
-      .where(and(eq(post.orgId, orgId), isNull(post.mergedTo)))
+      .where(and(...postFilterConditions(filter)))
       .orderBy(sql`${postSearch.searchText} <-> ${q}`)
       .limit(PUBLIC_SEARCH_LIMIT)
   }
diff --git a/tests/board-status.integration.test.ts b/tests/board-status.integration.test.ts
new file mode 100644
index 00000000..ad014824
--- /dev/null
+++ b/tests/board-status.integration.test.ts
@@ -0,0 +1,116 @@
+import assert from 'node:assert/strict'
+import { randomUUID } from 'node:crypto'
+import { createServer } from 'node:http'
+import { test } from 'node:test'
+import { Pool } from 'pg'
+
+const target = process.env.BOARD_TEST_URL
+
+test('public board status filters apply before pagination, counts and search limits', { skip: !target, timeout: 120_000 }, async (t) => {
+  const origin = new URL(target!).origin
+  const database = new URL(process.env.BOARD_TEST_DATABASE_URL ?? process.env.DATABASE_URL!)
+  assert.ok(['localhost', '127.0.0.1'].includes(new URL(origin).hostname))
+  assert.ok(['localhost', '127.0.0.1'].includes(database.hostname))
+  assert.match(database.pathname, /test|review/, 'Use an isolated test database')
+  const port = Number(process.env.BOARD_TEST_EMBEDDING_PORT)
+  assert.ok(Number.isSafeInteger(port) && port > 0, 'Configure the application to use this local embedding stub')
+  const pool = new Pool({ connectionString: database.href })
+  const orgId = process.env.BOARD_TEST_ORG_ID ?? 'default-org'
+  const prefix = `board-test-${randomUUID()}`
+  const authorId = prefix
+  const otherOrg = `${prefix}-other`
+  const boardId = randomUUID()
+  const emptyBoardId = randomUUID()
+  const feedbackIds: string[] = []
+  const vector = (x: number, y = 0) => [x, y, ...Array<number>(766).fill(0)]
+  let semantic = true
+  let embeddingRequests = 0
+  const embedding = createServer(async (request, response) => {
+    for await (const _chunk of request) { /* Drain the request before replying. */ }
+    embeddingRequests++
+    response.setHeader('content-type', 'application/json')
+    response.writeHead(semantic ? 200 : 503)
+    response.end(JSON.stringify(semantic ? { data: [{ embedding: vector(1) }] } : { error: 'Test fallback' }))
+  })
+  await new Promise<void>(resolve => embedding.listen(port, '127.0.0.1', resolve))
+  async function get(path: string) {
+    const response = await fetch(origin + path, { signal: AbortSignal.timeout(20_000) })
+    assert.equal(response.status, 200, await response.clone().text())
+    return response.json()
+  }
+  async function insert(status: string, title: string, options: { org?: string; board?: string; mergedTo?: string; embedding?: number[] } = {}) {
+    const id = randomUUID()
+    await pool.query('INSERT INTO post (id,org_id,title,slug,content,status,board_id,author_id,merged_to) VALUES ($1,$2,$3,$4,$5,$6,$7,$8,$9)',
+      [id, options.org ?? orgId, title, id, title, status, options.board ?? boardId, authorId, options.mergedTo ?? null])
+    feedbackIds.push(id)
+    await pool.query('INSERT INTO post_search (post_id,org_id,search_text) VALUES ($1,$2,$3)', [id, options.org ?? orgId, title])
+    if (options.embedding) await pool.query('INSERT INTO post_embedding (post_id,org_id,embedding,model,content_hash) VALUES ($1,$2,$3,$4,$5)',
+      [id, options.org ?? orgId, JSON.stringify(options.embedding), 'test', id])
+    return id
+  }
+  try {
+    await pool.query('INSERT INTO "user" (id,name,email) VALUES ($1,$1,$2)', [authorId, `${prefix}@example.invalid`])
+    await pool.query('INSERT INTO organization (id,name,slug) VALUES ($1,$1,$1)', [otherOrg])
+    for (const id of [boardId, emptyBoardId]) {
+      await pool.query('INSERT INTO board (id,org_id,name,position) VALUES ($1,$2,$3,1000)', [id, orgId, id === boardId ? prefix : `${prefix}-empty`])
+    }
+    const live: string[] = []
+    for (const status of ['open', 'planned', 'in_progress', 'done']) {
+      const id = await insert(status, `${prefix} ${status}`)
+      if (status !== 'done') live.push(id)
+    }
+    const needle = `${prefix} search regression`
+    for (let i = 0; i < 30; i++) await insert('done', needle, { embedding: vector(1) })
+    const wanted = await insert('open', `${needle} pending change`, { embedding: vector(0.8, 0.2) })
+    live.push(wanted)
+    const merged = await insert('open', needle, { mergedTo: wanted, embedding: vector(1) })
+    const foreign = await insert('open', needle, { org: otherOrg, embedding: vector(1) })
+
+    await t.test('list pagination and sidebar counts share status and merged-post rules', async () => {
+      const seen: string[] = []
+      let cursor: string | undefined
+      do {
+        const params = new URLSearchParams({ boardId, status: 'open,planned,in_progress', pageSize: '2' })
+        if (cursor) params.set('cursor', cursor)
+        const page = await get(`/api/posts?${params}`)
+        seen.push(...page.data.map((post: { id: string }) => post.id))
+        cursor = page.pagination.nextCursor
+      } while (cursor)
+      assert.deepEqual(seen.sort(), live.sort())
+      const overview = await get('/api/boards?status=open,planned,in_progress')
+      assert.equal(overview.data.find((board: { id: string }) => board.id === boardId).postCount, live.length)
+      assert.equal(overview.data.find((board: { id: string }) => board.id === emptyBoardId).postCount, 0)
+      const all = await get('/api/boards')
+      assert.equal(all.data.find((board: { id: string }) => board.id === boardId).postCount, 35)
+      const invalid = await get('/api/boards?status=invalid')
+      assert.equal(invalid.data.find((board: { id: string }) => board.id === boardId).postCount, 35)
+    })
+
+    for (const mode of ['semantic', 'trigram']) {
+      await t.test(`${mode} search filters before the top-30 limit and preserves tenant boundaries`, async () => {
+        semantic = mode === 'semantic'
+        const before = embeddingRequests
+        const query = new URLSearchParams({ q: needle, status: 'open,planned,in_progress' })
+        const result = await get(`/api/posts/search?${query}`)
+        assert.ok(result.data.some((post: { id: string }) => post.id === wanted))
+        assert.ok(result.data.every((post: { status: string }) => post.status !== 'done'))
+        assert.ok(result.data.every((post: { id: string }) => post.id !== merged && post.id !== foreign))
+        assert.ok(embeddingRequests > before, 'Exercise the configured embedding path before fallback')
+        for (const status of ['done', 'invalid', '']) {
+          const search = new URLSearchParams({ q: needle })
+          if (status) search.set('status', status)
+          const page = await get(`/api/posts/search?${search}`)
+          assert.equal(page.data.length, 30)
+          assert.ok(page.data.every((post: { status: string }) => post.status === 'done'))
+        }
+      })
+    }
+  } finally {
+    await pool.query('DELETE FROM post WHERE id=ANY($1::uuid[])', [feedbackIds])
+    await pool.query('DELETE FROM board WHERE id=ANY($1::uuid[])', [[boardId, emptyBoardId]])
+    await pool.query('DELETE FROM organization WHERE id=$1', [otherOrg])
+    await pool.query('DELETE FROM "user" WHERE id=$1', [authorId])
+    await pool.end()
+    await new Promise<void>((resolve, reject) => embedding.close(error => error ? reject(error) : resolve()))
+  }
+})