@btst/stack 1.3.1 → 1.4.1

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-message.mjs

@@ -0,0 +1,423 @@
+"use client";
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { cn } from '../../../../../../ui/src/lib/utils.mjs';
+import { MarkdownContent } from '../../../../../../ui/src/components/markdown-content.mjs';
+import { Button } from '../../../../../../ui/src/components/button.mjs';
+import { Dialog, DialogContent, DialogTitle } from '../../../../../../ui/src/components/dialog.mjs';
+import { Bot, FileText, X, Send, Pencil, Check, Copy, RefreshCw, User } from 'lucide-react';
+import { isToolUIPart, getToolName } from 'ai';
+import { useState, useRef, useEffect, useMemo } from 'react';
+import { usePluginOverrides } from '@btst/stack/context';
+import { AI_CHAT_LOCALIZATION } from '../localization/index.mjs';
+import { ToolCallDisplay } from './tool-call-display.mjs';
+import 'highlight.js/styles/panda-syntax-light.css';
+import completeMarkdown from 'remend';
+
+const DefaultLink = (props) => /* @__PURE__ */ jsx("a", { ...props });
+const DefaultImage = (props) => /* @__PURE__ */ jsx("img", { ...props });
+function ClickableImage({
+  src,
+  alt,
+  width = 200,
+  height = 200,
+  className,
+  ImageComponent
+}) {
+  const [isOpen, setIsOpen] = useState(false);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsOpen(true),
+        className: "cursor-zoom-in focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 rounded-md overflow-hidden",
+        style: { width, height },
+        children: /* @__PURE__ */ jsx(
+          ImageComponent,
+          {
+            src,
+            alt,
+            width,
+            height,
+            className: cn(
+              "object-cover hover:opacity-90 transition-opacity",
+              className
+            )
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: setIsOpen, children: /* @__PURE__ */ jsxs(
+      DialogContent,
+      {
+        className: "max-w-[90vw] max-h-[90vh] p-2 sm:max-w-[90vw]",
+        showCloseButton: true,
+        children: [
+          /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: alt }),
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(
+            "img",
+            {
+              src,
+              alt,
+              className: "max-w-full max-h-[85vh] object-contain rounded-md"
+            }
+          ) })
+        ]
+      }
+    ) })
+  ] });
+}
+function ChatMessage({
+  message,
+  isStreaming = false,
+  variant = "default",
+  onRetry,
+  onEdit,
+  isRetrying = false
+}) {
+  const isUser = message.role === "user";
+  const {
+    Link,
+    Image,
+    localization: customLocalization,
+    toolRenderers
+  } = usePluginOverrides(
+    "ai-chat",
+    {}
+  );
+  const localization = { ...AI_CHAT_LOCALIZATION, ...customLocalization };
+  const ImageComponent = Image ?? DefaultImage;
+  const [copied, setCopied] = useState(false);
+  const [isEditing, setIsEditing] = useState(false);
+  const [editText, setEditText] = useState("");
+  const editTextareaRef = useRef(null);
+  useEffect(() => {
+    if (isEditing && editTextareaRef.current) {
+      editTextareaRef.current.style.height = "auto";
+      editTextareaRef.current.style.height = `${editTextareaRef.current.scrollHeight}px`;
+      editTextareaRef.current.focus();
+    }
+  }, [isEditing, editText]);
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(textContent);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch (err) {
+      console.error("Failed to copy text:", err);
+    }
+  };
+  const handleStartEdit = () => {
+    setEditText(textContent);
+    setIsEditing(true);
+  };
+  const handleCancelEdit = () => {
+    setIsEditing(false);
+    setEditText("");
+  };
+  const handleSaveEdit = () => {
+    if (editText.trim() && onEdit) {
+      onEdit(editText.trim());
+      setIsEditing(false);
+      setEditText("");
+    }
+  };
+  const handleEditKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSaveEdit();
+    } else if (e.key === "Escape") {
+      handleCancelEdit();
+    }
+  };
+  const textContent = useMemo(() => {
+    if (message.parts && Array.isArray(message.parts)) {
+      return message.parts.filter((part) => part.type === "text").map((part) => part.text).join("");
+    }
+    return "";
+  }, [message.parts]);
+  const imageParts = useMemo(() => {
+    if (message.parts && Array.isArray(message.parts)) {
+      return message.parts.filter(
+        (part) => part.type === "file" && part.mediaType?.startsWith("image/")
+      );
+    }
+    return [];
+  }, [message.parts]);
+  const fileParts = useMemo(() => {
+    if (message.parts && Array.isArray(message.parts)) {
+      return message.parts.filter(
+        (part) => part.type === "file" && !part.mediaType?.startsWith("image/")
+      );
+    }
+    return [];
+  }, [message.parts]);
+  const toolParts = useMemo(() => {
+    if (message.parts && Array.isArray(message.parts)) {
+      return message.parts.filter((part) => isToolUIPart(part));
+    }
+    return [];
+  }, [message.parts]);
+  const displayContent = useMemo(() => {
+    if (!textContent) return "";
+    if (isStreaming && !isUser) {
+      return completeMarkdown(textContent);
+    }
+    return textContent;
+  }, [textContent, isStreaming, isUser]);
+  const isCompact = variant === "compact";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex gap-3 w-full",
+        isCompact ? "mb-3" : "mb-4",
+        isUser ? "justify-end" : "justify-start"
+      ),
+      "aria-label": isUser ? localization.A11Y_USER_MESSAGE : localization.A11Y_ASSISTANT_MESSAGE,
+      children: [
+        !isUser && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "rounded-full bg-muted flex items-center justify-center shrink-0",
+              isCompact ? "w-7 h-7" : "w-8 h-8"
+            ),
+            children: /* @__PURE__ */ jsx(Bot, { className: cn(isCompact ? "w-4 h-4" : "w-5 h-5") })
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 max-w-[80%] group", children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "rounded-lg",
+                isCompact ? "px-3 py-2" : "px-4 py-3",
+                isUser ? "bg-primary text-primary-foreground" : "bg-muted"
+              ),
+              children: isUser ? (
+                // User messages: files + images + text (or edit mode)
+                /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                  fileParts.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: fileParts.map((part, index) => /* @__PURE__ */ jsxs(
+                    "a",
+                    {
+                      href: part.url,
+                      target: "_blank",
+                      rel: "noopener noreferrer",
+                      className: "flex items-center gap-2 px-3 py-2 rounded-md bg-primary-foreground/10 hover:bg-primary-foreground/20 transition-colors",
+                      children: [
+                        /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4 shrink-0" }),
+                        /* @__PURE__ */ jsx("span", { className: "text-xs truncate max-w-[150px]", children: part.filename || "File" })
+                      ]
+                    },
+                    index
+                  )) }),
+                  imageParts.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: imageParts.map((part, index) => /* @__PURE__ */ jsx(
+                    ClickableImage,
+                    {
+                      src: part.url,
+                      alt: part.filename || `Attached image ${index + 1}`,
+                      width: 150,
+                      height: 150,
+                      className: "rounded-md",
+                      ImageComponent
+                    },
+                    index
+                  )) }),
+                  isEditing ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                    /* @__PURE__ */ jsx(
+                      "textarea",
+                      {
+                        ref: editTextareaRef,
+                        value: editText,
+                        onChange: (e) => setEditText(e.target.value),
+                        onKeyDown: handleEditKeyDown,
+                        className: cn(
+                          "w-full min-w-[200px] resize-none rounded-md border-0 bg-primary-foreground/10 p-2 text-sm",
+                          "focus:outline-none focus:ring-1 focus:ring-primary-foreground/30",
+                          "text-primary-foreground placeholder:text-primary-foreground/50"
+                        ),
+                        rows: 1
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          type: "button",
+                          size: "icon-sm",
+                          variant: "ghost",
+                          onClick: handleCancelEdit,
+                          className: "h-7 w-7 text-primary-foreground hover:bg-primary-foreground/20",
+                          title: localization.MESSAGE_CANCEL,
+                          children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          type: "button",
+                          size: "icon-sm",
+                          variant: "ghost",
+                          onClick: handleSaveEdit,
+                          disabled: !editText.trim(),
+                          className: "h-7 w-7 text-primary-foreground hover:bg-primary-foreground/20 disabled:opacity-50",
+                          title: localization.MESSAGE_SAVE,
+                          children: /* @__PURE__ */ jsx(Send, { className: "h-4 w-4" })
+                        }
+                      )
+                    ] })
+                  ] }) : textContent && /* @__PURE__ */ jsx(
+                    "p",
+                    {
+                      className: cn(
+                        "whitespace-pre-wrap wrap-break-word",
+                        isCompact ? "text-sm" : "text-sm"
+                      ),
+                      children: textContent
+                    }
+                  )
+                ] })
+              ) : (
+                // Assistant messages: rendered markdown + files + images + tool calls
+                /* @__PURE__ */ jsxs("div", { className: "wrap-break-word space-y-2", children: [
+                  fileParts.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: fileParts.map((part, index) => /* @__PURE__ */ jsxs(
+                    "a",
+                    {
+                      href: part.url,
+                      target: "_blank",
+                      rel: "noopener noreferrer",
+                      className: "flex items-center gap-2 px-3 py-2 rounded-md bg-muted-foreground/10 hover:bg-muted-foreground/20 transition-colors border",
+                      children: [
+                        /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+                        /* @__PURE__ */ jsx("span", { className: "text-xs truncate max-w-[150px]", children: part.filename || "File" })
+                      ]
+                    },
+                    index
+                  )) }),
+                  imageParts.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: imageParts.map((part, index) => /* @__PURE__ */ jsx(
+                    ClickableImage,
+                    {
+                      src: part.url,
+                      alt: part.filename || `Image ${index + 1}`,
+                      width: 200,
+                      height: 200,
+                      className: "rounded-md",
+                      ImageComponent
+                    },
+                    index
+                  )) }),
+                  toolParts.length > 0 && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: toolParts.map((part) => {
+                    const toolName = getToolName(part);
+                    const toolCallId = part.toolCallId;
+                    const state = part.state;
+                    const input = part.input;
+                    const output = part.output;
+                    const errorText = part.errorText;
+                    const isLoading = state === "input-streaming" || state === "input-available";
+                    const toolCallProps = {
+                      toolCallId,
+                      toolName,
+                      state,
+                      input,
+                      output,
+                      errorText,
+                      isLoading
+                    };
+                    const CustomRenderer = toolRenderers?.[toolName];
+                    if (CustomRenderer) {
+                      return /* @__PURE__ */ jsx(CustomRenderer, { ...toolCallProps }, toolCallId);
+                    }
+                    return /* @__PURE__ */ jsx(ToolCallDisplay, { ...toolCallProps }, toolCallId);
+                  }) }),
+                  displayContent ? /* @__PURE__ */ jsx(
+                    MarkdownContent,
+                    {
+                      markdown: displayContent,
+                      variant: "chat",
+                      LinkComponent: Link ?? DefaultLink,
+                      ImageComponent
+                    }
+                  ) : imageParts.length === 0 && fileParts.length === 0 && toolParts.length === 0 ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "..." }) : null
+                ] })
+              )
+            }
+          ),
+          !isStreaming && !isEditing && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity",
+                isUser ? "justify-end" : "justify-start"
+              ),
+              children: isUser ? (
+                // User message actions: Edit
+                onEdit && /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    type: "button",
+                    size: "icon-sm",
+                    variant: "ghost",
+                    onClick: handleStartEdit,
+                    className: "h-7 w-7 bg-transparent text-muted-foreground hover:text-foreground hover:bg-muted/50",
+                    title: localization.MESSAGE_EDIT,
+                    children: /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5" })
+                  }
+                )
+              ) : (
+                // Assistant message actions: Copy and Retry
+                /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      type: "button",
+                      size: "icon-sm",
+                      variant: "ghost",
+                      onClick: handleCopy,
+                      className: "h-7 w-7 bg-transparent text-muted-foreground hover:text-foreground hover:bg-muted/50",
+                      title: copied ? localization.MESSAGE_COPIED : localization.MESSAGE_COPY,
+                      children: copied ? /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx(Copy, { className: "h-3.5 w-3.5" })
+                    }
+                  ),
+                  onRetry && /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      type: "button",
+                      size: "icon-sm",
+                      variant: "ghost",
+                      onClick: onRetry,
+                      disabled: isRetrying,
+                      className: "h-7 w-7 bg-transparent text-muted-foreground hover:text-foreground hover:bg-muted/50 disabled:opacity-50",
+                      title: localization.MESSAGE_RETRY,
+                      children: /* @__PURE__ */ jsx(
+                        RefreshCw,
+                        {
+                          className: cn(
+                            "h-3.5 w-3.5",
+                            isRetrying && "animate-spin"
+                          )
+                        }
+                      )
+                    }
+                  )
+                ] })
+              )
+            }
+          )
+        ] }),
+        isUser && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "rounded-full bg-primary flex items-center justify-center shrink-0 text-primary-foreground",
+              isCompact ? "w-7 h-7" : "w-8 h-8"
+            ),
+            children: /* @__PURE__ */ jsx(User, { className: cn(isCompact ? "w-4 h-4" : "w-5 h-5") })
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { ChatMessage };

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-sidebar.cjs

@@ -0,0 +1,227 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const button = require('../../../../../../ui/src/components/button.cjs');
+const input = require('../../../../../../ui/src/components/input.cjs');
+const scrollArea = require('../../../../../../ui/src/components/scroll-area.cjs');
+const dropdownMenu = require('../../../../../../ui/src/components/dropdown-menu.cjs');
+const alertDialog = require('../../../../../../ui/src/components/alert-dialog.cjs');
+const dialog = require('../../../../../../ui/src/components/dialog.cjs');
+const lucideReact = require('lucide-react');
+const utils = require('../../../../../../ui/src/lib/utils.cjs');
+const context = require('@btst/stack/context');
+const chatHooks = require('../hooks/chat-hooks.cjs');
+const index = require('../localization/index.cjs');
+
+function ChatSidebar({
+  currentConversationId,
+  onNewChat,
+  className
+}) {
+  const { navigate, localization: customLocalization } = context.usePluginOverrides("ai-chat", {});
+  const basePath = context.useBasePath();
+  const localization = { ...index.AI_CHAT_LOCALIZATION, ...customLocalization };
+  const { conversations, isLoading } = chatHooks.useConversations();
+  const renameMutation = chatHooks.useRenameConversation();
+  const deleteMutation = chatHooks.useDeleteConversation();
+  const [renameDialogOpen, setRenameDialogOpen] = React.useState(false);
+  const [deleteDialogOpen, setDeleteDialogOpen] = React.useState(false);
+  const [selectedConversation, setSelectedConversation] = React.useState(null);
+  const [newTitle, setNewTitle] = React.useState("");
+  const handleNewChat = () => {
+    if (navigate) {
+      navigate(`${basePath}/chat`);
+    }
+    if (onNewChat) {
+      onNewChat();
+    }
+  };
+  const handleConversationClick = (conversation) => {
+    if (navigate) {
+      navigate(`${basePath}/chat/${conversation.id}`);
+    }
+  };
+  const handleRenameClick = (conversation) => {
+    setSelectedConversation(conversation);
+    setNewTitle(conversation.title);
+    setRenameDialogOpen(true);
+  };
+  const handleDeleteClick = (conversation) => {
+    setSelectedConversation(conversation);
+    setDeleteDialogOpen(true);
+  };
+  const handleRenameConfirm = async () => {
+    if (selectedConversation && newTitle.trim()) {
+      await renameMutation.mutateAsync({
+        id: selectedConversation.id,
+        title: newTitle.trim()
+      });
+      setRenameDialogOpen(false);
+      setSelectedConversation(null);
+      setNewTitle("");
+    }
+  };
+  const handleDeleteConfirm = async () => {
+    if (selectedConversation) {
+      await deleteMutation.mutateAsync({ id: selectedConversation.id });
+      setDeleteDialogOpen(false);
+      setSelectedConversation(null);
+      if (selectedConversation.id === currentConversationId && navigate) {
+        navigate(`${basePath}/chat`);
+      }
+    }
+  };
+  const formatDate = (dateString) => {
+    const date = new Date(dateString);
+    const now = /* @__PURE__ */ new Date();
+    const diffMs = now.getTime() - date.getTime();
+    const diffMins = Math.floor(diffMs / 6e4);
+    const diffHours = Math.floor(diffMs / 36e5);
+    const diffDays = Math.floor(diffMs / 864e5);
+    if (diffMins < 1) return localization.TIME_JUST_NOW;
+    if (diffMins < 60)
+      return localization.TIME_MINUTES_AGO.replace("{count}", String(diffMins));
+    if (diffHours < 24)
+      return localization.TIME_HOURS_AGO.replace("{count}", String(diffHours));
+    if (diffDays === 1) return localization.TIME_YESTERDAY;
+    if (diffDays < 7)
+      return localization.TIME_DAYS_AGO.replace("{count}", String(diffDays));
+    return date.toLocaleDateString();
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-col h-full bg-muted/30 border-r", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 border-b", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      button.Button,
+      {
+        onClick: handleNewChat,
+        className: "w-full justify-start gap-2",
+        variant: "outline",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquarePlus, { className: "h-4 w-4" }),
+          localization.SIDEBAR_NEW_CHAT
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(scrollArea.ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2", children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 text-center text-sm text-muted-foreground", children: localization.CHAT_LOADING }) : conversations.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 text-center text-sm text-muted-foreground", children: localization.SIDEBAR_NO_CONVERSATIONS }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: conversations.map((conversation) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: utils.cn(
+          "group flex items-center gap-2 rounded-lg px-3 py-2 hover:bg-accent cursor-pointer transition-colors overflow-hidden",
+          currentConversationId === conversation.id && "bg-accent"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              className: "flex-1 flex items-center gap-2 text-left min-w-0 overflow-hidden",
+              onClick: () => handleConversationClick(conversation),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0 overflow-hidden", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium truncate", children: conversation.title }),
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground truncate", children: formatDate(conversation.updatedAt) })
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+              button.Button,
+              {
+                variant: "ghost",
+                size: "icon",
+                className: "h-8 w-8 opacity-0 group-hover:opacity-100 transition-opacity",
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-4 w-4" })
+              }
+            ) }),
+            /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuContent, { align: "end", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                dropdownMenu.DropdownMenuItem,
+                {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    handleRenameClick(conversation);
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Pencil, { className: "h-4 w-4 mr-2" }),
+                    localization.CONVERSATION_RENAME
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                dropdownMenu.DropdownMenuItem,
+                {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    handleDeleteClick(conversation);
+                  },
+                  className: "text-destructive focus:text-destructive",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2, { className: "h-4 w-4 mr-2" }),
+                    localization.CONVERSATION_DELETE
+                  ]
+                }
+              )
+            ] })
+          ] })
+        ]
+      },
+      conversation.id
+    )) }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog, { open: renameDialogOpen, onOpenChange: setRenameDialogOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(dialog.DialogContent, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { children: localization.CONVERSATION_RENAME }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        input.Input,
+        {
+          value: newTitle,
+          onChange: (e) => setNewTitle(e.target.value),
+          placeholder: localization.CONVERSATION_RENAME_PLACEHOLDER,
+          onKeyDown: (e) => {
+            if (e.key === "Enter") {
+              void handleRenameConfirm();
+            }
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(dialog.DialogFooter, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            variant: "outline",
+            onClick: () => setRenameDialogOpen(false),
+            children: localization.CONVERSATION_RENAME_CANCEL
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            onClick: handleRenameConfirm,
+            disabled: !newTitle.trim() || renameMutation.isPending,
+            children: localization.CONVERSATION_RENAME_SAVE
+          }
+        )
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialog, { open: deleteDialogOpen, onOpenChange: setDeleteDialogOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialogContent, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialogHeader, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogTitle, { children: localization.CONVERSATION_DELETE_CONFIRM_TITLE }),
+        /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogDescription, { children: localization.CONVERSATION_DELETE_CONFIRM_DESCRIPTION })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialogFooter, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogCancel, { children: localization.CONVERSATION_DELETE_CANCEL }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          alertDialog.AlertDialogAction,
+          {
+            onClick: handleDeleteConfirm,
+            className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+            children: localization.CONVERSATION_DELETE_CONFIRM_BUTTON
+          }
+        )
+      ] })
+    ] }) })
+  ] });
+}
+
+exports.ChatSidebar = ChatSidebar;