webhooks-table.md

基本信息

• 类型: React 组件
• 路径: ./src/components/admin/webhooks-table.tsx

功能描述

管理员 Webhook 管理表格组件，用于配置和管理外部系统集成。支持：

• 创建/编辑/删除 Webhook
• 配置 Webhook 事件（提示词创建/更新/删除）
• 设置请求方法、URL、请求头和 payload
• Slack 预设模板
• 测试 Webhook
• 启用/禁用切换

导出内容

• WebhooksTable - 主组件函数
• WebhookConfig - Webhook 配置类型接口
• HeadersEditor - 请求头编辑器子组件

Props

属性	类型	说明
webhooks	WebhookConfig[]	Webhook 配置数组

类型定义

interface WebhookConfig {
  id: string;
  name: string;
  url: string;
  method: string;
  headers: JsonValue;
  payload: string;
  events: string[];
  isEnabled: boolean;
  createdAt: Date;
}

interface HeaderEntry {
  key: string;
  value: string;
}

事件类型

• PROMPT_CREATED - 提示词创建
• PROMPT_UPDATED - 提示词更新
• PROMPT_DELETED - 提示词删除

依赖

• react - useState
• next/navigation - useRouter
• next-intl - useTranslations
• @/components/ui/* - Button, Input, Label, Switch, Badge, Select, Dialog, Table, DropdownMenu
• @/components/ui/code-editor - CodeEditor
• @/lib/webhook - SLACKPRESETPAYLOAD, WEBHOOK_PLACEHOLDERS
• lucide-react - Plus, MoreHorizontal, Pencil, Trash2, Slack, X, Play
• @prisma/client/runtime/library - JsonValue