cx-chat 0.0.2 → 0.0.3

package/src/views/chat/components/header-thread-title.tsx

@@ -1,210 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import clsx from 'clsx'
-import { useTranslation } from 'react-i18next'
-import {
-  Check,
-  ChevronDown,
-  Edit2,
-  Loader2,
-  Pin,
-  PinOff,
-  Trash2,
-  X,
-} from 'lucide-react'
-
-import ConfirmDialog from '@/components/common/modal/confirm-dialog'
-import {
-  useDeletingChatSessionId,
-  useThreadActions,
-} from '@/hooks/useThreadActions'
-import type { Thread } from '@/types'
-import { resolveThreadDisplayTitle } from '@/utils/chatUtils'
-
-export type HeaderThreadTitleProps = {
-  threadId: string
-  allThreads: Thread[]
-  /** 消息多选删除等场景：仅展示标题，不可展开菜单/重命名 */
-  titleReadOnly?: boolean
-}
-
-const HeaderThreadTitle: React.FC<HeaderThreadTitleProps> = ({
-  threadId,
-  allThreads,
-  titleReadOnly = false,
-}) => {
-  const { t } = useTranslation()
-  const { renameThread, togglePinThread, deleteThread } = useThreadActions()
-  const deletingSessionId = useDeletingChatSessionId()
-
-  const activeThread = allThreads.find((x) => x.id === threadId)
-  const [open, setOpen] = useState(false)
-  const [renaming, setRenaming] = useState(false)
-  const [renameTitle, setRenameTitle] = useState('')
-  const [deleteConfirmOpen, setDeleteConfirmOpen] = useState(false)
-
-  useEffect(() => {
-    if (activeThread) setRenameTitle(activeThread.title || '')
-    setRenaming(false)
-    setOpen(false)
-  }, [activeThread?.id, activeThread?.title])
-
-  useEffect(() => {
-    const onDocClick = () => setOpen(false)
-    if (open) document.addEventListener('click', onDocClick)
-    return () => document.removeEventListener('click', onDocClick)
-  }, [open])
-
-  if (!activeThread) return null
-
-  if (titleReadOnly) {
-    return (
-      <div className="flex min-h-[36px] items-center justify-center px-3">
-        <span className="max-w-[240px] truncate text-sm font-medium text-gray-900 dark:text-gray-100">
-          {resolveThreadDisplayTitle(
-            activeThread.title,
-            t('chat.untitled_session'),
-          )}
-        </span>
-      </div>
-    )
-  }
-
-  const onPin = () => {
-    togglePinThread(activeThread.id, activeThread.top_status === 1)
-    setOpen(false)
-  }
-
-  const onSaveRename = () => {
-    if (renameTitle.trim()) {
-      renameThread(activeThread.id, renameTitle)
-    }
-    setRenaming(false)
-  }
-
-  return (
-    <>
-      <div className="relative flex min-h-[36px] items-center justify-center">
-        {renaming ? (
-          <div
-            className="flex items-center gap-1"
-            onClick={(e) => e.stopPropagation()}>
-            <input
-              value={renameTitle}
-              onChange={(e) => setRenameTitle(e.target.value)}
-              onKeyDown={(e) => {
-                if (e.key === 'Enter') onSaveRename()
-                if (e.key === 'Escape') setRenaming(false)
-              }}
-              className="bg-gray-100 dark:bg-gray-700 text-gray-900 dark:text-gray-100 border border-blue-500 rounded px-2 py-1 text-sm outline-none w-56 text-center"
-              autoFocus
-            />
-            <button
-              type="button"
-              onClick={onSaveRename}
-              className="p-1 text-green-600 hover:bg-green-100 dark:hover:bg-green-900/30 rounded">
-              <Check size={16} />
-            </button>
-            <button
-              type="button"
-              onClick={() => setRenaming(false)}
-              className="p-1 text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-700 rounded">
-              <X size={16} />
-            </button>
-          </div>
-        ) : (
-          <div className="relative">
-            <button
-              type="button"
-              onClick={(e) => {
-                e.stopPropagation()
-                setOpen(!open)
-              }}
-              className="flex items-center gap-2 px-3 py-1.5 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors text-sm font-medium text-gray-900 dark:text-gray-100">
-              <span className="max-w-[240px] truncate">
-                {resolveThreadDisplayTitle(
-                  activeThread.title,
-                  t('chat.untitled_session'),
-                )}
-              </span>
-              <ChevronDown
-                size={14}
-                className={clsx(
-                  'text-gray-500 transition-transform',
-                  open && 'rotate-180',
-                )}
-              />
-            </button>
-
-            {open && (
-              <div
-                className="absolute top-full left-1/2 -translate-x-1/2 mt-1 w-44 bg-white dark:bg-gray-800 rounded-lg shadow-xl border border-gray-100 dark:border-gray-700 py-1 z-20 overflow-hidden text-left"
-                onClick={(e) => e.stopPropagation()}>
-                <button
-                  type="button"
-                  onClick={onPin}
-                  className="w-full text-left px-4 py-2 text-sm flex items-center gap-2 hover:bg-gray-50 dark:hover:bg-gray-700 text-gray-700 dark:text-gray-300">
-                  {activeThread.top_status === 1 ? (
-                    <PinOff size={14} />
-                  ) : (
-                    <Pin size={14} />
-                  )}
-                  <span>
-                    {activeThread.top_status === 1
-                      ? t('common.unpin')
-                      : t('common.pin')}
-                  </span>
-                </button>
-                <button
-                  type="button"
-                  onClick={() => {
-                    setRenaming(true)
-                    setOpen(false)
-                  }}
-                  className="w-full text-left px-4 py-2 text-sm flex items-center gap-2 hover:bg-gray-50 dark:hover:bg-gray-700 text-gray-700 dark:text-gray-300">
-                  <Edit2 size={14} />
-                  <span>{t('common.rename')}</span>
-                </button>
-                <div className="h-px bg-gray-100 dark:bg-gray-700 my-1" />
-                <button
-                  type="button"
-                  onClick={() => {
-                    setOpen(false)
-                    setDeleteConfirmOpen(true)
-                  }}
-                  className="w-full text-left px-4 py-2 text-sm flex items-center gap-2 hover:bg-red-50 dark:hover:bg-red-900/10 text-red-600 dark:text-red-400">
-                  <Trash2 size={14} />
-                  <span>{t('common.delete')}</span>
-                </button>
-              </div>
-            )}
-          </div>
-        )}
-        {deletingSessionId === activeThread.id && (
-          <div
-            className="absolute inset-0 z-10 flex items-center justify-center rounded-lg bg-white/85 backdrop-blur-[1px] dark:bg-gray-950/80"
-            aria-busy="true"
-            aria-label={t('common.loading')}
-          >
-            <Loader2 size={20} className="animate-spin text-blue-500" />
-          </div>
-        )}
-      </div>
-
-      <ConfirmDialog
-        confirmText={t('common.delete')}
-        danger
-        isOpen={deleteConfirmOpen}
-        message={t('chat.delete_confirm')}
-        title={t('chat.delete_title')}
-        onClose={() => setDeleteConfirmOpen(false)}
-        onConfirm={() => {
-          deleteThread(activeThread.id)
-          setDeleteConfirmOpen(false)
-        }}
-      />
-    </>
-  )
-}
-
-export default HeaderThreadTitle
-

package/src/views/chat/components/message-list/content-answer.tsx

@@ -1,100 +0,0 @@
-import {
-  markdownRehypePlugins,
-  markdownRemarkPlugins,
-} from '@/utils/markdown-math-plugins';
-import 'highlight.js/styles/github-dark.css';
-import React from 'react';
-import type { Options as ReactMarkdownOptions } from 'react-markdown';
-import ReactMarkdown from 'react-markdown';
-import rehypeHighlight from 'rehype-highlight';
-import remarkEmoji from 'remark-emoji';
-import type { PluggableList } from 'unified';
-
-const answerRemarkPlugins = [
-  ...(markdownRemarkPlugins as PluggableList),
-  [remarkEmoji, { emoticon: true }],
-] as ReactMarkdownOptions['remarkPlugins'];
-
-const answerRehypePlugins = [
-  ...(markdownRehypePlugins as PluggableList),
-  rehypeHighlight,
-] as ReactMarkdownOptions['rehypePlugins'];
-
-const markdownTableComponents = {
-  /**
-   * 让回答里的超链接统一新窗口打开，避免打断当前会话。
-   */
-  a: ({ node, ...props }: { node?: unknown } & React.AnchorHTMLAttributes<HTMLAnchorElement>) => (
-    <a
-      {...props}
-      target="_blank"
-      rel="noopener noreferrer"
-    />
-  ),
-  table: ({ node, ...props }: { node?: unknown }) => (
-    <div className="my-4 max-h-[500px] overflow-auto rounded-lg border border-gray-200 dark:border-gray-700">
-      <table
-        className="min-w-full divide-y divide-gray-200 dark:divide-gray-700"
-        {...props}
-      />
-    </div>
-  ),
-  thead: ({ node, ...props }: { node?: unknown }) => (
-    <thead className="bg-gray-50 dark:bg-gray-800" {...props} />
-  ),
-  tbody: ({ node, ...props }: { node?: unknown }) => (
-    <tbody
-      className="divide-y divide-gray-200 dark:divide-gray-700 bg-white dark:bg-gray-900"
-      {...props}
-    />
-  ),
-  tr: ({ node, ...props }: { node?: unknown }) => <tr {...props} />,
-  th: ({ node, ...props }: { node?: unknown }) => (
-    <th
-      className="px-3 py-2 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider border-r border-gray-200 dark:border-gray-700 last:border-r-0 whitespace-nowrap"
-      {...props}
-    />
-  ),
-  td: ({ node, ...props }: { node?: unknown }) => (
-    <td
-      className="px-3 py-2 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300 border-r border-gray-200 dark:border-gray-700 last:border-r-0"
-      {...props}
-    />
-  ),
-  /** 代码块容器：与 github-dark 主题配合，统一圆角与外边距 */
-  pre: ({ node, ...props }: { node?: unknown } & React.HTMLAttributes<HTMLPreElement>) => (
-    <pre
-      className="my-3 max-w-full overflow-x-auto rounded-lg border border-gray-700/80 dark:border-gray-600/80"
-      {...props}
-    />
-  ),
-  /** 行内代码（无 hljs）与 fenced 块内 code 均由 rehype-highlight 处理 className */
-  code: ({
-    node,
-    className,
-    ...props
-  }: { node?: unknown; className?: string } & React.HTMLAttributes<HTMLElement>) => {
-    const isBlock = typeof className === 'string' && className.includes('hljs');
-    if (isBlock) {
-      return <code className={className} {...props} />;
-    }
-    return (
-      <code
-        className="rounded bg-gray-200/90 px-1.5 py-0.5 text-[0.9em] dark:bg-gray-700/90"
-        {...props}
-      />
-    );
-  },
-};
-
-export function ContentAnswer({ content }: { content: string }) {
-  return (
-    <ReactMarkdown
-      remarkPlugins={answerRemarkPlugins}
-      rehypePlugins={answerRehypePlugins}
-      components={markdownTableComponents as ReactMarkdownOptions['components']}
-    >
-      {content}
-    </ReactMarkdown>
-  );
-}

package/src/views/chat/components/message-list/content-question.tsx

@@ -1,18 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-export function ContentQuestion({ content }: { content: string }) {
-  return (
-    <div
-      className={clsx(
-        'px-5 py-3.5 break-words',
-        'bg-[#f0f4f9] dark:bg-[#1e1f20] text-gray-900 dark:text-gray-100 rounded-[2rem] rounded-tr-sm',
-      )}
-    >
-      {content ? (
-        <div className="whitespace-pre-wrap break-words">{content}</div>
-      ) : null}
-    </div>
-  );
-}
-