@allbluecn/web-app 0.18.2 → 0.19.0

package/src/components/tags/__tests__/tags.test.ts

@@ -1,388 +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 { describe, it, expect, vi, beforeEach } from 'vitest'
-
-const mocks = vi.hoisted(() => ({
-  findMany: vi.fn(),
-  findUnique: vi.fn(),
-  create: vi.fn(),
-  update: vi.fn(),
-  updateMany: vi.fn(),
-  findFirst: vi.fn(),
-  transaction: vi.fn(),
-  designFindFirst: vi.fn(),
-  designTagFindMany: vi.fn(),
-  designTagDeleteMany: vi.fn(),
-  designTagCreateMany: vi.fn(),
-  getCurrentSession: vi.fn(),
-  handlers: new Map<string, Function>(),
-}))
-
-vi.mock('@tanstack/react-start', () => ({
-  createServerFn: (config: any) => {
-    const builder: any = {
-      _method: config.method,
-      _validator: undefined as any,
-      handler(fn: Function) {
-        const key = `${config.method}:${fn.name || 'anon'}:${mocks.handlers.size}`
-        mocks.handlers.set(key, fn)
-        const fn2: any = (...args: any[]) => {
-          const validator = this._validator
-          let data = args[0]?.data
-          if (validator && data !== undefined) {
-            data = validator.parse ? validator.parse(data) : data
-          }
-          return fn({ data, request: args[0]?.request })
-        }
-        mocks.handlers.set(`call:${key}`, fn2)
-        return fn2
-      },
-      validator(schema: any) {
-        const self = this
-        return {
-          handler(fn: Function) {
-            self._validator = schema
-            return self.handler(fn)
-          },
-        }
-      },
-    }
-    return builder
-  },
-}))
-
-vi.mock('@allbluecn/database', () => ({
-  prisma: {
-    tag: {
-      findMany: mocks.findMany,
-      findUnique: mocks.findUnique,
-      create: mocks.create,
-      update: mocks.update,
-      updateMany: mocks.updateMany,
-      findFirst: mocks.findFirst,
-    },
-    design: {
-      findFirst: mocks.designFindFirst,
-    },
-    designTag: {
-      findMany: mocks.designTagFindMany,
-      deleteMany: mocks.designTagDeleteMany,
-      createMany: mocks.designTagCreateMany,
-    },
-    // 交互式事务：tx.designTag.* 透传到同一组 mock
-    $transaction: async (arg: any) =>
-      typeof arg === "function"
-        ? arg({
-            tag: { updateMany: mocks.updateMany },
-            designTag: {
-              deleteMany: mocks.designTagDeleteMany,
-              createMany: mocks.designTagCreateMany,
-            },
-          })
-        : Promise.all(arg),
-  },
-}))
-import { listTagsFn } from '@/server/serverFns/tags'
-
-vi.mock('@tanstack/react-start/server', () => ({
-  getRequest: () => ({}),
-}))
-
-vi.mock('@allbluecn/kernel', async (importOriginal) => {
-  const actual = await importOriginal<typeof import('@allbluecn/kernel')>()
-  const UnauthorizedError = class UnauthorizedError extends Error {
-    constructor(message: string = 'UNAUTHORIZED') {
-      super(message)
-      this.name = 'UnauthorizedError'
-      Object.setPrototypeOf(this, UnauthorizedError.prototype)
-    }
-  }
-  const ForbiddenError = class ForbiddenError extends Error {
-    constructor(message: string = 'FORBIDDEN') {
-      super(message)
-      this.name = 'ForbiddenError'
-      Object.setPrototypeOf(this, ForbiddenError.prototype)
-    }
-  }
-  return {
-    ...actual,
-    getServerSeam: () => ({
-      requireAuth: async () => {
-        const session = await mocks.getCurrentSession()
-        if (!session?.user?.id) {
-          throw new UnauthorizedError()
-        }
-        return session
-      },
-    }),
-  }
-})
-
-describe('listTagsFn', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('按 userId 过滤，仅返回当前用户的 tag', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findMany.mockResolvedValue([])
-
-    await listTagsFn()
-
-    expect(mocks.findMany).toHaveBeenCalledWith(
-      expect.objectContaining({
-        where: expect.objectContaining({ userId: 'user-1', isHidden: false }),
-      })
-    )
-  })
-
-  it('未登录时抛 UnauthorizedError', async () => {
-    mocks.getCurrentSession.mockResolvedValue(null)
-
-    await expect(listTagsFn()).rejects.toThrow(/UNAUTHORIZED/)
-  })
-})
-
-import { createTagFn } from '@/server/serverFns/tags'
-
-describe('createTagFn', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('非管理员也能创建（仅需登录）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1', role: 'USER' } })
-    mocks.findUnique.mockResolvedValue(null)
-    mocks.create.mockResolvedValue({ id: 't1', name: 'AI', color: 3, sortOrder: 0, isHidden: false, userId: 'user-1' })
-
-    const result = await createTagFn({ data: { name: 'AI' } })
-
-    expect(result).toMatchObject({ name: 'AI', userId: 'user-1' })
-    expect(mocks.create).toHaveBeenCalledWith(
-      expect.objectContaining({
-        data: expect.objectContaining({ name: 'AI', userId: 'user-1' }),
-      })
-    )
-  })
-
-  it('同名 tag 已存在（属于自己）则返回已有', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1', role: 'USER' } })
-    const existing = { id: 't1', name: 'AI', color: 0, sortOrder: 0, isHidden: false, userId: 'user-1' }
-    mocks.findFirst.mockResolvedValue(existing)
-
-    const result = await createTagFn({ data: { name: 'AI' } })
-
-    expect(result).toBe(existing)
-    expect(mocks.create).not.toHaveBeenCalled()
-  })
-
-  it('缺省 color 时用 hashColorIndex（数字）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1', role: 'USER' } })
-    mocks.findFirst.mockResolvedValue(null)
-    mocks.create.mockResolvedValue({})
-
-    await createTagFn({ data: { name: 'Backend' } })
-
-    expect(mocks.create).toHaveBeenCalledWith(
-      expect.objectContaining({
-        data: expect.objectContaining({ color: expect.any(Number) }),
-      })
-    )
-  })
-
-  it('未登录时抛 UnauthorizedError', async () => {
-    mocks.getCurrentSession.mockResolvedValue(null)
-
-    await expect(createTagFn({ data: { name: 'AI' } })).rejects.toThrow(/UNAUTHORIZED/)
-  })
-})
-
-import { updateTagFn } from '@/server/serverFns/tags'
-
-describe('updateTagFn', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('仅 userId 匹配的 tag 可改（findFirst 校验）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findFirst
-      .mockResolvedValueOnce({ id: 't1', name: 'AI', userId: 'user-1' })
-      .mockResolvedValueOnce(null)
-    mocks.update.mockResolvedValue({})
-
-    await updateTagFn({ data: { id: 't1', name: 'AI-New' } })
-
-    expect(mocks.findFirst).toHaveBeenNthCalledWith(1, { where: { id: 't1', userId: 'user-1' } })
-    expect(mocks.update).toHaveBeenCalledWith(
-      expect.objectContaining({
-        where: { id: 't1' },
-        data: expect.objectContaining({ name: 'AI-New' }),
-      })
-    )
-  })
-
-  it('userId 不匹配抛 FORBIDDEN（不调用 update）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findFirst.mockResolvedValue(null)
-
-    await expect(updateTagFn({ data: { id: 't-other', name: 'X' } })).rejects.toThrow(/FORBIDDEN/)
-    expect(mocks.update).not.toHaveBeenCalled()
-  })
-
-  it('改名与自己其他 tag 冲突时抛 TAG_NAME_CONFLICT', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findFirst
-      .mockResolvedValueOnce({ id: 't1', name: 'AI', userId: 'user-1' })
-      .mockResolvedValueOnce({ id: 't2', name: 'AI-New', userId: 'user-1' })
-
-    await expect(updateTagFn({ data: { id: 't1', name: 'AI-New' } })).rejects.toThrow(/TAG_NAME_CONFLICT/)
-  })
-
-  it('未登录时抛 UnauthorizedError', async () => {
-    mocks.getCurrentSession.mockResolvedValue(null)
-
-    await expect(updateTagFn({ data: { id: 't1', name: 'X' } })).rejects.toThrow(/UNAUTHORIZED/)
-  })
-})
-
-import { deleteTagFn } from '@/server/serverFns/tags'
-
-describe('deleteTagFn', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('仅删自己的 tag（userId 不匹配抛 FORBIDDEN）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findFirst.mockResolvedValue(null)
-
-    await expect(deleteTagFn({ data: { id: 't-other' } })).rejects.toThrow(/FORBIDDEN/)
-    expect(mocks.update).not.toHaveBeenCalled()
-  })
-
-  it('软删：isHidden=true', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findFirst.mockResolvedValue({ id: 't1' })
-
-    await deleteTagFn({ data: { id: 't1' } })
-
-    expect(mocks.update).toHaveBeenCalledWith(
-      expect.objectContaining({
-        where: { id: 't1' },
-        data: expect.objectContaining({ isHidden: true }),
-      })
-    )
-  })
-
-  it('未登录时抛 UnauthorizedError', async () => {
-    mocks.getCurrentSession.mockResolvedValue(null)
-
-    await expect(deleteTagFn({ data: { id: 't1' } })).rejects.toThrow(/UNAUTHORIZED/)
-  })
-})
-
-import { reorderTagsFn } from '@/server/serverFns/tags'
-import { assignTagsToDesignFn } from '@/server/serverFns/design/designs'
-
-describe('reorderTagsFn', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('按传入顺序重写 sortOrder（步进 1000，DB-01：一次 findMany 鉴权 + 事务内批量 updateMany）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findMany.mockResolvedValue([{ id: 't1' }, { id: 't2' }, { id: 't3' }])
-    mocks.updateMany.mockResolvedValue({ count: 1 })
-
-    await reorderTagsFn({ data: { orderedIds: ['t1', 't2', 't3'] } })
-
-    // 鉴权一次 in 查询（原逐 id findFirst N 次）
-    expect(mocks.findMany).toHaveBeenCalledWith({
-      where: { id: { in: ['t1', 't2', 't3'] }, userId: 'user-1' },
-      select: { id: true },
-    })
-    expect(mocks.updateMany).toHaveBeenCalledTimes(3)
-    expect(mocks.updateMany).toHaveBeenCalledWith(
-      expect.objectContaining({ where: { id: 't1', userId: 'user-1' }, data: { sortOrder: 0 } })
-    )
-    expect(mocks.updateMany).toHaveBeenCalledWith(
-      expect.objectContaining({ where: { id: 't2', userId: 'user-1' }, data: { sortOrder: 1000 } })
-    )
-    expect(mocks.updateMany).toHaveBeenCalledWith(
-      expect.objectContaining({ where: { id: 't3', userId: 'user-1' }, data: { sortOrder: 2000 } })
-    )
-    expect(mocks.update).not.toHaveBeenCalled()
-  })
-
-  it('越权 tag 静默跳过（不抛错）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.findMany.mockResolvedValue([{ id: 't1' }])
-    mocks.updateMany.mockResolvedValue({ count: 1 })
-
-    await reorderTagsFn({ data: { orderedIds: ['t1', 't-other'] } })
-
-    expect(mocks.updateMany).toHaveBeenCalledTimes(1)
-    expect(mocks.updateMany).toHaveBeenCalledWith(
-      expect.objectContaining({ where: { id: 't1', userId: 'user-1' } })
-    )
-  })
-
-  it('未登录时抛 UnauthorizedError', async () => {
-    mocks.getCurrentSession.mockResolvedValue(null)
-
-    await expect(reorderTagsFn({ data: { orderedIds: ['t1'] } })).rejects.toThrow(/UNAUTHORIZED/)
-  })
-})
-
-describe('assignTagsToPrdFn', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('越权（PRD 不属于自己）抛 FORBIDDEN', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.designFindFirst.mockResolvedValue(null)
-
-    await expect(assignTagsToDesignFn({ data: { designId: 'p1', tagIds: ['t1'] } })).rejects.toThrow(/FORBIDDEN/)
-  })
-
-  it('校验 tagId 不属于自己时抛 FORBIDDEN（DB-01：一次 findMany in 鉴权）', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.designFindFirst.mockResolvedValue({ id: 'p1' })
-    mocks.findMany.mockResolvedValue([])
-
-    await expect(assignTagsToDesignFn({ data: { designId: 'p1', tagIds: ['t-other'] } })).rejects.toThrow(/FORBIDDEN/)
-    expect(mocks.findMany).toHaveBeenCalledWith({
-      where: { id: { in: ['t-other'] }, userId: 'user-1' },
-      select: { id: true },
-    })
-  })
-
-  it('事务内 diff 增删', async () => {
-    mocks.getCurrentSession.mockResolvedValue({ user: { id: 'user-1' } })
-    mocks.designFindFirst.mockResolvedValue({ id: 'p1' })
-    mocks.findMany.mockResolvedValue([{ id: 't1' }, { id: 't3' }])
-    mocks.designTagFindMany.mockResolvedValue([{ tagId: 't1' }, { tagId: 't2' }])
-
-    await assignTagsToDesignFn({ data: { designId: 'p1', tagIds: ['t1', 't3'] } })
-
-    expect(mocks.designTagDeleteMany).toHaveBeenCalledWith({ where: { designId: 'p1', tagId: { in: ['t2'] } } })
-    expect(mocks.designTagCreateMany).toHaveBeenCalledWith({ data: [{ designId: 'p1', tagId: 't3' }] })
-  })
-})

package/src/components/tags/nav-tag.tsx

@@ -1,121 +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 { useState } from 'react'
-import { Link, useLocation } from '@tanstack/react-router'
-import { Tag as TagIcon, Tags, BadgePlus, LibraryBig } from 'lucide-react'
-import { SidebarGroup, SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar } from '@/components/ui/sidebar'
-import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
-import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'
-import { Input } from '@/components/ui/input'
-import { Button } from '@/components/ui/button'
-import { cn } from '@/lib/utils'
-import { isPathActive } from '@/lib/sidebar-utils'
-import { createTagFn } from "@/server/serverFns/tags"
-import { toast } from '@/components/ui/toast'
-import { m } from "@/paraglide/messages.js";
-
-export function NavTag() {
-  const { state } = useSidebar()
-  const { pathname } = useLocation()
-  const isCollapsed = state === 'collapsed'
-  const active = isPathActive(pathname, '/tags')
-
-  const [createOpen, setCreateOpen] = useState(false)
-  const [newName, setNewName] = useState('')
-  const [creating, setCreating] = useState(false)
-
-  async function handleCreate() {
-    const name = newName.trim()
-    if (!name) return
-    setCreating(true)
-    try {
-      await createTagFn({ data: { name } })
-      toast.success(m.tags_created())
-      setNewName('')
-      setCreateOpen(false)
-    } catch (e) {
-      const msg = e instanceof Error ? e.message : ''
-      toast.error(msg === 'TAG_NAME_CONFLICT' ? m.tags_nameConflict() : m.tags_saveFailed())
-    } finally {
-      setCreating(false)
-    }
-  }
-
-  return (
-    <SidebarGroup className="p-0">
-      {!isCollapsed && (
-        <div className="flex h-8 items-center justify-between px-2 mb-1">
-          <span className="text-xs font-medium text-sidebar-foreground/70">{m.tags_title()}</span>
-          <div className="flex items-center gap-0.5">
-            <Tooltip>
-              <TooltipTrigger render={<button type="button"
-                  onClick={() => setCreateOpen(true)}
-                  aria-label={m.tags_createTag()}
-                  className="flex size-5 items-center justify-center rounded-md mr-1 p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2" />}>
-                  <BadgePlus className="size-4" />
-                </TooltipTrigger>
-              <TooltipContent side="top"><p>{m.tags_createTag()}</p></TooltipContent>
-            </Tooltip>
-            <Tooltip>
-              <TooltipTrigger render={<Link to="/tags/settings"
-                  aria-label={m.tags_settings_title()}
-                  className="flex size-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2" />}>
-                  <Tags className="size-4" />
-                </TooltipTrigger>
-              <TooltipContent side="right"><p>{m.tags_settings_title()}</p></TooltipContent>
-            </Tooltip>
-          </div>
-        </div>
-      )}
-
-      <SidebarMenu>
-        <SidebarMenuItem>
-          <SidebarMenuButton render={<Link to="/tags" className="flex w-full items-center" />} tooltip={m.tags_title()} isActive={active} className={cn('flex w-full items-center rounded-lg px-2', isCollapsed && 'justify-center')}>
-              <TagIcon className="size-4" />
-              {!isCollapsed && <span className="ml-2 text-sm font-medium">{m.tags_title()}</span>}
-            </SidebarMenuButton>
-        </SidebarMenuItem>
-      </SidebarMenu>
-
-      <Dialog open={createOpen} onOpenChange={setCreateOpen}>
-        <DialogContent className="sm:max-w-sm">
-          <DialogHeader>
-            <DialogTitle>{m.tags_createTag()}</DialogTitle>
-          </DialogHeader>
-          <div className="space-y-3 pt-2">
-            <Input
-              autoFocus
-              placeholder={m.tags_nameLabel()}
-              value={newName}
-              onChange={(e) => setNewName(e.target.value)}
-              onKeyDown={(e) => { if (e.key === 'Enter') handleCreate() }}
-              maxLength={30}
-            />
-          </div>
-          <DialogFooter>
-            <Button variant="outline" onClick={() => setCreateOpen(false)}>{m.tags_cancel()}</Button>
-            <Button onClick={handleCreate} disabled={creating || !newName.trim()}>
-              <LibraryBig className="size-4 mr-1" />
-              {creating ? m.tags_saving() : m.tags_save()}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </SidebarGroup>
-  )
-}

package/src/components/tags/pages/tag-settings-page.tsx

@@ -1,32 +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 { TagManager } from "../tag-manager"
-import { m } from "@/paraglide/messages.js";
-
-export function TagSettingsPage() {
-  return (
-    <div className="container max-w-3xl py-6">
-      <div className="mb-6">
-        <h1 className="text-2xl font-semibold">{m.tags_settings_title()}</h1>
-        <p className="text-sm text-muted-foreground mt-1">
-          {m.tags_settings_description()}
-        </p>
-      </div>
-      <TagManager />
-    </div>
-  )
-}

package/src/components/tags/pages/tags-index-page.tsx

@@ -1,32 +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 { TagManager } from '../tag-manager'
-import { m } from "@/paraglide/messages.js";
-
-export function TagsIndexPage() {
-  return (
-    <div className="container max-w-3xl py-6">
-      <div className="mb-6">
-        <h1 className="text-2xl font-semibold">{m.tags_title()}</h1>
-        <p className="text-sm text-muted-foreground mt-1">
-          {m.tags_settings_description()}
-        </p>
-      </div>
-      <TagManager />
-    </div>
-  )
-}

package/src/components/tags/tag-badge.tsx

@@ -1,56 +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 * as React from 'react'
-import { cn } from '@/lib/utils'
-import { Badge } from '@/components/ui/badge'
-import { Tag, X } from 'lucide-react'
-import { TAG_COLOR_CLASSES, type TagColorIndex } from "./tag-color-classes"
-import { m } from "@/paraglide/messages.js";
-
-type TagBadgeProps = {
-  tag: { name: string; color: number }
-  onRemove?: () => void
-  onClick?: () => void
-  className?: string
-  icon?: boolean
-}
-
-export function TagBadge({ tag, onRemove, onClick, className, icon }: TagBadgeProps) {
-  const safeColor = (tag.color >= 0 && tag.color <= 7 ? tag.color : 0) as TagColorIndex
-  const c = TAG_COLOR_CLASSES[safeColor]
-
-  return (
-    <Badge
-      onClick={onClick}
-      className={cn(c.bg, c.text, c.border, 'border', onClick && 'cursor-pointer', className)}
-    >
-      {icon && <Tag className="size-3 mr-0.5" />}
-      {tag.name}
-      {onRemove && (
-        <button
-          type="button"
-          aria-label={m.tags_removeTag({ name: tag.name })}
-          onClick={(e) => { e.stopPropagation(); onRemove() }}
-          className="ml-1 inline-flex items-center justify-center rounded-full hover:bg-black/10 dark:hover:bg-white/10"
-        >
-          <X className="size-3" />
-        </button>
-      )}
-    </Badge>
-  )
-}