@allbluecn/web-app 0.4.22 → 0.5.1

package/src/components/story/relations/knowledge-panel.tsx

@@ -1,284 +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 { Plus, FileText, BookOpen, Unlink } from "lucide-react";
-import { useTranslation } from "react-i18next";
-import { Button } from "@/components/ui/button";
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
-import { Input } from "@/components/ui/input";
-import { useServerFn } from "@tanstack/react-start";
-import {
-  linkPrdFn,
-  unlinkPrdFn,
-  linkDocFn,
-  unlinkDocFn,
-  searchPrdsFn,
-  searchDocsFn,
-} from "@/server/serverFns/story";
-import { toast } from "sonner";
-import { type PrdBrief, type DocBrief } from "../types";
-
-export interface KnowledgePanelProps {
-  storyId: string;
-  data: {
-    prds: PrdBrief[];
-    docs: DocBrief[];
-  };
-  onUpdate: (updates: Partial<{ prds: PrdBrief[]; docs: DocBrief[] }>) => void;
-}
-
-export function KnowledgePanel({ storyId, data, onUpdate }: KnowledgePanelProps) {
-  const { t } = useTranslation("story");
-  const [prdDialogOpen, setPrdDialogOpen] = React.useState(false);
-  const [docDialogOpen, setDocDialogOpen] = React.useState(false);
-  const [prdQuery, setPrdQuery] = React.useState("");
-  const [docQuery, setDocQuery] = React.useState("");
-  const [prdResults, setPrdResults] = React.useState<PrdBrief[]>([]);
-  const [docResults, setDocResults] = React.useState<DocBrief[]>([]);
-
-  const linkPrd = useServerFn(linkPrdFn);
-  const unlinkPrd = useServerFn(unlinkPrdFn);
-  const linkDoc = useServerFn(linkDocFn);
-  const unlinkDoc = useServerFn(unlinkDocFn);
-
-  const handleSearchPrds = async (q: string) => {
-    setPrdQuery(q);
-    if (!q.trim()) {
-      setPrdResults([]);
-      return;
-    }
-    try {
-      const results = await searchPrdsFn({ data: { query: q } });
-      setPrdResults(results);
-    } catch (error) {
-      console.error(t("knowledge.searchPrdFailed"), error);
-    }
-  };
-
-  const handleSearchDocs = async (q: string) => {
-    setDocQuery(q);
-    if (!q.trim()) {
-      setDocResults([]);
-      return;
-    }
-    try {
-      const results = await searchDocsFn({ data: { query: q } });
-      setDocResults(results);
-    } catch (error) {
-      console.error(t("knowledge.searchDocFailed"), error);
-    }
-  };
-
-  const handleLinkPrd = async (prd: PrdBrief) => {
-    try {
-      await linkPrd({ data: { storyId, prdId: prd.id } });
-      toast.success(t("knowledge.prdLinked"));
-      onUpdate({ prds: [...data.prds, prd] });
-      setPrdDialogOpen(false);
-      setPrdQuery("");
-      setPrdResults([]);
-    } catch (error: any) {
-      console.error(t("knowledge.linkPrdFailed"), error);
-      toast.error(error.message || t("knowledge.linkPrdFailed"));
-    }
-  };
-
-  const handleUnlinkPrd = async (prdId: string) => {
-    try {
-      await unlinkPrd({ data: { storyId, prdId } });
-      toast.success(t("knowledge.prdUnlinked"));
-      onUpdate({ prds: data.prds.filter((p) => p.id !== prdId) });
-    } catch (error: any) {
-      console.error(t("knowledge.unlinkPrdFailed"), error);
-      toast.error(error.message || t("knowledge.unlinkPrdFailed"));
-    }
-  };
-
-  const handleLinkDoc = async (doc: DocBrief) => {
-    try {
-      await linkDoc({ data: { storyId, docId: doc.id } });
-      toast.success(t("knowledge.docLinked"));
-      onUpdate({ docs: [...data.docs, doc] });
-      setDocDialogOpen(false);
-      setDocQuery("");
-      setDocResults([]);
-    } catch (error: any) {
-      console.error(t("knowledge.linkDocFailed"), error);
-      toast.error(error.message || t("knowledge.linkDocFailed"));
-    }
-  };
-
-  const handleUnlinkDoc = async (docId: string) => {
-    try {
-      await unlinkDoc({ data: { storyId, docId } });
-      toast.success(t("knowledge.docUnlinked"));
-      onUpdate({ docs: data.docs.filter((d) => d.id !== docId) });
-    } catch (error: any) {
-      console.error(t("knowledge.unlinkDocFailed"), error);
-      toast.error(error.message || t("knowledge.unlinkDocFailed"));
-    }
-  };
-
-  return (
-    <div className="space-y-6">
-      {/* PRD 关联 */}
-      <div>
-        <div className="flex items-center justify-between mb-2">
-          <div className="flex items-center gap-2">
-            <FileText className="h-4 w-4 text-muted-foreground" />
-            <div className="text-sm font-medium">{t("knowledge.prdTitle")}</div>
-          </div>
-          <Dialog open={prdDialogOpen} onOpenChange={setPrdDialogOpen}>
-            <DialogTrigger asChild>
-              <Button type="button" variant="outline" size="sm">
-                <Plus className="h-4 w-4 mr-2" />
-                {t("knowledge.linkPrd")}
-              </Button>
-            </DialogTrigger>
-            <DialogContent>
-              <DialogHeader>
-                <DialogTitle>{t("knowledge.searchPrdTitle")}</DialogTitle>
-              </DialogHeader>
-              <div className="space-y-3">
-                <Input
-                  placeholder={t("knowledge.searchPrdPlaceholder")}
-                  value={prdQuery}
-                  onChange={(e) => handleSearchPrds(e.target.value)}
-                />
-                <div className="max-h-64 overflow-y-auto space-y-1">
-                  {prdResults.map((prd) => (
-                    <button
-                      key={prd.id}
-                      type="button"
-                      className="w-full text-left px-3 py-2 rounded-md hover:bg-muted text-sm"
-                      onClick={() => handleLinkPrd(prd)}
-                    >
-                      {prd.title}
-                    </button>
-                  ))}
-                  {prdResults.length === 0 && prdQuery && (
-                    <div className="text-sm text-muted-foreground text-center py-4">
-                      {t("knowledge.noResults")}
-                    </div>
-                  )}
-                </div>
-              </div>
-            </DialogContent>
-          </Dialog>
-        </div>
-
-        {data.prds.length > 0 ? (
-          <div className="space-y-2">
-            {data.prds.map((prd) => (
-              <div
-                key={prd.id}
-                className="flex items-center justify-between p-3 bg-muted rounded-md"
-              >
-                <span className="text-sm">{prd.title}</span>
-                <Button
-                  type="button"
-                  variant="ghost"
-                  size="sm"
-                  onClick={() => handleUnlinkPrd(prd.id)}
-                >
-                  <Unlink className="h-4 w-4" />
-                </Button>
-              </div>
-            ))}
-          </div>
-        ) : (
-          <div className="text-sm text-muted-foreground text-center py-2">
-            {t("knowledge.noPrds")}
-          </div>
-        )}
-      </div>
-
-      {/* 知识文档关联 */}
-      <div>
-        <div className="flex items-center justify-between mb-2">
-          <div className="flex items-center gap-2">
-            <BookOpen className="h-4 w-4 text-muted-foreground" />
-            <div className="text-sm font-medium">{t("knowledge.docTitle")}</div>
-          </div>
-          <Dialog open={docDialogOpen} onOpenChange={setDocDialogOpen}>
-            <DialogTrigger asChild>
-              <Button type="button" variant="outline" size="sm">
-                <Plus className="h-4 w-4 mr-2" />
-                {t("knowledge.linkDoc")}
-              </Button>
-            </DialogTrigger>
-            <DialogContent>
-              <DialogHeader>
-                <DialogTitle>{t("knowledge.searchDocTitle")}</DialogTitle>
-              </DialogHeader>
-              <div className="space-y-3">
-                <Input
-                  placeholder={t("knowledge.searchDocPlaceholder")}
-                  value={docQuery}
-                  onChange={(e) => handleSearchDocs(e.target.value)}
-                />
-                <div className="max-h-64 overflow-y-auto space-y-1">
-                  {docResults.map((doc) => (
-                    <button
-                      key={doc.id}
-                      type="button"
-                      className="w-full text-left px-3 py-2 rounded-md hover:bg-muted text-sm"
-                      onClick={() => handleLinkDoc(doc)}
-                    >
-                      {doc.title}
-                    </button>
-                  ))}
-                  {docResults.length === 0 && docQuery && (
-                    <div className="text-sm text-muted-foreground text-center py-4">
-                      {t("knowledge.noResults")}
-                    </div>
-                  )}
-                </div>
-              </div>
-            </DialogContent>
-          </Dialog>
-        </div>
-
-        {data.docs.length > 0 ? (
-          <div className="space-y-2">
-            {data.docs.map((doc) => (
-              <div
-                key={doc.id}
-                className="flex items-center justify-between p-3 bg-muted rounded-md"
-              >
-                <span className="text-sm">{doc.title}</span>
-                <Button
-                  type="button"
-                  variant="ghost"
-                  size="sm"
-                  onClick={() => handleUnlinkDoc(doc.id)}
-                >
-                  <Unlink className="h-4 w-4" />
-                </Button>
-              </div>
-            ))}
-          </div>
-        ) : (
-          <div className="text-sm text-muted-foreground text-center py-2">
-            {t("knowledge.noDocs")}
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}

package/src/components/story/relations/links-panel.tsx

@@ -1,240 +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 { Plus, ExternalLink, Trash2, Edit2 } from "lucide-react";
-import { useTranslation } from "react-i18next";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Textarea } from "@/components/ui/textarea";
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
-import { useServerFn } from "@tanstack/react-start";
-import { addLinkFn, updateLinkFn, removeLinkFn } from "@/server/serverFns/story";
-import { toast } from "sonner";
-import { type StoryLinkItem } from "../types";
-
-export interface LinksPanelProps {
-  storyId: string;
-  data: StoryLinkItem[];
-  onUpdate: (newLinks: StoryLinkItem[]) => void;
-}
-
-export function LinksPanel({ storyId, data, onUpdate }: LinksPanelProps) {
-  const { t } = useTranslation("story");
-  const [open, setOpen] = React.useState(false);
-  const [editingLink, setEditingLink] = React.useState<StoryLinkItem | null>(null);
-  const [form, setForm] = React.useState({ url: "", title: "", description: "" });
-
-  const addLink = useServerFn(addLinkFn);
-  const updateLink = useServerFn(updateLinkFn);
-  const removeLink = useServerFn(removeLinkFn);
-
-  const handleOpenAdd = () => {
-    setEditingLink(null);
-    setForm({ url: "", title: "", description: "" });
-    setOpen(true);
-  };
-
-  const handleOpenEdit = (link: StoryLinkItem) => {
-    setEditingLink(link);
-    setForm({ url: link.url, title: link.title || "", description: link.description || "" });
-    setOpen(true);
-  };
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-
-    try {
-      if (editingLink) {
-        await updateLink({
-          data: {
-            linkId: editingLink.id,
-            url: form.url,
-            title: form.title || undefined,
-            description: form.description || undefined,
-          },
-        });
-        toast.success(t("links.updated"));
-
-        onUpdate(
-          data.map((link) =>
-            link.id === editingLink.id
-              ? { ...link, url: form.url, title: form.title || null, description: form.description || null }
-              : link
-          )
-        );
-      } else {
-        const result = await addLink({
-          data: {
-            storyId,
-            url: form.url,
-            title: form.title || undefined,
-            description: form.description || undefined,
-          },
-        });
-        toast.success(t("links.added"));
-
-        onUpdate([
-          ...data,
-          {
-            id: result.id,
-            url: result.url,
-            title: result.title,
-            description: result.description,
-          },
-        ]);
-      }
-
-      setOpen(false);
-    } catch (error: any) {
-      console.error(t("links.saveFailed"), error);
-      toast.error(error.message || t("links.saveFailed"));
-    }
-  };
-
-  const handleRemove = async (linkId: string) => {
-    try {
-      await removeLink({ data: { linkId } });
-      toast.success(t("links.removed"));
-
-      onUpdate(data.filter((link) => link.id !== linkId));
-    } catch (error: any) {
-      console.error(t("links.removeFailed"), error);
-      toast.error(error.message || t("links.removeFailed"));
-    }
-  };
-
-  return (
-    <div className="space-y-4">
-      <div className="flex items-center justify-between">
-        <div className="text-sm font-medium">{t("links.title")}</div>
-        <Dialog open={open} onOpenChange={setOpen}>
-          <DialogTrigger asChild>
-            <Button type="button" variant="outline" size="sm" onClick={handleOpenAdd}>
-              <Plus className="h-4 w-4 mr-2" />
-              {t("links.add")}
-            </Button>
-          </DialogTrigger>
-          <DialogContent>
-            <DialogHeader>
-              <DialogTitle>{t(editingLink ? "links.editTitle" : "links.addTitle")}</DialogTitle>
-            </DialogHeader>
-            <form onSubmit={handleSubmit} className="space-y-4">
-              <div>
-                <label className="text-sm font-medium">URL</label>
-                <Input
-                  type="url"
-                  placeholder="https://example.com"
-                  value={form.url}
-                  onChange={(e) => setForm({ ...form, url: e.target.value })}
-                  required
-                />
-              </div>
-              <div>
-                <label className="text-sm font-medium">{t("links.titleOptional")}</label>
-                <Input
-                  placeholder={t("links.titlePlaceholder")}
-                  value={form.title}
-                  onChange={(e) => setForm({ ...form, title: e.target.value })}
-                />
-              </div>
-              <div>
-                <label className="text-sm font-medium">{t("links.descOptional")}</label>
-                <Textarea
-                  placeholder={t("links.descPlaceholder")}
-                  value={form.description}
-                  onChange={(e) => setForm({ ...form, description: e.target.value })}
-                  rows={3}
-                />
-              </div>
-              <div className="flex justify-end gap-2">
-                <Button type="button" variant="outline" onClick={() => setOpen(false)}>
-                  {t("links.cancel")}
-                </Button>
-                <Button type="submit">{t(editingLink ? "links.update" : "links.add")}</Button>
-              </div>
-            </form>
-          </DialogContent>
-        </Dialog>
-      </div>
-
-      {data.length > 0 ? (
-        <div className="space-y-2">
-          {data.map((link) => (
-            <div
-              key={link.id}
-              className="flex items-start justify-between p-3 bg-muted rounded-md"
-            >
-              <div className="flex-1 min-w-0">
-                <div className="flex items-center gap-2 mb-1">
-                  <ExternalLink className="h-4 w-4 text-muted-foreground shrink-0" />
-                  {link.title ? (
-                    <span className="text-sm font-medium truncate">{link.title}</span>
-                  ) : (
-                    <a
-                      href={link.url}
-                      target="_blank"
-                      rel="noopener noreferrer"
-                      className="text-sm truncate hover:underline"
-                    >
-                      {link.url}
-                    </a>
-                  )}
-                </div>
-                {link.description && (
-                  <p className="text-sm text-muted-foreground truncate">{link.description}</p>
-                )}
-                {!link.title && (
-                  <a
-                    href={link.url}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    className="text-xs text-muted-foreground truncate block"
-                  >
-                    {link.url}
-                  </a>
-                )}
-              </div>
-              <div className="flex items-center gap-1 ml-2">
-                <Button
-                  type="button"
-                  variant="ghost"
-                  size="icon"
-                  onClick={() => handleOpenEdit(link)}
-                >
-                  <Edit2 className="h-4 w-4" />
-                </Button>
-                <Button
-                  type="button"
-                  variant="ghost"
-                  size="icon"
-                  onClick={() => handleRemove(link.id)}
-                >
-                  <Trash2 className="h-4 w-4" />
-                </Button>
-              </div>
-            </div>
-          ))}
-        </div>
-      ) : (
-        <div className="text-sm text-muted-foreground text-center py-4">
-          {t("links.empty")}
-        </div>
-      )}
-    </div>
-  );
-}