@nexttylabs/echo 0.2.0

package/components/dashboard/recent-feedback-list.tsx

@@ -0,0 +1,152 @@
+"use client";
+
+
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 Link from "next/link";
+import { useTranslations } from "next-intl";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { ArrowRight, Inbox } from "lucide-react";
+
+interface FeedbackItem {
+  feedbackId: number;
+  title: string;
+  type: string;
+  status: string;
+  priority: string;
+  createdAt: Date;
+}
+
+interface RecentFeedbackListProps {
+  feedback: FeedbackItem[];
+}
+
+const statusColors: Record<string, string> = {
+  new: "bg-blue-100 text-blue-800",
+  in_progress: "bg-yellow-100 text-yellow-800",
+  resolved: "bg-green-100 text-green-800",
+  closed: "bg-gray-100 text-gray-800",
+};
+
+const priorityColors: Record<string, string> = {
+  low: "bg-slate-100 text-slate-800",
+  medium: "bg-orange-100 text-orange-800",
+  high: "bg-red-100 text-red-800",
+  critical: "bg-red-200 text-red-900",
+};
+
+export function RecentFeedbackList({ feedback }: RecentFeedbackListProps) {
+  const t = useTranslations("dashboard.recentFeedback");
+  const tFeedback = useTranslations("feedback");
+  const tCommon = useTranslations("common");
+
+  const getStatusLabel = (status: string) => {
+    const key = status === "in_progress" ? "inProgress" : status;
+    return tFeedback(`status.${key}`) || status;
+  };
+
+  const getTypeLabel = (type: string) => {
+    return tFeedback(`type.${type}`) || type;
+  };
+
+  const getPriorityLabel = (priority: string) => {
+    return tFeedback(`priority.${priority}`) || priority;
+  };
+
+  const formatDate = (date: Date): string => {
+    const d = new Date(date);
+    const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+    const month = months[d.getMonth()];
+    const day = d.getDate();
+    const hours = d.getHours();
+    const minutes = d.getMinutes().toString().padStart(2, "0");
+    const ampm = hours >= 12 ? "PM" : "AM";
+    const hour12 = hours % 12 || 12;
+    return `${month} ${day}, ${hour12}:${minutes} ${ampm}`;
+  };
+
+  if (feedback.length === 0) {
+    return (
+      <Card>
+        <CardHeader>
+          <CardTitle>{t("title")}</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <div className="flex flex-col items-center justify-center py-8 text-center">
+            <Inbox className="h-12 w-12 text-muted-foreground mb-4" />
+            <p className="text-muted-foreground mb-4">{t("noData")}</p>
+            <Button asChild>
+              <Link href="/admin/feedback/new">{tCommon("submitFirst")}</Link>
+            </Button>
+          </div>
+        </CardContent>
+      </Card>
+    );
+  }
+
+  return (
+    <Card>
+      <CardHeader className="flex flex-row items-center justify-between">
+        <CardTitle>{t("title")}</CardTitle>
+        <Button variant="ghost" size="sm" asChild>
+          <Link href="/admin/feedback">
+            {tCommon("viewAll")} <ArrowRight className="ml-1 h-4 w-4" />
+          </Link>
+        </Button>
+      </CardHeader>
+      <CardContent>
+        <div className="space-y-4">
+          {feedback.map((item) => (
+            <Link
+              key={item.feedbackId}
+              href={`/admin/feedback/${item.feedbackId}`}
+              className="block"
+            >
+              <div className="flex items-center justify-between rounded-lg border p-3 hover:bg-muted/50 transition-colors">
+                <div className="space-y-1 flex-1 min-w-0">
+                  <p className="font-medium truncate">{item.title}</p>
+                  <div className="flex items-center gap-2 text-sm text-muted-foreground">
+                    <span>{getTypeLabel(item.type)}</span>
+                    <span>·</span>
+                    <span>{formatDate(item.createdAt)}</span>
+                  </div>
+                </div>
+                <div className="flex items-center gap-2 ml-4">
+                  <Badge
+                    variant="secondary"
+                    className={priorityColors[item.priority] || ""}
+                  >
+                    {getPriorityLabel(item.priority)}
+                  </Badge>
+                  <Badge
+                    variant="secondary"
+                    className={statusColors[item.status] || ""}
+                  >
+                    {getStatusLabel(item.status)}
+                  </Badge>
+                </div>
+              </div>
+            </Link>
+          ))}
+        </div>
+      </CardContent>
+    </Card>
+  );
+}

package/components/dashboard/stats-cards.tsx

@@ -0,0 +1,88 @@
+"use client";
+
+
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 { useTranslations } from "next-intl";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { MessageSquare, Clock, TrendingUp, CheckCircle } from "lucide-react";
+
+interface StatsCardsProps {
+  totalFeedback: number;
+  pendingFeedback: number;
+  weeklyFeedback: number;
+  resolvedFeedback: number;
+}
+
+export function StatsCards({
+  totalFeedback,
+  pendingFeedback,
+  weeklyFeedback,
+  resolvedFeedback,
+}: StatsCardsProps) {
+  const t = useTranslations("dashboard.stats");
+
+  const stats = [
+    {
+      title: t("totalFeedback"),
+      value: totalFeedback,
+      icon: MessageSquare,
+      color: "text-blue-600",
+      bgColor: "bg-blue-100",
+    },
+    {
+      title: t("pending"),
+      value: pendingFeedback,
+      icon: Clock,
+      color: "text-orange-600",
+      bgColor: "bg-orange-100",
+    },
+    {
+      title: t("weeklyNew"),
+      value: weeklyFeedback,
+      icon: TrendingUp,
+      color: "text-green-600",
+      bgColor: "bg-green-100",
+    },
+    {
+      title: t("resolved"),
+      value: resolvedFeedback,
+      icon: CheckCircle,
+      color: "text-purple-600",
+      bgColor: "bg-purple-100",
+    },
+  ];
+
+  return (
+    <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+      {stats.map((stat) => (
+        <Card key={stat.title}>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">{stat.title}</CardTitle>
+            <div className={`rounded-full p-2 ${stat.bgColor}`}>
+              <stat.icon className={`h-4 w-4 ${stat.color}`} />
+            </div>
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{stat.value}</div>
+          </CardContent>
+        </Card>
+      ))}
+    </div>
+  );
+}

package/components/dashboard/status-chart.tsx

@@ -0,0 +1,106 @@
+"use client";
+
+
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 { useTranslations } from "next-intl";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { PieChart, Pie, Cell, ResponsiveContainer, Legend, Tooltip } from "recharts";
+
+interface StatusChartProps {
+  data: { status: string; count: number }[];
+}
+
+const STATUS_COLORS: Record<string, string> = {
+  new: "#3b82f6",
+  "in-progress": "#f59e0b",
+  resolved: "#22c55e",
+  closed: "#6b7280",
+};
+
+export function StatusChart({ data }: StatusChartProps) {
+  const t = useTranslations("dashboard.statusChart");
+  const tFeedback = useTranslations("feedback");
+
+  const normalizeStatus = (status: string) =>
+    status === "in_progress" ? "in-progress" : status;
+
+  const getStatusLabel = (status: string) => {
+    const normalizedStatus = normalizeStatus(status);
+    const key = normalizedStatus === "in-progress" ? "inProgress" : normalizedStatus;
+    return tFeedback(`status.${key}`) || status;
+  };
+
+  const chartData = data.map((item) => ({
+    name: getStatusLabel(item.status),
+    value: item.count,
+    color: STATUS_COLORS[normalizeStatus(item.status)] || "#94a3b8",
+  }));
+
+  const total = chartData.reduce((sum, item) => sum + item.value, 0);
+
+  if (total === 0) {
+    return (
+      <Card>
+        <CardHeader>
+          <CardTitle>{t("title")}</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <div className="flex items-center justify-center h-[200px] text-muted-foreground">
+            {t("noData")}
+          </div>
+        </CardContent>
+      </Card>
+    );
+  }
+
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle>{t("title")}</CardTitle>
+      </CardHeader>
+      <CardContent>
+        <div className="h-[250px]">
+          <ResponsiveContainer width="100%" height="100%">
+            <PieChart>
+              <Pie
+                data={chartData}
+                cx="50%"
+                cy="50%"
+                innerRadius={50}
+                outerRadius={80}
+                paddingAngle={2}
+                dataKey="value"
+              >
+                {chartData.map((entry, index) => (
+                  <Cell key={`cell-${index}`} fill={entry.color} />
+                ))}
+              </Pie>
+              <Tooltip
+                formatter={(value: number | undefined) => [`${value}`, tFeedback("filters.title")]}
+              />
+              <Legend
+                formatter={(value) => <span className="text-sm">{value}</span>}
+              />
+            </PieChart>
+          </ResponsiveContainer>
+        </div>
+      </CardContent>
+    </Card>
+  );
+}

package/components/example.tsx

@@ -0,0 +1,70 @@
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 { cn } from "@/lib/utils"
+
+function ExampleWrapper({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div className="bg-background w-full">
+      <div
+        data-slot="example-wrapper"
+        className={cn(
+          "mx-auto grid min-h-screen w-full max-w-5xl min-w-0 content-center items-start gap-8 p-4 pt-2 sm:gap-12 sm:p-6 md:grid-cols-2 md:gap-8 lg:p-12 2xl:max-w-6xl",
+          className
+        )}
+        {...props}
+      />
+    </div>
+  )
+}
+
+function Example({
+  title,
+  children,
+  className,
+  containerClassName,
+  ...props
+}: React.ComponentProps<"div"> & {
+  title: string
+  containerClassName?: string
+}) {
+  return (
+    <div
+      data-slot="example"
+      className={cn(
+        "mx-auto flex w-full max-w-lg min-w-0 flex-col gap-1 self-stretch lg:max-w-none",
+        containerClassName
+      )}
+      {...props}
+    >
+      <div className="text-muted-foreground px-1.5 py-2 text-xs font-medium">
+        {title}
+      </div>
+      <div
+        data-slot="example-content"
+        className={cn(
+          "bg-background text-foreground flex min-w-0 flex-1 flex-col items-start gap-6 border border-dashed p-4 sm:p-6 *:[div:not([class*='w-'])]:w-full",
+          className
+        )}
+      >
+        {children}
+      </div>
+    </div>
+  )
+}
+
+export { ExampleWrapper, Example }

package/components/feedback/attachment-list.tsx

@@ -0,0 +1,103 @@
+"use client";
+
+
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 { Button } from "@/components/ui/button";
+import { Card } from "@/components/ui/card";
+import { File, Download, Image as ImageIcon, FileText, FileSpreadsheet } from "lucide-react";
+import { formatFileSize } from "@/lib/utils/format";
+
+interface Attachment {
+  attachmentId: number;
+  fileName: string;
+  filePath: string;
+  fileSize: number;
+  mimeType: string;
+  createdAt: string;
+}
+
+interface AttachmentListProps {
+  attachments: Attachment[];
+  className?: string;
+}
+
+export function AttachmentList({ attachments, className }: AttachmentListProps) {
+  if (attachments.length === 0) {
+    return (
+      <div className="text-center text-muted-foreground py-4">
+        暂无附件
+      </div>
+    );
+  }
+
+  const getFileIcon = (mimeType: string) => {
+    if (mimeType.startsWith("image/")) {
+      return <ImageIcon className="w-5 h-5 text-blue-500" />;
+    }
+    if (mimeType.includes("pdf")) {
+      return <FileText className="w-5 h-5 text-red-500" />;
+    }
+    if (mimeType.includes("word")) {
+      return <FileText className="w-5 h-5 text-blue-600" />;
+    }
+    if (mimeType.includes("excel") || mimeType.includes("spreadsheet")) {
+      return <FileSpreadsheet className="w-5 h-5 text-green-600" />;
+    }
+    return <File className="w-5 h-5 text-gray-500" />;
+  };
+
+  return (
+    <div className={className}>
+      <div className="space-y-2">
+        {attachments.map((attachment) => (
+          <Card key={attachment.attachmentId} className="p-3">
+            <div className="flex items-center justify-between">
+              <div className="flex items-center gap-3 flex-1 min-w-0">
+                <span className="shrink-0">
+                  {getFileIcon(attachment.mimeType)}
+                </span>
+                <div className="flex-1 min-w-0">
+                  <p className="font-medium truncate">{attachment.fileName}</p>
+                  <p className="text-sm text-muted-foreground">
+                    {formatFileSize(attachment.fileSize)}
+                  </p>
+                </div>
+              </div>
+
+              <Button
+                variant="outline"
+                size="sm"
+                asChild
+              >
+                <a
+                  href={`/${attachment.filePath}`}
+                  download={attachment.fileName}
+                  className="flex items-center gap-2"
+                >
+                  <Download className="w-4 h-4" />
+                  下载
+                </a>
+              </Button>
+            </div>
+          </Card>
+        ))}
+      </div>
+    </div>
+  );
+}

package/components/feedback/auto-classification-badge.tsx

@@ -0,0 +1,92 @@
+"use client";
+
+
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 { Badge } from "@/components/ui/badge";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
+import { Bot } from "lucide-react";
+import { useTranslations } from "next-intl";
+
+interface AutoClassificationBadgeProps {
+  classification?: {
+    type: string;
+    priority: string;
+    confidence: number;
+    reasons: string[];
+  };
+}
+
+export function AutoClassificationBadge({
+  classification,
+}: AutoClassificationBadgeProps) {
+  const t = useTranslations("portal.ai");
+  if (!classification) return null;
+
+  const confidenceColor =
+    classification.confidence > 0.7
+      ? "text-green-600"
+      : classification.confidence > 0.4
+        ? "text-yellow-600"
+        : "text-gray-600";
+
+  return (
+    <TooltipProvider>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Badge variant="outline" className="cursor-help gap-1">
+            <Bot className="h-3 w-3" />
+            Auto-classified
+            <span className={confidenceColor}>
+              ({Math.round(classification.confidence * 100)}%)
+            </span>
+          </Badge>
+        </TooltipTrigger>
+        <TooltipContent side="bottom" className="max-w-xs">
+          <div className="space-y-2">
+            <p className="font-medium">{t("classification")}</p>
+            <div className="space-y-1 text-sm">
+              <p>
+                Type: <span className="capitalize">{classification.type}</span>
+              </p>
+              <p>
+                Priority:{" "}
+                <span className="capitalize">{classification.priority}</span>
+              </p>
+              {classification.reasons.length > 0 && (
+                <div className="border-t pt-2">
+                  <p className="text-muted-foreground mb-1 text-xs">{t("reasons")}</p>
+                  <ul className="space-y-1 text-xs">
+                    {classification.reasons.map((reason, i) => (
+                      <li key={i}>• {reason}</li>
+                    ))}
+                  </ul>
+                </div>
+              )}
+            </div>
+          </div>
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+}

package/components/feedback/classification-override.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+
+/*
+ * Copyright (c) 2026 Echo Team
+ *
+ * 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 { Button } from "@/components/ui/button";
+import { RefreshCw } from "lucide-react";
+
+interface ClassificationOverrideProps {
+  feedbackId: number;
+  onUpdated: () => void;
+}
+
+export function ClassificationOverride({
+  feedbackId,
+  onUpdated,
+}: ClassificationOverrideProps) {
+  const [isReclassifying, setIsReclassifying] = useState(false);
+
+  async function reclassify() {
+    setIsReclassifying(true);
+    try {
+      const response = await fetch(`/api/feedback/${feedbackId}/reclassify`, {
+        method: "POST",
+      });
+
+      if (response.ok) {
+        onUpdated();
+      }
+    } finally {
+      setIsReclassifying(false);
+    }
+  }
+
+  return (
+    <Button
+      variant="ghost"
+      size="sm"
+      onClick={reclassify}
+      disabled={isReclassifying}
+    >
+      <RefreshCw
+        className={`mr-2 h-4 w-4 ${isReclassifying ? "animate-spin" : ""}`}
+      />
+      Re-run Classification
+    </Button>
+  );
+}