@allbluecn/web-app 0.18.2 → 0.19.0

package/src/components/testcase/table/table-view.tsx

@@ -1,152 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-// 表格视图（规格 A3，仿 story-list-table 裁剪）：TanStack Table v9 排序 +
-// 列钉住（identifier/title）+ @tanstack/react-virtual 行虚拟化 + 无限滚动哨兵。
-// 行点击为选中（与列表视图同一 selectedId 口径，任务 10 peek 消费），行内
-// story 链接 stopPropagation 不劫持选中。分组不适用于表格（与需求页表格同口径：
-// groupBy 仅作用于列表视图的 GroupedList）。
-import { useMemo, useRef, useState } from "react";
-import { flexRender, useTable, type SortingState } from "@tanstack/react-table";
-import { useVirtualizer } from "@tanstack/react-virtual";
-import { ArrowDown, ArrowUp, ChevronDown } from "lucide-react";
-import { InfiniteScrollSentinel } from "@/components/infinite-scroll-sentinel";
-import type { TestCaseSummary } from "@/server/serverFns/testcase/types";
-import { createTestCaseColumns, testCaseTableFeatures } from "./columns";
-import { cn } from "@/lib/utils";
-import { m } from "@/paraglide/messages.js";
-
-const ROW_HEIGHT = 44;
-
-interface TableViewProps {
-  cases: TestCaseSummary[];
-  hasMore: boolean;
-  selectedId: string | null;
-  onSelect: (id: string) => void;
-  /** 行点击（peek 滑出口径，可选；缺省回落 onSelect） */
-  onOpenCase?: (id: string) => void;
-  onLoadMore: () => void | Promise<void>;
-}
-
-export function TableView({ cases, hasMore, selectedId, onSelect, onOpenCase, onLoadMore }: TableViewProps) {
-  const [sorting, setSorting] = useState<SortingState>([]);
-  const columns = useMemo(() => createTestCaseColumns(), []);
-
-  const table = useTable({
-    features: testCaseTableFeatures,
-    data: cases,
-    columns,
-    state: { sorting },
-    onSortingChange: setSorting,
-    initialState: {
-      columnPinning: { start: ["identifier", "title"], end: [] },
-    },
-  });
-
-  const { rows } = table.getRowModel();
-  const parentRef = useRef<HTMLDivElement>(null);
-
-  const rowVirtualizer = useVirtualizer({
-    count: rows.length,
-    getScrollElement: () => parentRef.current,
-    estimateSize: () => ROW_HEIGHT,
-    overscan: 12,
-  });
-
-  const virtualRows = rowVirtualizer.getVirtualItems();
-  const totalHeight = rowVirtualizer.getTotalSize();
-  const paddingTop = virtualRows.length > 0 ? virtualRows[0].start : 0;
-  const paddingBottom = virtualRows.length > 0 ? totalHeight - virtualRows[virtualRows.length - 1].end : 0;
-
-  const headerGroups = table.getHeaderGroups();
-  const totalWidth = table.getTotalSize();
-
-  return (
-    <div ref={parentRef} className="h-full min-h-0 overflow-auto rounded-lg border bg-card">
-      <div style={{ width: totalWidth, minWidth: "100%" }}>
-        {/* 表头 */}
-        <div className="sticky top-0 z-10 flex h-9 items-center border-b bg-muted/50 backdrop-blur">
-          {headerGroups[0].headers.map((header) => {
-            const canSort = header.column.getCanSort();
-            const sortDir = header.column.getIsSorted();
-            return (
-              <div
-                key={header.id}
-                style={{ width: header.getSize() }}
-                className="flex h-full items-center gap-1 px-3 text-xs font-medium text-muted-foreground"
-              >
-                {flexRender(header.column.columnDef.header, header.getContext())}
-                {canSort && (
-                  <button
-                    type="button"
-                    onClick={header.column.getToggleSortingHandler()}
-                    className="text-muted-foreground/60 hover:text-foreground"
-                  >
-                    {sortDir === "asc" ? <ArrowUp className="size-3" />
-                      : sortDir === "desc" ? <ArrowDown className="size-3" />
-                      : <ChevronDown className="size-3" />}
-                  </button>
-                )}
-              </div>
-            );
-          })}
-        </div>
-
-        {/* 虚拟化行 */}
-        <div>
-          {paddingTop > 0 && <div style={{ height: paddingTop }} />}
-          {virtualRows.map((virtualRow) => {
-            const row = rows[virtualRow.index];
-            const selected = selectedId === row.original.id;
-            return (
-              <div
-                key={row.original.id}
-                data-testid="table-row"
-                data-case-id={row.original.id}
-                data-selected={selected ? "true" : "false"}
-                onClick={() => (onOpenCase ? onOpenCase(row.original.id) : onSelect(row.original.id))}
-                style={{ height: ROW_HEIGHT }}
-                className={cn(
-                  "flex w-full cursor-pointer items-center border-b border-border/40 text-sm transition-colors hover:bg-muted/40",
-                  selected && "bg-accent/60 hover:bg-accent/60",
-                )}
-              >
-                {row.getVisibleCells().map((cell) => (
-                  <div
-                    key={cell.id}
-                    style={{ width: cell.column.getSize() }}
-                    className="flex h-full items-center overflow-hidden px-3"
-                  >
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </div>
-                ))}
-              </div>
-            );
-          })}
-          {paddingBottom > 0 && <div style={{ height: paddingBottom }} />}
-          <InfiniteScrollSentinel loadedAllLabel={m.story_loadedAll()} onLoadMore={onLoadMore} hasMore={hasMore} rootRef={parentRef} />
-        </div>
-
-        {rows.length === 0 && (
-          <div className="flex h-40 items-center justify-center text-sm text-muted-foreground">
-            {m.testcase_listView_empty()}
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}

package/src/lib/tag-colors.ts

@@ -1,35 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-const TAG_COLORS = [
-  { bg: "bg-blue-100 dark:bg-blue-900/30", text: "text-blue-700 dark:text-blue-300", border: "border-blue-200 dark:border-blue-700", selected: "border-blue-500", check: "text-blue-700 dark:text-blue-300", label: "蓝色" },
-  { bg: "bg-emerald-100 dark:bg-emerald-900/30", text: "text-emerald-700 dark:text-emerald-300", border: "border-emerald-200 dark:border-emerald-700", selected: "border-emerald-500", check: "text-emerald-700 dark:text-emerald-300", label: "绿色" },
-  { bg: "bg-violet-100 dark:bg-violet-900/30", text: "text-violet-700 dark:text-violet-300", border: "border-violet-200 dark:border-violet-700", selected: "border-violet-500", check: "text-violet-700 dark:text-violet-300", label: "紫色" },
-  { bg: "bg-amber-100 dark:bg-amber-900/30", text: "text-amber-700 dark:text-amber-300", border: "border-amber-200 dark:border-amber-700", selected: "border-amber-500", check: "text-amber-700 dark:text-amber-300", label: "琥珀" },
-  { bg: "bg-rose-100 dark:bg-rose-900/30", text: "text-rose-700 dark:text-rose-300", border: "border-rose-200 dark:border-rose-700", selected: "border-rose-500", check: "text-rose-700 dark:text-rose-300", label: "玫红" },
-  { bg: "bg-cyan-100 dark:bg-cyan-900/30", text: "text-cyan-700 dark:text-cyan-300", border: "border-cyan-200 dark:border-cyan-700", selected: "border-cyan-500", check: "text-cyan-700 dark:text-cyan-300", label: "青色" },
-  { bg: "bg-orange-100 dark:bg-orange-900/30", text: "text-orange-700 dark:text-orange-300", border: "border-orange-200 dark:border-orange-700", selected: "border-orange-500", check: "text-orange-700 dark:text-orange-300", label: "橙色" },
-  { bg: "bg-pink-100 dark:bg-pink-900/30", text: "text-pink-700 dark:text-pink-300", border: "border-pink-200 dark:border-pink-700", selected: "border-pink-500", check: "text-pink-700 dark:text-pink-300", label: "粉色" },
-];
-
-function hashColorIndex(name: string) {
-  let hash = 0;
-  for (let i = 0; i < name.length; i++) hash = ((hash << 5) - hash) + name.charCodeAt(i);
-  return Math.abs(hash) % TAG_COLORS.length;
-}
-
-export { TAG_COLORS, hashColorIndex };

package/src/routes/_nav/tags/$id/route.lazy.tsx

@@ -1,23 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createLazyFileRoute } from '@tanstack/react-router'
-import { TagDetailPage } from '@/components/tags/pages/tag-detail-page'
-
-export const Route = createLazyFileRoute('/_nav/tags/$id')({
-  component: TagDetailPage,
-})

package/src/routes/_nav/tags/$id/route.tsx

@@ -1,20 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/_nav/tags/$id')({})

package/src/routes/_nav/tags/index.lazy.tsx

@@ -1,23 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createLazyFileRoute } from '@tanstack/react-router'
-import { TagsIndexPage } from '@/components/tags/pages/tags-index-page'
-
-export const Route = createLazyFileRoute('/_nav/tags/')({
-  component: TagsIndexPage,
-})

package/src/routes/_nav/tags/index.tsx

@@ -1,20 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/_nav/tags/')({})

package/src/routes/_nav/tags/settings/route.lazy.tsx

@@ -1,23 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createLazyFileRoute } from '@tanstack/react-router'
-import { TagSettingsPage } from '@/components/tags/pages/tag-settings-page'
-
-export const Route = createLazyFileRoute('/_nav/tags/settings')({
-  component: TagSettingsPage,
-})

package/src/routes/_nav/tags/settings/route.tsx

@@ -1,23 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createFileRoute } from '@tanstack/react-router'
-import { listTagsFn } from '@/server/serverFns/tags'
-
-export const Route = createFileRoute('/_nav/tags/settings')({
-  loader: () => listTagsFn(),
-})

package/src/server/serverFns/tags.ts

@@ -1,138 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import { createServerFn } from '@tanstack/react-start'
-import { getRequest } from '@tanstack/react-start/server'
-import { z } from 'zod'
-import { getPrisma } from '@allbluecn/database/get-prisma'
-import { getServerSeam } from '@allbluecn/kernel'
-import { hashColorIndex } from '@/lib/tag-colors'
-
-export const listTagsFn = createServerFn({ method: 'GET' })
-  .handler(async () => {
-    const prisma = await getPrisma()
-    const request = getRequest()
-    const session = await getServerSeam().requireAuth(request)
-    return prisma.tag.findMany({
-      where: { userId: session.user!.id!, isHidden: false },
-      orderBy: { sortOrder: 'asc' },
-    })
-  })
-
-const createTagSchema = z.object({ name: z.string().min(1).trim() })
-
-export const createTagFn = createServerFn({ method: 'POST' })
-  .validator(createTagSchema)
-  .handler(async ({ data }) => {
-    const prisma = await getPrisma()
-    const request = getRequest()
-    const session = await getServerSeam().requireAuth(request)
-    const userId = session.user!.id!
-
-    const existing = await prisma.tag.findFirst({ where: { name: data.name, userId } })
-    if (existing) return existing
-
-    return prisma.tag.create({
-      data: { name: data.name, color: hashColorIndex(data.name), userId },
-    })
-  })
-
-const updateTagSchema = z.object({
-  id: z.string(),
-  name: z.string().min(1).trim().optional(),
-  color: z.number().int().min(0).max(7).optional(),
-})
-
-export const updateTagFn = createServerFn({ method: 'POST' })
-  .validator(updateTagSchema)
-  .handler(async ({ data }) => {
-    const prisma = await getPrisma()
-    const request = getRequest()
-    const session = await getServerSeam().requireAuth(request)
-    const userId = session.user!.id!
-
-    const tag = await prisma.tag.findFirst({ where: { id: data.id, userId } })
-    if (!tag) throw new Error('FORBIDDEN')
-
-    if (data.name && data.name !== tag.name) {
-      const conflict = await prisma.tag.findFirst({
-        where: { name: data.name, userId },
-      })
-      if (conflict) {
-        throw new Error('TAG_NAME_CONFLICT')
-      }
-    }
-
-    return prisma.tag.update({
-      where: { id: data.id },
-      data: {
-        ...(data.name !== undefined ? { name: data.name } : {}),
-        ...(data.color !== undefined ? { color: data.color } : {}),
-      },
-    })
-  })
-
-const reorderTagsSchema = z.object({ orderedIds: z.array(z.string()).min(1) })
-
-export const reorderTagsFn = createServerFn({ method: 'POST' })
-  .validator(reorderTagsSchema)
-  .handler(async ({ data }) => {
-    const prisma = await getPrisma()
-    const request = getRequest()
-    const session = await getServerSeam().requireAuth(request)
-    const userId = session.user!.id!
-
-    // DB-01：原逐标签 findFirst 鉴权 + update（2N 次查询）。改一次 findMany in 鉴权 + 事务内
-    // 批量 updateMany（N 次写并行、原子提交，鉴权 where 保留 userId 防 TOCTOU）。
-    // 查询次数 before: 2N → after: 1 + N（事务内并行）
-    const owned = await prisma.tag.findMany({
-      where: { id: { in: data.orderedIds }, userId },
-      select: { id: true },
-    })
-    const ownedIds = new Set(owned.map((t) => t.id))
-
-    await prisma.$transaction(async (tx) => {
-      await Promise.all(
-        data.orderedIds.map((id, index) => {
-          // 未授权/不存在的 id 静默跳过（与原 findFirst 失败 return null 行为一致）
-          if (!ownedIds.has(id)) return Promise.resolve()
-          return tx.tag.updateMany({ where: { id, userId }, data: { sortOrder: index * 1000 } })
-        }),
-      )
-    })
-    return { success: true }
-  })
-
-const deleteTagSchema = z.object({ id: z.string() })
-
-export const deleteTagFn = createServerFn({ method: 'POST' })
-  .validator(deleteTagSchema)
-  .handler(async ({ data }) => {
-    const prisma = await getPrisma()
-    const request = getRequest()
-    const session = await getServerSeam().requireAuth(request)
-    const userId = session.user!.id!
-
-    const tag = await prisma.tag.findFirst({ where: { id: data.id, userId } })
-    if (!tag) throw new Error('FORBIDDEN')
-
-    await prisma.tag.update({
-      where: { id: data.id },
-      data: { isHidden: true },
-    })
-    return { success: true }
-  })