youngkingdom/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-04-19 10:17:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): button import

Browse Source
This commit is contained in:
JzoNg
2026-04-15 15:23:50 +08:00
parent 40632589a2
commit 7f5bbe0ee3
18 changed files with 31 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.agents/skills/frontend-testing/references/mocking.md
View File

@ -20,11 +20,11 @@
```typescript
// ❌ WRONG: Don't mock base components
vi.mock('@/app/components/base/loading', () => () => <div>Loading</div>)
vi.mock('@/app/components/base/button', () => ({ children }: any) => <button>{children}</button>)
vi.mock('@/app/components/base/ui/button', () => ({ children }: any) => <button>{children}</button>)
// ✅ CORRECT: Import and use real base components
import Loading from '@/app/components/base/loading'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
// They will render normally in tests
```

2
web/app/components/app/app-publisher/sections.tsx
View File

@ -234,7 +234,7 @@ export const PublisherSummarySection = ({
/>
<TooltipContent
placement="top"
popupClassName="w-[180px]"
className="w-[180px]"
>
{t(workflowTypeSwitchConfig.tipKey, { ns: 'workflow' })}
</TooltipContent>

2
web/app/components/evaluation/components/batch-test-panel/index.tsx
View File

@ -2,7 +2,7 @@
import type { BatchTestTab, EvaluationResourceProps } from '../../types'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import { toast } from '@/app/components/base/ui/toast'
import { useSaveEvaluationConfigMutation } from '@/service/use-evaluation'
import { cn } from '@/utils/classnames'

2
web/app/components/evaluation/components/batch-test-panel/input-fields-tab.tsx
View File

@ -1,6 +1,6 @@
import type { EvaluationResourceProps } from '../../types'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import { getEvaluationMockConfig } from '../../mock'
import InputFieldsRequirements from './input-fields/input-fields-requirements'
import UploadRunPopover from './input-fields/upload-run-popover'

2
web/app/components/evaluation/components/batch-test-panel/input-fields/upload-run-popover.tsx
View File

@ -2,7 +2,7 @@ import type { ChangeEvent, DragEvent } from 'react'
import type { InputField } from './input-fields-utils'
import { useRef } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import {
Popover,
PopoverContent,

2
web/app/components/evaluation/components/conditions-section/condition-group.tsx
View File

@ -8,7 +8,7 @@ import type {
} from '../../types'
import { useMemo } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import Input from '@/app/components/base/input'
import {
Select,

2
web/app/components/evaluation/components/metric-section/builtin-metric-card.tsx
View File

@ -4,7 +4,7 @@ import type { EvaluationMetric, EvaluationResourceProps } from '../../types'
import type { NodeInfo } from '@/types/evaluation'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import {
DropdownMenu,
DropdownMenuContent,

2
web/app/components/evaluation/components/metric-section/custom-metric-card.tsx
View File

@ -3,7 +3,7 @@
import type { EvaluationMetric, EvaluationResourceProps } from '../../types'
import { useTranslation } from 'react-i18next'
import Badge from '@/app/components/base/badge'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import { cn } from '@/utils/classnames'
import { isCustomMetricConfigured, useEvaluationStore } from '../../store'
import CustomMetricEditorCard from '../custom-metric-editor'

11
web/app/components/evaluation/components/metric-selector/index.tsx
View File

@ -4,8 +4,8 @@ import type { ChangeEvent } from 'react'
import type { MetricSelectorProps } from './types'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import Input from '@/app/components/base/input'
import { Button } from '@/app/components/base/ui/button'
import {
Popover,
PopoverContent,
@ -21,7 +21,6 @@ import { useMetricSelectorData } from './use-metric-selector-data'
const MetricSelector = ({
resourceType,
resourceId,
triggerVariant = 'ghost-accent',
triggerClassName,
triggerStyle = 'button',
}: MetricSelectorProps) => {
@ -69,14 +68,14 @@ const MetricSelector = ({
render={(
triggerStyle === 'text'
? (
<button type="button" className={cn('inline-flex items-center text-text-accent system-sm-medium', triggerClassName)}>
<span aria-hidden="true" className="i-ri-add-line mr-1 h-4 w-4" />
<button type="button" className={cn('inline-flex items-center system-sm-medium text-text-accent', triggerClassName)}>
<span aria-hidden="true" className="mr-1 i-ri-add-line h-4 w-4" />
{t('metrics.add')}
</button>
)
: (
<Button variant={triggerVariant} className={triggerClassName}>
<span aria-hidden="true" className="i-ri-add-line mr-1 h-4 w-4" />
<Button variant="ghost-accent" className={triggerClassName}>
<span aria-hidden="true" className="mr-1 i-ri-add-line h-4 w-4" />
{t('metrics.add')}
</Button>
)

1
web/app/components/evaluation/components/metric-selector/types.ts
View File

@ -2,7 +2,6 @@ import type { EvaluationMetric, EvaluationResourceProps, MetricOption } from '..
import type { NodeInfo } from '@/types/evaluation'
export type MetricSelectorProps = EvaluationResourceProps & {
triggerVariant?: 'primary' | 'warning' | 'secondary' | 'secondary-accent' | 'ghost' | 'ghost-accent' | 'tertiary'
triggerClassName?: string
triggerStyle?: 'button' | 'text'
}

2
web/app/components/evaluation/components/pipeline/pipeline-batch-actions.tsx
View File

@ -3,7 +3,7 @@
import type { EvaluationResourceProps } from '../../types'
import type { InputField } from '../batch-test-panel/input-fields/input-fields-utils'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import { getEvaluationMockConfig } from '../../mock'
import { isEvaluationRunnable, useEvaluationResource } from '../../store'
import UploadRunPopover from '../batch-test-panel/input-fields/upload-run-popover'

2
web/app/components/snippets/components/panel/index.tsx
View File

@ -4,7 +4,7 @@ import type { SortableItem } from '@/app/components/rag-pipeline/components/pane
import type { SnippetInputField } from '@/models/snippet'
import { memo, useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import FieldListContainer from '@/app/components/rag-pipeline/components/panel/input-field/field-list/field-list-container'
type SnippetInputFieldPanelProps = {

2
web/app/components/snippets/components/publish-menu.tsx
View File

@ -2,7 +2,7 @@
import type { SnippetDetailUIModel } from '@/models/snippet'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import ShortcutsName from '@/app/components/workflow/shortcuts-name'
const PublishMenu = ({

18
web/app/components/snippets/components/snippet-import-dsl-dialog.tsx
View File

@ -4,8 +4,8 @@ import { useDebounceFn, useKeyPress } from 'ahooks'
import { useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import Uploader from '@/app/components/app/create-from-dsl-modal/uploader'
import Button from '@/app/components/base/button'
import Input from '@/app/components/base/input'
import { Button } from '@/app/components/base/ui/button'
import { Dialog, DialogCloseButton, DialogContent, DialogTitle } from '@/app/components/base/ui/dialog'
import { toast } from '@/app/components/base/ui/toast'
import {
@ -163,14 +163,14 @@ const SnippetImportDSLDialog = ({
<>
<Dialog open={show} onOpenChange={open => !open && onClose()}>
<DialogContent className="w-[520px] p-0">
<div className="flex items-center justify-between pb-3 pl-6 pr-5 pt-6">
<DialogTitle className="text-text-primary title-2xl-semi-bold">
<div className="flex items-center justify-between pt-6 pr-5 pb-3 pl-6">
<DialogTitle className="title-2xl-semi-bold text-text-primary">
{t('importFromDSL', { ns: 'app' })}
</DialogTitle>
<DialogCloseButton className="right-5 top-6 h-8 w-8" />
<DialogCloseButton className="top-6 right-5 h-8 w-8" />
</div>
<div className="flex h-9 items-center space-x-6 border-b border-divider-subtle px-6 text-text-tertiary system-md-semibold">
<div className="flex h-9 items-center space-x-6 border-b border-divider-subtle px-6 system-md-semibold text-text-tertiary">
{[
{ key: SnippetImportDSLTab.FromFile, label: t('importFromDSLFile', { ns: 'app' }) },
{ key: SnippetImportDSLTab.FromURL, label: t('importFromDSLUrl', { ns: 'app' }) },
@ -202,7 +202,7 @@ const SnippetImportDSLDialog = ({
)}
{currentTab === SnippetImportDSLTab.FromURL && (
<div>
<div className="mb-1 text-text-secondary system-md-semibold">DSL URL</div>
<div className="mb-1 system-md-semibold text-text-secondary">DSL URL</div>
<Input
placeholder={t('importFromDSLUrlPlaceholder', { ns: 'app' }) || ''}
value={dslUrlValue}
@ -232,10 +232,10 @@ const SnippetImportDSLDialog = ({
<Dialog open={showVersionMismatchDialog} onOpenChange={open => !open && setShowVersionMismatchDialog(false)}>
<DialogContent className="w-[480px]">
<div className="flex flex-col items-start gap-2 self-stretch pb-4">
<DialogTitle className="text-text-primary title-2xl-semi-bold">
<DialogTitle className="title-2xl-semi-bold text-text-primary">
{t('newApp.appCreateDSLErrorTitle', { ns: 'app' })}
</DialogTitle>
<div className="flex grow flex-col text-text-secondary system-md-regular">
<div className="flex grow flex-col system-md-regular text-text-secondary">
<div>{t('newApp.appCreateDSLErrorPart1', { ns: 'app' })}</div>
<div>{t('newApp.appCreateDSLErrorPart2', { ns: 'app' })}</div>
<br />
@ -253,7 +253,7 @@ const SnippetImportDSLDialog = ({
<Button variant="secondary" disabled={isImporting} onClick={() => setShowVersionMismatchDialog(false)}>
{t('newApp.Cancel', { ns: 'app' })}
</Button>
<Button variant="primary" destructive disabled={isImporting} onClick={handleConfirmImport}>
<Button variant="primary" tone="destructive" disabled={isImporting} onClick={handleConfirmImport}>
{t('newApp.Confirm', { ns: 'app' })}
</Button>
</div>

2
web/app/components/snippets/components/snippet-run-panel.tsx
View File

@ -12,7 +12,7 @@ import {
useState,
} from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import { useCheckInputsForms } from '@/app/components/base/chat/chat/check-input-forms-hooks'
import { getProcessedInputs } from '@/app/components/base/chat/chat/utils'
import Loading from '@/app/components/base/loading'

4
web/app/components/workflow/block-selector/snippets/index.tsx
View File

@ -52,7 +52,7 @@ const LoadingSkeleton = () => {
</div>
))}
</div>
<div className="pointer-events-none absolute inset-0 bg-gradient-to-b from-components-panel-bg-transparent to-background-default-subtle" />
<div className="pointer-events-none absolute inset-0 bg-linear-to-b from-components-panel-bg-transparent to-background-default-subtle" />
</div>
)
}
@ -147,7 +147,7 @@ const Snippets = ({
<TooltipContent
placement="left-start"
variant="plain"
popupClassName="!bg-transparent !p-0"
className="bg-transparent! p-0!"
>
<SnippetDetailCard snippet={item} />
</TooltipContent>

2
web/app/components/workflow/block-selector/snippets/snippet-empty-state.tsx
View File

@ -1,6 +1,6 @@
import type { FC } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
type SnippetEmptyStateProps = {
onCreate: () => void

2
web/app/components/workflow/create-snippet-dialog.tsx
View File

@ -8,7 +8,7 @@ import { useCallback, useState } from 'react'
import { useTranslation } from 'react-i18next'
import AppIcon from '@/app/components/base/app-icon'
import AppIconPicker from '@/app/components/base/app-icon-picker'
import Button from '@/app/components/base/button'
import { Button } from '@/app/components/base/ui/button'
import Input from '@/app/components/base/input'
import Textarea from '@/app/components/base/textarea'
import { Dialog, DialogCloseButton, DialogContent, DialogPortal, DialogTitle } from '@/app/components/base/ui/dialog'