bingocode 1.0.3 → 1.0.4

package/desktop/src/components/markdown/MarkdownRenderer.tsx

@@ -1,229 +0,0 @@
-import { useMemo, useCallback } from 'react'
-import DOMPurify from 'dompurify'
-import { marked, type Tokens } from 'marked'
-import { CodeViewer } from '../chat/CodeViewer'
-import { MermaidRenderer } from '../chat/MermaidRenderer'
-
-type Props = {
-  content: string
-  variant?: 'default' | 'document'
-  className?: string
-}
-
-type CodeBlock = {
-  id: string
-  code: string
-  language: string | undefined
-}
-
-const MERMAID_LANGUAGE = 'mermaid'
-const PLAINTEXT_LANGUAGES = new Set(['', 'text', 'plaintext', 'plain'])
-const MERMAID_DIAGRAM_START = /^(graph|flowchart|sequenceDiagram|classDiagram|stateDiagram(?:-v2)?|erDiagram|journey|gantt|pie|gitGraph|mindmap|timeline|requirementDiagram|quadrantChart|xychart-beta|sankey-beta|block-beta|packet-beta|architecture|kanban)\b/i
-
-function normalizeCodeLanguage(language: string | undefined): string | undefined {
-  const normalized = language?.trim().split(/\s+/)[0]?.toLowerCase()
-  return normalized || undefined
-}
-
-function looksLikeMermaid(code: string): boolean {
-  const firstMeaningfulLine = code
-    .split('\n')
-    .map((line) => line.trim())
-    .find(Boolean)
-
-  return firstMeaningfulLine ? MERMAID_DIAGRAM_START.test(firstMeaningfulLine) : false
-}
-
-function shouldRenderAsMermaid(block: CodeBlock): boolean {
-  const normalizedLanguage = normalizeCodeLanguage(block.language)
-
-  if (normalizedLanguage === MERMAID_LANGUAGE) {
-    return true
-  }
-
-  if (!PLAINTEXT_LANGUAGES.has(normalizedLanguage ?? '')) {
-    return false
-  }
-
-  return looksLikeMermaid(block.code)
-}
-
-const renderer = new marked.Renderer()
-
-let pendingCodeBlocks: CodeBlock[] = []
-
-renderer.code = function ({ text, lang }: Tokens.Code) {
-  const id = `cb-${pendingCodeBlocks.length}`
-  pendingCodeBlocks.push({
-    id,
-    code: text,
-    language: normalizeCodeLanguage(lang || undefined),
-  })
-  return `<div data-codeblock-id="${id}"></div>`
-}
-
-marked.setOptions({
-  breaks: true,
-  gfm: true,
-})
-marked.use({ renderer })
-
-function enhanceMarkdownHtml(html: string): string {
-  const cleanHtml = DOMPurify.sanitize(html, {
-    ADD_TAGS: ['use'],
-    ADD_ATTR: ['xlink:href'],
-  })
-
-  if (typeof document === 'undefined') {
-    return cleanHtml
-  }
-
-  const container = document.createElement('div')
-  container.innerHTML = cleanHtml
-
-  container.querySelectorAll('table').forEach((table) => {
-    if (table.parentElement?.classList.contains('md-table-wrap')) return
-    const wrapper = document.createElement('div')
-    wrapper.className = 'md-table-wrap'
-    table.parentNode?.insertBefore(wrapper, table)
-    wrapper.appendChild(table)
-  })
-
-  container.querySelectorAll('a[href]').forEach((link) => {
-    link.setAttribute('target', '_blank')
-    link.setAttribute('rel', 'noreferrer noopener')
-  })
-
-  return container.innerHTML
-}
-
-function parseMarkdown(content: string): { html: string; codeBlocks: CodeBlock[] } {
-  pendingCodeBlocks = []
-  const html = marked.parse(content) as string
-  const codeBlocks = [...pendingCodeBlocks]
-  pendingCodeBlocks = []
-  return { html, codeBlocks }
-}
-
-const BASE_PROSE_CLASSES = `markdown-prose prose prose-sm max-w-none text-[var(--color-text-primary)]
-  prose-headings:text-[var(--color-text-primary)] prose-headings:font-semibold
-  prose-p:my-2 prose-p:leading-relaxed
-  prose-p:break-words
-  prose-code:text-[13px] prose-code:text-[var(--color-primary-fixed)] prose-code:font-[var(--font-mono)] prose-code:bg-[var(--color-surface-container-high)] prose-code:border prose-code:border-[var(--color-border)] prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded-md prose-code:before:hidden prose-code:after:hidden
-  prose-pre:!bg-transparent prose-pre:!p-0 prose-pre:!shadow-none
-  prose-a:text-[var(--color-text-accent)] prose-a:no-underline hover:prose-a:underline
-  prose-strong:text-[var(--color-text-primary)]
-  prose-ul:my-2 prose-ol:my-2
-  prose-li:my-0.5
-  prose-table:my-0 prose-table:w-full prose-table:table-auto prose-table:text-sm
-  prose-th:bg-[var(--color-surface-info)] prose-th:px-3 prose-th:py-2 prose-th:text-left prose-th:whitespace-normal prose-th:break-words prose-th:align-top prose-th:border-b prose-th:border-[var(--color-border)]
-  prose-td:px-3 prose-td:py-2 prose-td:border-b prose-td:border-[var(--color-border)] prose-td:whitespace-normal prose-td:break-words prose-td:align-top prose-td:bg-[var(--color-surface)]
-  [&_.md-table-wrap]:my-5 [&_.md-table-wrap]:overflow-x-auto [&_.md-table-wrap]:rounded-xl [&_.md-table-wrap]:border [&_.md-table-wrap]:border-[var(--color-border)] [&_.md-table-wrap]:bg-[var(--color-surface-container-lowest)]`
-
-const DOCUMENT_PROSE_CLASSES = `
-  prose-p:text-[15px] prose-p:leading-7
-  prose-headings:scroll-mt-6 prose-headings:tracking-[-0.01em]
-  prose-h1:mb-4 prose-h1:text-2xl prose-h1:font-semibold prose-h1:leading-tight
-  prose-h2:mt-8 prose-h2:mb-3 prose-h2:border-b prose-h2:border-[var(--color-border)] prose-h2:pb-2 prose-h2:text-xl prose-h2:font-semibold
-  prose-h3:mt-6 prose-h3:mb-2 prose-h3:text-base prose-h3:font-semibold
-  prose-h4:mt-5 prose-h4:mb-2 prose-h4:text-sm prose-h4:font-semibold
-  prose-blockquote:my-4 prose-blockquote:rounded-r-lg prose-blockquote:border-l-4 prose-blockquote:border-[var(--color-outline-variant)] prose-blockquote:bg-[var(--color-surface-container-low)] prose-blockquote:px-4 prose-blockquote:py-2 prose-blockquote:italic
-  prose-hr:my-6 prose-hr:border-[var(--color-border)]
-  prose-img:rounded-lg prose-img:border prose-img:border-[var(--color-border)]
-  prose-kbd:rounded prose-kbd:border prose-kbd:border-[var(--color-border)] prose-kbd:bg-[var(--color-surface-container-lowest)] prose-kbd:px-1.5 prose-kbd:py-0.5 prose-kbd:font-[var(--font-mono)] prose-kbd:text-[12px] prose-kbd:font-normal prose-kbd:text-[var(--color-text-secondary)] prose-kbd:shadow-none
-  prose-ul:pl-5 prose-ul:[&>li]:marker:text-[var(--color-text-tertiary)]
-  prose-ol:pl-5 prose-ol:[&>li]:marker:text-[var(--color-text-tertiary)]
-  prose-li:my-1.5
-  prose-table:my-0`
-
-function getProseClasses(variant: 'default' | 'document', className?: string) {
-  return [BASE_PROSE_CLASSES, variant === 'document' ? DOCUMENT_PROSE_CLASSES : '', className ?? '']
-    .filter(Boolean)
-    .join(' ')
-}
-
-export function MarkdownRenderer({ content, variant = 'default', className }: Props) {
-  const { html, codeBlocks } = useMemo(() => parseMarkdown(content), [content])
-  const proseClasses = useMemo(
-    () => getProseClasses(variant, className),
-    [variant, className],
-  )
-
-  const parts = useMemo(() => {
-    if (codeBlocks.length === 0) {
-      return [{ type: 'html' as const, content: html }]
-    }
-
-    const result: Array<{ type: 'html'; content: string } | { type: 'code'; block: CodeBlock }> = []
-    let remaining = html
-
-    for (const block of codeBlocks) {
-      const marker = `<div data-codeblock-id="${block.id}"></div>`
-      const idx = remaining.indexOf(marker)
-      if (idx === -1) continue
-
-      const before = remaining.slice(0, idx)
-      if (before) {
-        result.push({ type: 'html', content: before })
-      }
-      result.push({ type: 'code', block })
-      remaining = remaining.slice(idx + marker.length)
-    }
-
-    if (remaining) {
-      result.push({ type: 'html', content: remaining })
-    }
-
-    return result
-  }, [html, codeBlocks])
-
-  const handleClick = useCallback(async (event: React.MouseEvent<HTMLDivElement>) => {
-    const target = event.target as HTMLElement | null
-    const button = target?.closest<HTMLButtonElement>('[data-copy-code]')
-    if (!button) return
-
-    const text = button.getAttribute('data-copy-code')
-    if (!text) return
-
-    try {
-      await navigator.clipboard.writeText(text)
-      const original = button.textContent
-      button.textContent = 'Copied'
-      window.setTimeout(() => {
-        button.textContent = original
-      }, 1500)
-    } catch {
-      // Ignore clipboard errors
-    }
-  }, [])
-
-  if (codeBlocks.length === 0) {
-    const cleanHtml = enhanceMarkdownHtml(html)
-    return (
-      <div
-        className={proseClasses}
-        dangerouslySetInnerHTML={{ __html: cleanHtml }}
-        onClick={handleClick}
-      />
-    )
-  }
-
-  return (
-    <div className={proseClasses} onClick={handleClick}>
-      {parts.map((part, i) =>
-        part.type === 'html' ? (
-          <div key={i} dangerouslySetInnerHTML={{ __html: enhanceMarkdownHtml(part.content) }} />
-        ) : shouldRenderAsMermaid(part.block) ? (
-          <MermaidRenderer key={part.block.id} code={part.block.code} />
-        ) : (
-          <div key={part.block.id} className="my-4">
-            <CodeViewer
-              code={part.block.code}
-              language={part.block.language}
-            />
-          </div>
-        )
-      )}
-    </div>
-  )
-}

package/desktop/src/components/settings/ClaudeOfficialLogin.tsx

@@ -1,107 +0,0 @@
-// desktop/src/components/settings/ClaudeOfficialLogin.tsx
-//
-// 显示当前 Claude Official OAuth 登录状态,提供 Login / Logout 按钮。
-// 点击 Login 调 Tauri shell.open 打开浏览器走 OAuth flow;浏览器回 callback
-// 到 haha server 后,store 的 polling 自动刷新 UI 展示"已登录"。
-
-import { useEffect } from 'react'
-import { open as shellOpen } from '@tauri-apps/plugin-shell'
-import { useHahaOAuthStore } from '../../stores/hahaOAuthStore'
-import { useTranslation } from '../../i18n'
-
-export function ClaudeOfficialLogin() {
-  const t = useTranslation()
-  const {
-    status,
-    isLoading,
-    error,
-    fetchStatus,
-    login,
-    logout,
-    startPolling,
-    stopPolling,
-  } = useHahaOAuthStore()
-
-  useEffect(() => {
-    fetchStatus()
-    return () => stopPolling()
-  }, [fetchStatus, stopPolling])
-
-  const handleLogin = async () => {
-    try {
-      const { authorizeUrl } = await login()
-      try {
-        await shellOpen(authorizeUrl)
-        startPolling()
-      } catch (err) {
-        console.error('[ClaudeOfficialLogin] shellOpen failed:', err)
-        useHahaOAuthStore.setState({
-          error: t('settings.claudeOfficialLogin.openBrowserFailed'),
-        })
-      }
-    } catch {
-      // store.login() errors are already captured into store.error
-    }
-  }
-
-  if (status === null) {
-    if (error) {
-      return (
-        <div className="text-xs text-[var(--color-error)]">
-          {t('settings.claudeOfficialLogin.errorPrefix')}{error}
-        </div>
-      )
-    }
-    return (
-      <div className="text-xs text-[var(--color-text-tertiary)]">
-        {t('common.loading')}
-      </div>
-    )
-  }
-
-  if (status.loggedIn) {
-    const subTypeLabel = status.subscriptionType
-      ? status.subscriptionType.toUpperCase()
-      : t('settings.claudeOfficialLogin.subTypeUnknown')
-    return (
-      <div className="flex items-center gap-3 text-sm">
-        <span className="text-[var(--color-success)]">
-          ✓ {t('settings.claudeOfficialLogin.loggedInPrefix')} {subTypeLabel})
-        </span>
-        <button
-          type="button"
-          onClick={logout}
-          disabled={isLoading}
-          className="px-3 py-1 text-xs rounded-md border border-[var(--color-border-separator)] bg-[var(--color-surface)] hover:bg-[var(--color-surface-hover)] disabled:opacity-50 transition-colors"
-        >
-          {isLoading
-            ? t('settings.claudeOfficialLogin.logoutProcessing')
-            : t('settings.claudeOfficialLogin.logoutButton')}
-        </button>
-      </div>
-    )
-  }
-
-  return (
-    <div className="flex flex-col gap-2">
-      <div className="text-sm text-[var(--color-text-secondary)]">
-        {t('settings.claudeOfficialLogin.intro')}
-      </div>
-      <button
-        type="button"
-        onClick={handleLogin}
-        disabled={isLoading}
-        className="self-start rounded-md bg-[image:var(--gradient-btn-primary)] px-4 py-2 text-sm text-[var(--color-btn-primary-fg)] shadow-[var(--shadow-button-primary)] hover:brightness-105 disabled:opacity-50 transition-opacity"
-      >
-        {isLoading
-          ? t('settings.claudeOfficialLogin.loginStarting')
-          : t('settings.claudeOfficialLogin.loginButton')}
-      </button>
-      {error && (
-        <div className="text-xs text-[var(--color-error)]">
-          {t('settings.claudeOfficialLogin.errorPrefix')}{error}
-        </div>
-      )}
-    </div>
-  )
-}

package/desktop/src/components/shared/Button.tsx

@@ -1,63 +0,0 @@
-import type { ButtonHTMLAttributes, ReactNode } from 'react'
-
-type ButtonVariant = 'primary' | 'secondary' | 'danger' | 'ghost'
-
-type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
-  variant?: ButtonVariant
-  size?: 'sm' | 'md' | 'lg'
-  loading?: boolean
-  icon?: ReactNode
-}
-
-const variantStyles: Record<ButtonVariant, string> = {
-  primary:
-    'bg-[image:var(--gradient-btn-primary)] text-[var(--color-btn-primary-fg)] shadow-[var(--shadow-button-primary)] hover:bg-[image:var(--gradient-btn-primary-hover)] hover:brightness-105 active:translate-y-[1px]',
-  secondary:
-    'bg-[var(--color-surface)] text-[var(--color-text-primary)] border border-[var(--color-border)] hover:bg-[var(--color-surface-hover)]',
-  danger:
-    'bg-[var(--color-error)] text-white hover:opacity-90',
-  ghost:
-    'bg-transparent text-[var(--color-text-secondary)] hover:bg-[var(--color-surface-hover)] hover:text-[var(--color-text-primary)]',
-}
-
-const sizeStyles = {
-  sm: 'px-2 py-1 text-xs',
-  md: 'px-4 py-2 text-sm',
-  lg: 'px-5 py-2.5 text-sm',
-}
-
-export function Button({
-  variant = 'primary',
-  size = 'md',
-  loading = false,
-  icon,
-  disabled,
-  children,
-  className = '',
-  ...props
-}: ButtonProps) {
-  return (
-    <button
-      disabled={disabled || loading}
-      className={`
-        inline-flex items-center justify-center gap-1.5 rounded-[var(--radius-md)]
-        font-medium transition-colors duration-150 cursor-pointer
-        disabled:opacity-50 disabled:cursor-not-allowed
-        ${variantStyles[variant]} ${sizeStyles[size]} ${className}
-      `}
-      {...props}
-    >
-      {loading ? <Spinner /> : icon}
-      {children}
-    </button>
-  )
-}
-
-function Spinner() {
-  return (
-    <svg className="animate-spin h-4 w-4" viewBox="0 0 24 24" fill="none">
-      <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
-      <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
-    </svg>
-  )
-}

package/desktop/src/components/shared/CopyButton.tsx

@@ -1,58 +0,0 @@
-import { useEffect, useState } from 'react'
-import { copyTextToClipboard } from '../chat/clipboard'
-
-type Props = {
-  text: string
-  label?: string
-  copiedLabel?: string
-  displayLabel?: string
-  displayCopiedLabel?: string
-  className?: string
-}
-
-export function CopyButton({
-  text,
-  label = 'Copy',
-  copiedLabel = 'Copied',
-  displayLabel,
-  displayCopiedLabel,
-  className = '',
-}: Props) {
-  const [copied, setCopied] = useState(false)
-
-  useEffect(() => {
-    if (!copied) return
-    const timer = window.setTimeout(() => setCopied(false), 1500)
-    return () => window.clearTimeout(timer)
-  }, [copied])
-
-  const handleCopy = async () => {
-    try {
-      const ok = await copyTextToClipboard(text)
-      if (!ok) {
-        setCopied(false)
-        return
-      }
-      setCopied(true)
-    } catch {
-      setCopied(false)
-    }
-  }
-
-  const currentLabel = copied ? copiedLabel : label
-  const buttonText = copied
-    ? (displayCopiedLabel ?? copiedLabel)
-    : (displayLabel ?? label)
-
-  return (
-    <button
-      type="button"
-      onClick={handleCopy}
-      className={className}
-      aria-label={currentLabel}
-      title={currentLabel}
-    >
-      {buttonText}
-    </button>
-  )
-}