Merge remote-tracking branch 'origin/main' into feat/support-agent-sandbox

# Conflicts:
#	api/uv.lock
#	web/app/components/apps/__tests__/app-card.spec.tsx
#	web/app/components/apps/__tests__/list.spec.tsx
#	web/app/components/datasets/create/__tests__/index.spec.tsx
#	web/app/components/datasets/metadata/metadata-dataset/__tests__/dataset-metadata-drawer.spec.tsx
#	web/app/components/plugins/readme-panel/__tests__/index.spec.tsx
#	web/app/components/rag-pipeline/__tests__/index.spec.tsx
#	web/app/components/rag-pipeline/hooks/__tests__/index.spec.ts
#	web/eslint-suppressions.json

web/app/components/plugins/card/base/__tests__/card-icon.spec.tsx

@@ -0,0 +1,61 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import Icon from '../card-icon'
+
+vi.mock('@/app/components/base/app-icon', () => ({
+  default: ({ icon, background }: { icon: string, background: string }) => (
+    <div data-testid="app-icon" data-icon={icon} data-bg={background} />
+  ),
+}))
+
+vi.mock('@/app/components/base/icons/src/vender/other', () => ({
+  Mcp: () => <span data-testid="mcp-icon" />,
+}))
+
+vi.mock('@/utils/mcp', () => ({
+  shouldUseMcpIcon: () => false,
+}))
+
+describe('Icon', () => {
+  it('renders string src as background image', () => {
+    const { container } = render(<Icon src="https://example.com/icon.png" />)
+    const el = container.firstChild as HTMLElement
+    expect(el.style.backgroundImage).toContain('https://example.com/icon.png')
+  })
+
+  it('renders emoji src using AppIcon', () => {
+    render(<Icon src={{ content: '🔍', background: '#fff' }} />)
+    expect(screen.getByTestId('app-icon')).toBeInTheDocument()
+    expect(screen.getByTestId('app-icon')).toHaveAttribute('data-icon', '🔍')
+    expect(screen.getByTestId('app-icon')).toHaveAttribute('data-bg', '#fff')
+  })
+
+  it('shows check icon when installed', () => {
+    const { container } = render(<Icon src="icon.png" installed />)
+    expect(container.querySelector('.bg-state-success-solid')).toBeInTheDocument()
+  })
+
+  it('shows close icon when installFailed', () => {
+    const { container } = render(<Icon src="icon.png" installFailed />)
+    expect(container.querySelector('.bg-state-destructive-solid')).toBeInTheDocument()
+  })
+
+  it('does not show status icons by default', () => {
+    const { container } = render(<Icon src="icon.png" />)
+    expect(container.querySelector('.bg-state-success-solid')).not.toBeInTheDocument()
+    expect(container.querySelector('.bg-state-destructive-solid')).not.toBeInTheDocument()
+  })
+
+  it('applies custom className', () => {
+    const { container } = render(<Icon src="icon.png" className="my-class" />)
+    const el = container.firstChild as HTMLElement
+    expect(el.className).toContain('my-class')
+  })
+
+  it('applies correct size class', () => {
+    const { container } = render(<Icon src="icon.png" size="small" />)
+    const el = container.firstChild as HTMLElement
+    expect(el.className).toContain('w-8')
+    expect(el.className).toContain('h-8')
+  })
+})

web/app/components/plugins/card/base/__tests__/corner-mark.spec.tsx

@@ -0,0 +1,27 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import CornerMark from '../corner-mark'
+
+vi.mock('../../../../base/icons/src/vender/plugin', () => ({
+  LeftCorner: ({ className }: { className: string }) => <svg data-testid="left-corner" className={className} />,
+}))
+
+describe('CornerMark', () => {
+  it('renders the text content', () => {
+    render(<CornerMark text="NEW" />)
+    expect(screen.getByText('NEW')).toBeInTheDocument()
+  })
+
+  it('renders the LeftCorner icon', () => {
+    render(<CornerMark text="BETA" />)
+    expect(screen.getByTestId('left-corner')).toBeInTheDocument()
+  })
+
+  it('renders with absolute positioning', () => {
+    const { container } = render(<CornerMark text="TAG" />)
+    const wrapper = container.firstChild as HTMLElement
+    expect(wrapper.className).toContain('absolute')
+    expect(wrapper.className).toContain('right-0')
+    expect(wrapper.className).toContain('top-0')
+  })
+})

web/app/components/plugins/card/base/__tests__/description.spec.tsx

@@ -0,0 +1,37 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+import Description from '../description'
+
+describe('Description', () => {
+  it('renders description text', () => {
+    render(<Description text="A great plugin" descriptionLineRows={1} />)
+    expect(screen.getByText('A great plugin')).toBeInTheDocument()
+  })
+
+  it('applies truncate class for 1 line', () => {
+    render(<Description text="Single line" descriptionLineRows={1} />)
+    const el = screen.getByText('Single line')
+    expect(el.className).toContain('truncate')
+    expect(el.className).toContain('h-4')
+  })
+
+  it('applies line-clamp-2 class for 2 lines', () => {
+    render(<Description text="Two lines" descriptionLineRows={2} />)
+    const el = screen.getByText('Two lines')
+    expect(el.className).toContain('line-clamp-2')
+    expect(el.className).toContain('h-8')
+  })
+
+  it('applies line-clamp-3 class for 3 lines', () => {
+    render(<Description text="Three lines" descriptionLineRows={3} />)
+    const el = screen.getByText('Three lines')
+    expect(el.className).toContain('line-clamp-3')
+    expect(el.className).toContain('h-12')
+  })
+
+  it('applies custom className', () => {
+    render(<Description text="test" descriptionLineRows={1} className="mt-2" />)
+    const el = screen.getByText('test')
+    expect(el.className).toContain('mt-2')
+  })
+})

web/app/components/plugins/card/base/__tests__/download-count.spec.tsx

@@ -0,0 +1,28 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import DownloadCount from '../download-count'
+
+vi.mock('@/utils/format', () => ({
+  formatNumber: (n: number) => {
+    if (n >= 1000)
+      return `${(n / 1000).toFixed(1)}k`
+    return String(n)
+  },
+}))
+
+describe('DownloadCount', () => {
+  it('renders formatted download count', () => {
+    render(<DownloadCount downloadCount={1500} />)
+    expect(screen.getByText('1.5k')).toBeInTheDocument()
+  })
+
+  it('renders small numbers directly', () => {
+    render(<DownloadCount downloadCount={42} />)
+    expect(screen.getByText('42')).toBeInTheDocument()
+  })
+
+  it('renders zero download count', () => {
+    render(<DownloadCount downloadCount={0} />)
+    expect(screen.getByText('0')).toBeInTheDocument()
+  })
+})

web/app/components/plugins/card/base/__tests__/org-info.spec.tsx

@@ -0,0 +1,34 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+import OrgInfo from '../org-info'
+
+describe('OrgInfo', () => {
+  it('renders package name', () => {
+    render(<OrgInfo packageName="my-plugin" />)
+    expect(screen.getByText('my-plugin')).toBeInTheDocument()
+  })
+
+  it('renders org name with separator when provided', () => {
+    render(<OrgInfo orgName="dify" packageName="search-tool" />)
+    expect(screen.getByText('dify')).toBeInTheDocument()
+    expect(screen.getByText('/')).toBeInTheDocument()
+    expect(screen.getByText('search-tool')).toBeInTheDocument()
+  })
+
+  it('does not render org name or separator when orgName is not provided', () => {
+    render(<OrgInfo packageName="standalone" />)
+    expect(screen.queryByText('/')).not.toBeInTheDocument()
+    expect(screen.getByText('standalone')).toBeInTheDocument()
+  })
+
+  it('applies custom className', () => {
+    const { container } = render(<OrgInfo packageName="pkg" className="custom-class" />)
+    expect((container.firstChild as HTMLElement).className).toContain('custom-class')
+  })
+
+  it('applies packageNameClassName to package name element', () => {
+    render(<OrgInfo packageName="pkg" packageNameClassName="w-auto" />)
+    const pkgEl = screen.getByText('pkg')
+    expect(pkgEl.className).toContain('w-auto')
+  })
+})

web/app/components/plugins/card/base/__tests__/placeholder.spec.tsx

@@ -0,0 +1,71 @@
+import { render, screen } from '@testing-library/react'
+import * as React from 'react'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+vi.mock('../title', () => ({
+  default: ({ title }: { title: string }) => <span data-testid="title">{title}</span>,
+}))
+
+vi.mock('../../../../base/icons/src/vender/other', () => ({
+  Group: ({ className }: { className: string }) => <span data-testid="group-icon" className={className} />,
+}))
+
+vi.mock('@/utils/classnames', () => ({
+  cn: (...args: unknown[]) => args.filter(Boolean).join(' '),
+}))
+
+describe('Placeholder', () => {
+  let Placeholder: (typeof import('../placeholder'))['default']
+
+  beforeEach(async () => {
+    vi.clearAllMocks()
+    const mod = await import('../placeholder')
+    Placeholder = mod.default
+  })
+
+  it('should render skeleton rows', () => {
+    const { container } = render(<Placeholder wrapClassName="w-full" />)
+
+    expect(container.querySelectorAll('.gap-2').length).toBeGreaterThanOrEqual(1)
+  })
+
+  it('should render group icon placeholder', () => {
+    render(<Placeholder wrapClassName="w-full" />)
+
+    expect(screen.getByTestId('group-icon')).toBeInTheDocument()
+  })
+
+  it('should render loading filename when provided', () => {
+    render(<Placeholder wrapClassName="w-full" loadingFileName="test-plugin.zip" />)
+
+    expect(screen.getByTestId('title')).toHaveTextContent('test-plugin.zip')
+  })
+
+  it('should render skeleton rectangles when no filename', () => {
+    const { container } = render(<Placeholder wrapClassName="w-full" />)
+
+    expect(container.querySelectorAll('.bg-text-quaternary').length).toBeGreaterThanOrEqual(1)
+  })
+})
+
+describe('LoadingPlaceholder', () => {
+  let LoadingPlaceholder: (typeof import('../placeholder'))['LoadingPlaceholder']
+
+  beforeEach(async () => {
+    vi.clearAllMocks()
+    const mod = await import('../placeholder')
+    LoadingPlaceholder = mod.LoadingPlaceholder
+  })
+
+  it('should render as a simple div with background', () => {
+    const { container } = render(<LoadingPlaceholder />)
+
+    expect(container.firstChild).toBeTruthy()
+  })
+
+  it('should accept className prop', () => {
+    const { container } = render(<LoadingPlaceholder className="mt-3 w-[420px]" />)
+
+    expect(container.firstChild).toBeTruthy()
+  })
+})

web/app/components/plugins/card/base/__tests__/title.spec.tsx

@@ -0,0 +1,21 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+import Title from '../title'
+
+describe('Title', () => {
+  it('renders the title text', () => {
+    render(<Title title="Test Plugin" />)
+    expect(screen.getByText('Test Plugin')).toBeInTheDocument()
+  })
+
+  it('renders with truncate class for long text', () => {
+    render(<Title title="A very long title that should be truncated" />)
+    const el = screen.getByText('A very long title that should be truncated')
+    expect(el.className).toContain('truncate')
+  })
+
+  it('renders empty string without error', () => {
+    const { container } = render(<Title title="" />)
+    expect(container.firstChild).toBeInTheDocument()
+  })
+})