hz/ebiz-dify-ai
1
0
Fork 0
mirror of http://112.124.100.131/huang.ze/ebiz-dify-ai.git synced 2025-12-10 19:36:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: new icons (#5412)

Browse Source
This commit is contained in:
zxhlyh
2024-06-20 11:05:08 +08:00
committed by GitHub
parent 0105129fa8
commit 2328ed8ffa
338 changed files with 880 additions and 3669 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -12,6 +12,9 @@ import type {
OffsetOptions,
Placement,
} from '@floating-ui/react'
import {
RiSearchLine,
} from '@remixicon/react'
import type { BlockEnum, OnSelectBlock } from '../types'
import Tabs from './tabs'
import {
@@ -21,7 +24,6 @@ import {
} from '@/app/components/base/portal-to-follow-elem'
import {
Plus02,
SearchLg,
} from '@/app/components/base/icons/src/vender/line/general'
import { XCircle } from '@/app/components/base/icons/src/vender/solid/general'
@@ -114,7 +116,7 @@ const NodeSelector: FC<NodeSelectorProps> = ({
className='flex items-center px-2 rounded-lg bg-gray-100'
onClick={e => e.stopPropagation()}
>
<SearchLg className='shrink-0 ml-[1px] mr-[5px] w-3.5 h-3.5 text-gray-400' />
<RiSearchLine className='shrink-0 ml-[1px] mr-[5px] w-3.5 h-3.5 text-gray-400' />
<input
value={searchText}
className='grow px-0.5 py-[7px] text-[13px] text-gray-700 bg-transparent appearance-none outline-none caret-primary-600 placeholder:text-gray-400'

4
web/app/components/workflow/features.tsx
View File

@@ -3,13 +3,13 @@ import {
useCallback,
} from 'react'
import { useTranslation } from 'react-i18next'
import { RiCloseLine } from '@remixicon/react'
import { useStore } from './store'
import {
useIsChatMode,
useNodesReadOnly,
useNodesSyncDraft,
} from './hooks'
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
import {
FeaturesChoose,
FeaturesPanel,
@@ -46,7 +46,7 @@ const Features = () => {
className='flex items-center justify-center w-6 h-6 cursor-pointer'
onClick={() => setShowFeaturesPanel(false)}
>
<XClose className='w-4 h-4 text-gray-500' />
<RiCloseLine className='w-4 h-4 text-gray-500' />
</div>
</div>
</div>

10
web/app/components/workflow/header/checklist.tsx
View File

@@ -7,6 +7,10 @@ import {
useEdges,
useNodes,
} from 'reactflow'
import {
RiCloseLine,
RiListCheck3,
} from '@remixicon/react'
import cn from 'classnames'
import BlockIcon from '../block-icon'
import {
@@ -23,9 +27,7 @@ import {
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import {
Checklist,
ChecklistSquare,
XClose,
} from '@/app/components/base/icons/src/vender/line/general'
import { AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback'
@@ -66,7 +68,7 @@ const WorkflowChecklist = ({
${open && 'bg-primary-50'}
`}
>
<Checklist
<RiListCheck3
className={`
w-4 h-4 group-hover:text-primary-600
${open ? 'text-primary-600' : 'text-gray-500'}`
@@ -95,7 +97,7 @@ const WorkflowChecklist = ({
className='shrink-0 flex items-center justify-center w-6 h-6 cursor-pointer'
onClick={() => setOpen(false)}
>
<XClose className='w-4 h-4 text-gray-500' />
<RiCloseLine className='w-4 h-4 text-gray-500' />
</div>
</div>
<div className='py-2'>

10
web/app/components/workflow/header/run-and-history.tsx
View File

@@ -2,6 +2,10 @@ import type { FC } from 'react'
import { memo } from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import {
RiLoader2Line,
RiPlayLargeFill,
} from '@remixicon/react'
import { useStore } from '../store'
import {
useIsChatMode,
@@ -11,10 +15,8 @@ import {
import { WorkflowRunningStatus } from '../types'
import ViewHistory from './view-history'
import {
Play,
StopCircle,
} from '@/app/components/base/icons/src/vender/line/mediaAndDevices'
import { Loading02 } from '@/app/components/base/icons/src/vender/line/general'
import { MessagePlay } from '@/app/components/base/icons/src/vender/line/communication'
const RunMode = memo(() => {
@@ -38,13 +40,13 @@ const RunMode = memo(() => {
isRunning
? (
<>
<Loading02 className='mr-1 w-4 h-4 animate-spin' />
<RiLoader2Line className='mr-1 w-4 h-4 animate-spin' />
{t('workflow.common.running')}
</>
)
: (
<>
<Play className='mr-1 w-4 h-4' />
<RiPlayLargeFill className='mr-1 w-4 h-4' />
{t('workflow.common.run')}
</>
)

14
web/app/components/workflow/header/view-history.tsx
View File

@@ -6,6 +6,11 @@ import cn from 'classnames'
import useSWR from 'swr'
import { useTranslation } from 'react-i18next'
import { useShallow } from 'zustand/react/shallow'
import {
RiCheckboxCircleLine,
RiCloseLine,
RiErrorWarningLine,
} from '@remixicon/react'
import {
useIsChatMode,
useNodesInteractions,
@@ -25,8 +30,7 @@ import {
ClockPlay,
ClockPlaySlim,
} from '@/app/components/base/icons/src/vender/line/time'
import { CheckCircle, XClose } from '@/app/components/base/icons/src/vender/line/general'
import { AlertCircle, AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback'
import { AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback'
import {
fetcChatRunHistory,
fetchWorkflowRunHistory,
@@ -131,7 +135,7 @@ const ViewHistory = ({
setOpen(false)
}}
>
<XClose className='w-4 h-4 text-gray-500' />
<RiCloseLine className='w-4 h-4 text-gray-500' />
</div>
</div>
{
@@ -180,12 +184,12 @@ const ViewHistory = ({
}
{
!isChatMode && item.status === WorkflowRunningStatus.Failed && (
<AlertCircle className='mt-0.5 mr-1.5 w-3.5 h-3.5 text-[#F04438]' />
<RiErrorWarningLine className='mt-0.5 mr-1.5 w-3.5 h-3.5 text-[#F04438]' />
)
}
{
!isChatMode && item.status === WorkflowRunningStatus.Succeeded && (
<CheckCircle className='mt-0.5 mr-1.5 w-3.5 h-3.5 text-[#12B76A]' />
<RiCheckboxCircleLine className='mt-0.5 mr-1.5 w-3.5 h-3.5 text-[#12B76A]' />
)
}
<div>

6
web/app/components/workflow/nodes/_base/components/add-button.tsx
View File

@@ -2,7 +2,9 @@
import type { FC } from 'react'
import React from 'react'
import cn from 'classnames'
import { Plus } from '@/app/components/base/icons/src/vender/line/general'
import {
RiAddLine,
} from '@remixicon/react'
type Props = {
className?: string
@@ -20,7 +22,7 @@ const AddButton: FC<Props> = ({
className={cn(className, 'flex items-center h-7 justify-center bg-gray-100 hover:bg-gray-200 rounded-lg cursor-pointer text-xs font-medium text-gray-700 space-x-1')}
onClick={onClick}
>
<Plus className='w-3.5 h-3.5' />
<RiAddLine className='w-3.5 h-3.5' />
<div>{text}</div>
</div>
)

8
web/app/components/workflow/nodes/_base/components/before-run-form/form-item.tsx
View File

@@ -3,6 +3,9 @@ import type { FC } from 'react'
import React, { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import produce from 'immer'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import type { InputVar } from '../../../../types'
import { BlockEnum, InputVarType } from '../../../../types'
import CodeEditor from '../editor/code-editor'
@@ -11,7 +14,6 @@ import TextEditor from '../editor/text-editor'
import Select from '@/app/components/base/select'
import TextGenerationImageUploader from '@/app/components/base/image-uploader/text-generation-image-uploader'
import { Resolution } from '@/types/app'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import { useFeatures } from '@/app/components/base/features/hooks'
import { VarBlockIcon } from '@/app/components/workflow/block-icon'
import { Line3 } from '@/app/components/base/icons/src/public/common'
@@ -174,7 +176,7 @@ const FormItem: FC<Props> = ({
title={<span>JSON</span>}
headerRight={
(value as any).length > 1
? (<Trash03
? (<RiDeleteBinLine
onClick={handleArrayItemRemove(index)}
className='mr-1 w-3.5 h-3.5 text-gray-500 cursor-pointer'
/>)
@@ -200,7 +202,7 @@ const FormItem: FC<Props> = ({
onChange={handleArrayItemChange(index)}
headerRight={
(value as any).length > 1
? (<Trash03
? (<RiDeleteBinLine
onClick={handleArrayItemRemove(index)}
className='mr-1 w-3.5 h-3.5 text-gray-500 cursor-pointer'
/>)

9
web/app/components/workflow/nodes/_base/components/before-run-form/index.tsx
View File

@@ -3,11 +3,14 @@ import type { FC } from 'react'
import React, { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import {
RiCloseLine,
RiLoader2Line,
} from '@remixicon/react'
import type { Props as FormProps } from './form'
import Form from './form'
import Button from '@/app/components/base/button'
import { StopCircle } from '@/app/components/base/icons/src/vender/solid/mediaAndDevices'
import { Loading02, XClose } from '@/app/components/base/icons/src/vender/line/general'
import Split from '@/app/components/workflow/nodes/_base/components/split'
import { InputVarType, NodeRunningStatus } from '@/app/components/workflow/types'
import ResultPanel from '@/app/components/workflow/run/result-panel'
@@ -114,7 +117,7 @@ const BeforeRunForm: FC<BeforeRunFormProps> = ({
{t(`${i18nPrefix}.testRun`)} {nodeName}
</div>
<div className='ml-2 shrink-0 p-1 cursor-pointer' onClick={onHide}>
<XClose className='w-4 h-4 text-gray-500 ' />
<RiCloseLine className='w-4 h-4 text-gray-500 ' />
</div>
</div>
@@ -142,7 +145,7 @@ const BeforeRunForm: FC<BeforeRunFormProps> = ({
</div>
)}
<Button disabled={!isFileLoaded || isRunning} variant='primary' className='w-0 grow !h-8 flex items-center space-x-2 text-[13px]' onClick={handleRun}>
{isRunning && <Loading02 className='animate-spin w-4 h-4 text-white' />}
{isRunning && <RiLoader2Line className='animate-spin w-4 h-4 text-white' />}
<div>{t(`${i18nPrefix}.${isRunning ? 'running' : 'startRun'}`)}</div>
</Button>
</div>

5
web/app/components/workflow/nodes/_base/components/editor/base.tsx
View File

@@ -5,7 +5,10 @@ import copy from 'copy-to-clipboard'
import cn from 'classnames'
import Wrap from './wrap'
import PromptEditorHeightResizeWrap from '@/app/components/app/configuration/config-prompt/prompt-editor-height-resize-wrap'
import { Clipboard, ClipboardCheck } from '@/app/components/base/icons/src/vender/line/files'
import {
Clipboard,
ClipboardCheck,
} from '@/app/components/base/icons/src/vender/line/files'
import ToggleExpandBtn from '@/app/components/workflow/nodes/_base/components/toggle-expand-btn'
import useToggleExpend from '@/app/components/workflow/nodes/_base/hooks/use-toggle-expend'

10
web/app/components/workflow/nodes/_base/components/field.tsx
View File

@@ -2,11 +2,13 @@
import type { FC } from 'react'
import React from 'react'
import cn from 'classnames'
import {
RiArrowDownSLine,
RiQuestionLine,
} from '@remixicon/react'
import { useBoolean } from 'ahooks'
import type { DefaultTFuncReturn } from 'i18next'
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows'
type Props = {
className?: string
@@ -42,7 +44,7 @@ const Filed: FC<Props> = ({
<div className='w-[120px]'>
{tooltip}
</div>}>
<HelpCircle className='w-3.5 h-3.5 ml-0.5 text-gray-400' />
<RiQuestionLine className='w-3.5 h-3.5 ml-0.5 text-gray-400' />
</TooltipPlus>
)}
@@ -50,7 +52,7 @@ const Filed: FC<Props> = ({
<div className='flex'>
{operations && <div>{operations}</div>}
{supportFold && (
<ChevronRight className='w-3.5 h-3.5 text-gray-500 cursor-pointer transform transition-transform' style={{ transform: fold ? 'rotate(0deg)' : 'rotate(90deg)' }} />
<RiArrowDownSLine className='w-3.5 h-3.5 text-gray-500 cursor-pointer transform transition-transform' style={{ transform: fold ? 'rotate(0deg)' : 'rotate(90deg)' }} />
)}
</div>
</div>

4
web/app/components/workflow/nodes/_base/components/help-link.tsx
View File

@@ -1,8 +1,8 @@
import { memo } from 'react'
import { useTranslation } from 'react-i18next'
import { RiBookOpenLine } from '@remixicon/react'
import { useNodeHelpLink } from '../hooks/use-node-help-link'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import { BookOpen02 } from '@/app/components/base/icons/src/vender/line/education'
import type { BlockEnum } from '@/app/components/workflow/types'
type HelpLinkProps = {
@@ -21,7 +21,7 @@ const HelpLink = ({
target='_blank'
className='flex items-center justify-center mr-1 w-6 h-6'
>
<BookOpen02 className='w-4 h-4 text-gray-500' />
<RiBookOpenLine className='w-4 h-4 text-gray-500' />
</a>
</TooltipPlus>

6
web/app/components/workflow/nodes/_base/components/next-step/add.tsx
View File

@@ -3,13 +3,15 @@ import {
useCallback,
} from 'react'
import { useTranslation } from 'react-i18next'
import {
RiAddLine,
} from '@remixicon/react'
import {
useAvailableBlocks,
useNodesInteractions,
useNodesReadOnly,
} from '@/app/components/workflow/hooks'
import BlockSelector from '@/app/components/workflow/block-selector'
import { Plus } from '@/app/components/base/icons/src/vender/line/general'
import type {
CommonNodeType,
OnSelectBlock,
@@ -66,7 +68,7 @@ const Add = ({
)
}
<div className='flex items-center justify-center mr-1.5 w-5 h-5 rounded-[5px] bg-gray-200'>
<Plus className='w-3 h-3' />
<RiAddLine className='w-3 h-3' />
</div>
{t('workflow.panel.selectNextStep')}
</div>

6
web/app/components/workflow/nodes/_base/components/node-control.tsx
View File

@@ -5,6 +5,9 @@ import {
useState,
} from 'react'
import { useTranslation } from 'react-i18next'
import {
RiPlayLargeLine,
} from '@remixicon/react'
import {
useNodeDataUpdate,
useNodesInteractions,
@@ -14,7 +17,6 @@ import type { Node } from '../../../types'
import { canRunBySingle } from '../../../utils'
import PanelOperator from './panel-operator'
import {
Play,
Stop,
} from '@/app/components/base/icons/src/vender/line/mediaAndDevices'
import TooltipPlus from '@/app/components/base/tooltip-plus'
@@ -69,7 +71,7 @@ const NodeControl: FC<NodeControlProps> = ({
<TooltipPlus
popupContent={t('workflow.panel.runThisStep')}
>
<Play className='w-3 h-3' />
<RiPlayLargeLine className='w-3 h-3' />
</TooltipPlus>
)
}

4
web/app/components/workflow/nodes/_base/components/panel-operator/index.tsx
View File

@@ -3,9 +3,9 @@ import {
useCallback,
useState,
} from 'react'
import { RiMoreFill } from '@remixicon/react'
import type { OffsetOptions } from '@floating-ui/react'
import PanelOperatorPopup from './panel-operator-popup'
import { DotsHorizontal } from '@/app/components/base/icons/src/vender/line/general'
import {
PortalToFollowElem,
PortalToFollowElemContent,
@@ -59,7 +59,7 @@ const PanelOperator = ({
${triggerClassName}
`}
>
<DotsHorizontal className={`w-4 h-4 ${inNode ? 'text-gray-500' : 'text-gray-700'}`} />
<RiMoreFill className={`w-4 h-4 ${inNode ? 'text-gray-500' : 'text-gray-700'}`} />
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent className='z-[11]'>

11
web/app/components/workflow/nodes/_base/components/prompt/editor.tsx
View File

@@ -2,6 +2,9 @@
import type { FC } from 'react'
import React, { useCallback, useRef } from 'react'
import cn from 'classnames'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import copy from 'copy-to-clipboard'
import { useTranslation } from 'react-i18next'
import { useBoolean } from 'ahooks'
@@ -17,9 +20,11 @@ import { CodeLanguage } from '../../../code/types'
import ToggleExpandBtn from '@/app/components/workflow/nodes/_base/components/toggle-expand-btn'
import useToggleExpend from '@/app/components/workflow/nodes/_base/hooks/use-toggle-expend'
import PromptEditor from '@/app/components/base/prompt-editor'
import { Clipboard, ClipboardCheck } from '@/app/components/base/icons/src/vender/line/files'
import {
Clipboard,
ClipboardCheck,
} from '@/app/components/base/icons/src/vender/line/files'
import s from '@/app/components/app/configuration/config-prompt/style.module.css'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import { useEventEmitterContextContext } from '@/context/event-emitter'
import { PROMPT_EDITOR_INSERT_QUICKLY } from '@/app/components/base/prompt-editor/plugins/update-block'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
@@ -153,7 +158,7 @@ const Editor: FC<Props> = ({
</TooltipPlus>
)}
{showRemove && (
<Trash03 className='w-3.5 h-3.5 text-gray-500 cursor-pointer' onClick={onRemove} />
<RiDeleteBinLine className='w-3.5 h-3.5 text-gray-500 cursor-pointer' onClick={onRemove} />
)}
{!isCopied
? (

4
web/app/components/workflow/nodes/_base/components/remove-button.tsx
View File

@@ -2,7 +2,7 @@
import type { FC } from 'react'
import React from 'react'
import cn from 'classnames'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import { RiDeleteBinLine } from '@remixicon/react'
type Props = {
className?: string
@@ -18,7 +18,7 @@ const Remove: FC<Props> = ({
className={cn(className, 'p-1 cursor-pointer rounded-md hover:bg-black/5 text-gray-500 hover:text-gray-800')}
onClick={onClick}
>
<Trash03 className='w-4 h-4' />
<RiDeleteBinLine className='w-4 h-4' />
</div>
)
}

8
web/app/components/workflow/nodes/_base/components/toggle-expand-btn.tsx
View File

@@ -1,8 +1,10 @@
'use client'
import type { FC } from 'react'
import React, { useCallback } from 'react'
import { Expand04 } from '@/app/components/base/icons/src/vender/solid/arrows'
import { Collapse04 } from '@/app/components/base/icons/src/vender/line/arrows'
import {
RiCollapseDiagonalLine,
RiExpandDiagonalLine,
} from '@remixicon/react'
type Props = {
isExpand: boolean
@@ -17,7 +19,7 @@ const ExpandBtn: FC<Props> = ({
onExpandChange(!isExpand)
}, [isExpand])
const Icon = isExpand ? Collapse04 : Expand04
const Icon = isExpand ? RiCollapseDiagonalLine : RiExpandDiagonalLine
return (
<Icon className='w-3.5 h-3.5 text-gray-500 cursor-pointer' onClick={handleToggle} />
)

10
web/app/components/workflow/nodes/_base/components/variable/var-reference-picker.tsx
View File

@@ -3,6 +3,10 @@ import type { FC } from 'react'
import React, { useCallback, useEffect, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import {
RiArrowDownSLine,
RiCloseLine,
} from '@remixicon/react'
import produce from 'immer'
import { useStoreApi } from 'reactflow'
import VarReferencePopup from './var-reference-popup'
@@ -23,8 +27,6 @@ import {
} from '@/app/components/workflow/hooks'
import { VarType as VarKindType } from '@/app/components/workflow/nodes/tool/types'
import TypeSelector from '@/app/components/workflow/nodes/_base/components/selector'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
import AddButton from '@/app/components/base/button/add-button'
const TRIGGER_DEFAULT_WIDTH = 227
@@ -244,7 +246,7 @@ const VarReferencePicker: FC<Props> = ({
noLeft
triggerClassName='!text-xs'
readonly={readonly}
DropDownIcon={ChevronDown}
DropDownIcon={RiArrowDownSLine}
value={varKindType}
options={varKindTypes}
onChange={handleVarKindTypeChange}
@@ -303,7 +305,7 @@ const VarReferencePicker: FC<Props> = ({
className='invisible group-hover/wrap:visible absolute h-5 right-1 top-[50%] translate-y-[-50%] group p-1 rounded-md hover:bg-black/5 cursor-pointer'
onClick={handleClearVar}
>
<XClose className='w-3.5 h-3.5 text-gray-500 group-hover:text-gray-800' />
<RiCloseLine className='w-3.5 h-3.5 text-gray-500 group-hover:text-gray-800' />
</div>)}
</div>)}
</PortalToFollowElemTrigger>

8
web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx
View File

@@ -3,6 +3,9 @@ import type { FC } from 'react'
import React, { useEffect, useRef, useState } from 'react'
import { useBoolean, useHover } from 'ahooks'
import cn from 'classnames'
import {
RiSearchLine,
} from '@remixicon/react'
import { useTranslation } from 'react-i18next'
import { type NodeOutPutVar, type ValueSelector, type Var, VarType } from '@/app/components/workflow/types'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
@@ -12,9 +15,6 @@ import {
PortalToFollowElemContent,
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import {
SearchLg,
} from '@/app/components/base/icons/src/vender/line/general'
import { XCircle } from '@/app/components/base/icons/src/vender/solid/general'
import { checkKeys } from '@/utils/var'
@@ -243,7 +243,7 @@ const VarReferenceVars: FC<Props> = ({
onClick={e => e.stopPropagation()}
>
<SearchLg className='shrink-0 ml-[1px] mr-[5px] w-3.5 h-3.5 text-gray-400' />
<RiSearchLine className='shrink-0 ml-[1px] mr-[5px] w-3.5 h-3.5 text-gray-400' />
<input
value={searchText}
className='grow px-0.5 py-[7px] text-[13px] text-gray-700 bg-transparent appearance-none outline-none caret-primary-600 placeholder:text-gray-400'

4
web/app/components/workflow/nodes/_base/components/variable/var-type-picker.tsx
View File

@@ -2,13 +2,13 @@
import type { FC } from 'react'
import React, { useCallback, useState } from 'react'
import cn from 'classnames'
import { RiArrowDownSLine } from '@remixicon/react'
import {
PortalToFollowElem,
PortalToFollowElemContent,
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import { Check } from '@/app/components/base/icons/src/vender/line/general'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
import { VarType } from '@/app/components/workflow/types'
type Props = {
@@ -45,7 +45,7 @@ const VarReferencePicker: FC<Props> = ({
<PortalToFollowElemTrigger onClick={() => setOpen(!open)} className='w-[120px] cursor-pointer'>
<div className='flex items-center h-8 justify-between px-2.5 rounded-lg border-0 bg-gray-100 text-gray-900 text-[13px]'>
<div className='capitalize grow w-0 truncate' title={value}>{value}</div>
<ChevronDown className='shrink-0 w-3.5 h-3.5 text-gray-700' />
<RiArrowDownSLine className='shrink-0 w-3.5 h-3.5 text-gray-700' />
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent style={{

16
web/app/components/workflow/nodes/_base/node.tsx
View File

@@ -10,6 +10,11 @@ import {
useRef,
} from 'react'
import cn from 'classnames'
import {
RiCheckboxCircleLine,
RiErrorWarningLine,
RiLoader2Line,
} from '@remixicon/react'
import type { NodeProps } from '../../types'
import {
BlockEnum,
@@ -28,11 +33,6 @@ import NodeResizer from './components/node-resizer'
import NodeControl from './components/node-control'
import AddVariablePopupWithPosition from './components/add-variable-popup-with-position'
import BlockIcon from '@/app/components/workflow/block-icon'
import {
CheckCircle,
Loading02,
} from '@/app/components/base/icons/src/vender/line/general'
import { AlertCircle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback'
type BaseNodeProps = {
children: ReactElement
@@ -169,17 +169,17 @@ const BaseNode: FC<BaseNodeProps> = ({
}
{
(data._runningStatus === NodeRunningStatus.Running || data._singleRunningStatus === NodeRunningStatus.Running) && (
<Loading02 className='w-3.5 h-3.5 text-primary-600 animate-spin' />
<RiLoader2Line className='w-3.5 h-3.5 text-primary-600 animate-spin' />
)
}
{
data._runningStatus === NodeRunningStatus.Succeeded && (
<CheckCircle className='w-3.5 h-3.5 text-[#12B76A]' />
<RiCheckboxCircleLine className='w-3.5 h-3.5 text-[#12B76A]' />
)
}
{
data._runningStatus === NodeRunningStatus.Failed && (
<AlertCircle className='w-3.5 h-3.5 text-[#F04438]' />
<RiErrorWarningLine className='w-3.5 h-3.5 text-[#F04438]' />
)
}
</div>

12
web/app/components/workflow/nodes/_base/panel.tsx
View File

@@ -7,6 +7,10 @@ import {
memo,
useCallback,
} from 'react'
import {
RiCloseLine,
RiPlayLargeLine,
} from '@remixicon/react'
import cn from 'classnames'
import { useShallow } from 'zustand/react/shallow'
import { useTranslation } from 'react-i18next'
@@ -18,9 +22,6 @@ import {
TitleInput,
} from './components/title-description-input'
import { useResizePanel } from './hooks/use-resize-panel'
import {
XClose,
} from '@/app/components/base/icons/src/vender/line/general'
import BlockIcon from '@/app/components/workflow/block-icon'
import {
useAvailableBlocks,
@@ -32,7 +33,6 @@ import {
useWorkflow,
} from '@/app/components/workflow/hooks'
import { canRunBySingle } from '@/app/components/workflow/utils'
import { Play } from '@/app/components/base/icons/src/vender/line/mediaAndDevices'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import type { Node } from '@/app/components/workflow/types'
import { useStore as useAppStore } from '@/app/components/app/store'
@@ -129,7 +129,7 @@ const BasePanel: FC<BasePanelProps> = ({
handleSyncWorkflowDraft(true)
}}
>
<Play className='w-4 h-4 text-gray-500' />
<RiPlayLargeLine className='w-4 h-4 text-gray-500' />
</div>
</TooltipPlus>
)
@@ -141,7 +141,7 @@ const BasePanel: FC<BasePanelProps> = ({
className='flex items-center justify-center w-6 h-6 cursor-pointer'
onClick={() => handleNodeSelect(id, true)}
>
<XClose className='w-4 h-4' />
<RiCloseLine className='w-4 h-4' />
</div>
</div>
</div>

11
web/app/components/workflow/nodes/code/dependency-picker.tsx
View File

@@ -1,10 +1,13 @@
import type { FC } from 'react'
import React, { useCallback, useState } from 'react'
import { t } from 'i18next'
import {
RiArrowDownSLine,
RiSearchLine,
} from '@remixicon/react'
import type { CodeDependency } from './types'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
import { PortalToFollowElem, PortalToFollowElemContent, PortalToFollowElemTrigger } from '@/app/components/base/portal-to-follow-elem'
import { Check, SearchLg } from '@/app/components/base/icons/src/vender/line/general'
import { Check } from '@/app/components/base/icons/src/vender/line/general'
import { XCircle } from '@/app/components/base/icons/src/vender/solid/general'
type Props = {
@@ -38,7 +41,7 @@ const DependencyPicker: FC<Props> = ({
<PortalToFollowElemTrigger onClick={() => setOpen(!open)} className='flex-grow cursor-pointer'>
<div className='flex items-center h-8 justify-between px-2.5 rounded-lg border-0 bg-gray-100 text-gray-900 text-[13px]'>
<div className='grow w-0 truncate' title={value.name}>{value.name}</div>
<ChevronDown className='shrink-0 w-3.5 h-3.5 text-gray-700' />
<RiArrowDownSLine className='shrink-0 w-3.5 h-3.5 text-gray-700' />
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent style={{
@@ -50,7 +53,7 @@ const DependencyPicker: FC<Props> = ({
<div
className='shadow-sm bg-white mb-2 mx-1 flex items-center px-2 rounded-lg bg-gray-100'
>
<SearchLg className='shrink-0 ml-[1px] mr-[5px] w-3.5 h-3.5 text-gray-400' />
<RiSearchLine className='shrink-0 ml-[1px] mr-[5px] w-3.5 h-3.5 text-gray-400' />
<input
value={searchText}
className='grow px-0.5 py-[7px] text-[13px] text-gray-700 bg-transparent appearance-none outline-none caret-primary-600 placeholder:text-gray-400'

4
web/app/components/workflow/nodes/http/components/api-input.tsx
View File

@@ -3,13 +3,13 @@ import type { FC } from 'react'
import React, { useState } from 'react'
import cn from 'classnames'
import { useTranslation } from 'react-i18next'
import { RiArrowDownSLine } from '@remixicon/react'
import { Method } from '../types'
import Selector from '../../_base/components/selector'
import useAvailableVarList from '../../_base/hooks/use-available-var-list'
import { VarType } from '../../../types'
import type { Var } from '../../../types'
import Input from '@/app/components/workflow/nodes/_base/components/input-support-select-var'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
const MethodOptions = [
{ label: 'GET', value: Method.get },
@@ -55,7 +55,7 @@ const ApiInput: FC<Props> = ({
trigger={
<div className={cn(readonly && 'cursor-pointer', 'h-8 shrink-0 flex items-center px-2.5 bg-gray-100 border-black/5 rounded-lg')} >
<div className='w-12 pl-0.5 leading-[18px] text-xs font-medium text-gray-900 uppercase'>{method}</div>
{!readonly && <ChevronDown className='ml-1 w-3.5 h-3.5 text-gray-700' />}
{!readonly && <RiArrowDownSLine className='ml-1 w-3.5 h-3.5 text-gray-700' />}
</div>
}
popupClassName='top-[34px] w-[108px]'

6
web/app/components/workflow/nodes/if-else/components/condition-item.tsx
View File

@@ -3,13 +3,15 @@ import type { FC } from 'react'
import React, { useCallback, useEffect } from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import VarReferencePicker from '../../_base/components/variable/var-reference-picker'
import { isComparisonOperatorNeedTranslate } from '../utils'
import { VarType } from '../../../types'
import type { Condition } from '@/app/components/workflow/nodes/if-else/types'
import { ComparisonOperator, LogicalOperator } from '@/app/components/workflow/nodes/if-else/types'
import type { ValueSelector, Var } from '@/app/components/workflow/types'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import { RefreshCw05 } from '@/app/components/base/icons/src/vender/line/arrows'
import Selector from '@/app/components/workflow/nodes/_base/components/selector'
import Toast from '@/app/components/base/toast'
@@ -237,7 +239,7 @@ const Item: FC<ItemProps> = ({
className={cn(canRemove ? 'text-gray-500 bg-gray-100 hover:bg-gray-200 cursor-pointer' : 'bg-gray-25 text-gray-300', 'p-2 rounded-lg ')}
onClick={canRemove ? onRemove : () => { }}
>
<Trash03 className='w-4 h-4 ' />
<RiDeleteBinLine className='w-4 h-4 ' />
</div>
)}
</div>

6
web/app/components/workflow/nodes/iteration/add-block.tsx
View File

@@ -4,6 +4,9 @@ import {
} from 'react'
import produce from 'immer'
import cn from 'classnames'
import {
RiAddLine,
} from '@remixicon/react'
import { useStoreApi } from 'reactflow'
import { useTranslation } from 'react-i18next'
import {
@@ -17,7 +20,6 @@ import { NODES_INITIAL_DATA } from '../../constants'
import InsertBlock from './insert-block'
import type { IterationNodeType } from './types'
import BlockSelector from '@/app/components/workflow/block-selector'
import { Plus } from '@/app/components/base/icons/src/vender/line/general'
import { IterationStart } from '@/app/components/base/icons/src/vender/workflow'
import type {
OnSelectBlock,
@@ -85,7 +87,7 @@ const AddBlock = ({
`${nodesReadOnly && '!cursor-not-allowed opacity-50'}`,
open && '!bg-gray-50',
)}>
<Plus className='mr-1 w-4 h-4' />
<RiAddLine className='mr-1 w-4 h-4' />
{t('workflow.common.addBlock')}
</div>
)

7
web/app/components/workflow/nodes/iteration/panel.tsx
View File

@@ -1,7 +1,9 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import {
RiArrowRightSLine,
} from '@remixicon/react'
import VarReferencePicker from '../_base/components/variable/var-reference-picker'
import Split from '../_base/components/split'
import ResultPanel from '../../run/result-panel'
@@ -11,7 +13,6 @@ import useConfig from './use-config'
import { InputVarType, type NodePanelProps } from '@/app/components/workflow/types'
import Field from '@/app/components/workflow/nodes/_base/components/field'
import BeforeRunForm from '@/app/components/workflow/nodes/_base/components/before-run-form'
import { ArrowNarrowRight } from '@/app/components/base/icons/src/vender/line/arrows'
const i18nPrefix = 'workflow.nodes.iteration'
@@ -116,7 +117,7 @@ const Panel: FC<NodePanelProps<IterationNodeType>> = ({
<div className='px-4'>
<div className='flex items-center h-[34px] justify-between px-3 bg-gray-100 border-[0.5px] border-gray-200 rounded-lg cursor-pointer' onClick={showIterationDetail}>
<div className='leading-[18px] text-[13px] font-medium text-gray-700'>{t(`${i18nPrefix}.iteration`, { count: iterationRunResult.length })}</div>
<ArrowNarrowRight className='w-3.5 h-3.5 text-gray-500' />
<RiArrowRightSLine className='w-3.5 h-3.5 text-gray-500' />
</div>
<Split className='mt-3' />
</div>

7
web/app/components/workflow/nodes/knowledge-retrieval/components/dataset-item.tsx
View File

@@ -2,9 +2,12 @@
import type { FC } from 'react'
import React, { useCallback } from 'react'
import { useBoolean } from 'ahooks'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import type { DataSet } from '@/models/datasets'
import { DataSourceType } from '@/models/datasets'
import { Settings01, Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import { Settings01 } from '@/app/components/base/icons/src/vender/line/general'
import FileIcon from '@/app/components/base/file-icon'
import { Folder } from '@/app/components/base/icons/src/vender/solid/files'
import SettingsModal from '@/app/components/app/configuration/dataset-config/settings-modal'
@@ -65,7 +68,7 @@ const DatasetItem: FC<Props> = ({
className='flex items-center justify-center w-6 h-6 hover:bg-black/5 rounded-md cursor-pointer'
onClick={onRemove}
>
<Trash03 className='w-4 h-4 text-gray-500' />
<RiDeleteBinLine className='w-4 h-4 text-gray-500' />
</div>
</div>
)}

4
web/app/components/workflow/nodes/knowledge-retrieval/components/retrieval-config.tsx
View File

@@ -3,6 +3,7 @@ import type { FC } from 'react'
import React, { useCallback, useState } from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import { RiArrowDownSLine } from '@remixicon/react'
import type { MultipleRetrievalConfig, SingleRetrievalConfig } from '../types'
import type { ModelConfig } from '../../../types'
import {
@@ -19,7 +20,6 @@ import { ModelTypeEnum } from '@/app/components/header/account-setting/model-pro
import type {
DatasetConfigs,
} from '@/models/debug'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
type Props = {
payload: {
@@ -94,7 +94,7 @@ const RetrievalConfig: FC<Props> = ({
>
<div className={cn(!readonly && 'cursor-pointer', open && 'bg-gray-100', 'flex items-center h-6 px-2 rounded-md hover:bg-gray-100 group select-none')}>
<div className={cn(open ? 'text-gray-700' : 'text-gray-500', 'leading-[18px] text-xs font-medium group-hover:bg-gray-100')}>{payload.retrieval_mode === RETRIEVE_TYPE.oneWay ? t('appDebug.datasetConfig.retrieveOneWay.title') : t('appDebug.datasetConfig.retrieveMultiWay.title')}</div>
{!readonly && <ChevronDown className='w-3 h-3 ml-1' />}
{!readonly && <RiArrowDownSLine className='w-3 h-3 ml-1' />}
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent style={{ zIndex: 1001 }}>

4
web/app/components/workflow/nodes/llm/components/config-prompt-item.tsx
View File

@@ -3,12 +3,12 @@ import type { FC } from 'react'
import React, { useEffect, useState } from 'react'
import { uniqueId } from 'lodash-es'
import { useTranslation } from 'react-i18next'
import { RiQuestionLine } from '@remixicon/react'
import type { PromptItem, Variable } from '../../../types'
import { EditionType } from '../../../types'
import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor'
import TypeSelector from '@/app/components/workflow/nodes/_base/components/selector'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
import { PromptRole } from '@/models/debug'
const i18nPrefix = 'workflow.nodes.llm'
@@ -111,7 +111,7 @@ const ConfigPromptItem: FC<Props> = ({
<div className='max-w-[180px]'>{t(`${i18nPrefix}.roleDescription.${payload.role}`)}</div>
}
>
<HelpCircle className='w-3.5 h-3.5 text-gray-400' />
<RiQuestionLine className='w-3.5 h-3.5 text-gray-400' />
</TooltipPlus>
</div>
}

6
web/app/components/workflow/nodes/llm/panel.tsx
View File

@@ -1,6 +1,7 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import { RiQuestionLine } from '@remixicon/react'
import MemoryConfig from '../_base/components/memory-config'
import VarReferencePicker from '../_base/components/variable/var-reference-picker'
import useConfig from './use-config'
@@ -19,7 +20,6 @@ import BeforeRunForm from '@/app/components/workflow/nodes/_base/components/befo
import type { Props as FormProps } from '@/app/components/workflow/nodes/_base/components/before-run-form/form'
import ResultPanel from '@/app/components/workflow/run/result-panel'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor'
import Switch from '@/app/components/base/switch'
const i18nPrefix = 'workflow.nodes.llm'
@@ -208,7 +208,7 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
<TooltipPlus
popupContent={t('workflow.nodes.common.memories.tip')}
>
<HelpCircle className='w-3.5 h-3.5 text-gray-400' />
<RiQuestionLine className='w-3.5 h-3.5 text-gray-400' />
</TooltipPlus>
</div>
<div className='flex items-center h-[18px] px-1 rounded-[5px] border border-black/8 text-xs font-semibold text-gray-500 uppercase'>{t('workflow.nodes.common.memories.builtIn')}</div>
@@ -223,7 +223,7 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
<div className='max-w-[180px]'>{t('workflow.nodes.llm.roleDescription.user')}</div>
}
>
<HelpCircle className='w-3.5 h-3.5 text-gray-400' />
<RiQuestionLine className='w-3.5 h-3.5 text-gray-400' />
</TooltipPlus>
</div>}
value={inputs.memory.query_prompt_template || '{{#sys.query#}}'}

9
web/app/components/workflow/nodes/parameter-extractor/components/extract-parameter/item.tsx
View File

@@ -2,9 +2,12 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import {
RiDeleteBinLine,
RiEditLine,
} from '@remixicon/react'
import type { Param } from '../../types'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
import { Edit03, Trash03 } from '@/app/components/base/icons/src/vender/line/general'
const i18nPrefix = 'workflow.nodes.parameterExtractor'
type Props = {
@@ -43,14 +46,14 @@ const Item: FC<Props> = ({
className='p-1 cursor-pointer rounded-md hover:bg-black/5'
onClick={onEdit}
>
<Edit03 className='w-4 h-4 text-gray-500' />
<RiEditLine className='w-4 h-4 text-gray-500' />
</div>
<div
className='p-1 cursor-pointer rounded-md hover:bg-black/5'
onClick={onDelete}
>
<Trash03 className='w-4 h-4 text-gray-500' />
<RiDeleteBinLine className='w-4 h-4 text-gray-500' />
</div>
</div>
</div>

6
web/app/components/workflow/nodes/parameter-extractor/panel.tsx
View File

@@ -1,6 +1,9 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import {
RiQuestionLine,
} from '@remixicon/react'
import MemoryConfig from '../_base/components/memory-config'
import VarReferencePicker from '../_base/components/variable/var-reference-picker'
import Editor from '../_base/components/prompt/editor'
@@ -17,7 +20,6 @@ import ModelParameterModal from '@/app/components/header/account-setting/model-p
import OutputVars, { VarItem } from '@/app/components/workflow/nodes/_base/components/output-vars'
import { InputVarType, type NodePanelProps } from '@/app/components/workflow/types'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
import BeforeRunForm from '@/app/components/workflow/nodes/_base/components/before-run-form'
import { VarType } from '@/app/components/workflow/types'
@@ -128,7 +130,7 @@ const Panel: FC<NodePanelProps<ParameterExtractorNodeType>> = ({
<div className='w-[120px]'>
{t(`${i18nPrefix}.instructionTip`)}
</div>}>
<HelpCircle className='w-3.5 h-3.5 ml-0.5 text-gray-400' />
<RiQuestionLine className='w-3.5 h-3.5 ml-0.5 text-gray-400' />
</TooltipPlus>
</div>
}

6
web/app/components/workflow/nodes/question-classifier/components/advanced-setting.tsx
View File

@@ -2,11 +2,13 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import {
RiQuestionLine,
} from '@remixicon/react'
import MemoryConfig from '../../_base/components/memory-config'
import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor'
import type { Memory, Node, NodeOutPutVar } from '@/app/components/workflow/types'
import TooltipPlus from '@/app/components/base/tooltip-plus'
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
const i18nPrefix = 'workflow.nodes.questionClassifiers'
type Props = {
@@ -52,7 +54,7 @@ const AdvancedSetting: FC<Props> = ({
<div className='w-[120px]'>
{t(`${i18nPrefix}.instructionTip`)}
</div>}>
<HelpCircle className='w-3.5 h-3.5 ml-0.5 text-gray-400' />
<RiQuestionLine className='w-3.5 h-3.5 ml-0.5 text-gray-400' />
</TooltipPlus>
</div>
}

6
web/app/components/workflow/nodes/question-classifier/components/class-item.tsx
View File

@@ -2,9 +2,11 @@
import type { FC } from 'react'
import React, { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import type { Topic } from '../types'
import TextEditor from '../../_base/components/editor/text-editor'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
const i18nPrefix = 'workflow.nodes.questionClassifiers'
@@ -49,7 +51,7 @@ const ClassItem: FC<Props> = ({
<div className='text-xs font-medium text-gray-500'>{payload.name.length}</div>
<div className='mx-3 h-3 w-px bg-gray-200'></div>
{!readonly && (
<Trash03
<RiDeleteBinLine
className='mr-1 w-3.5 h-3.5 text-gray-500 cursor-pointer'
onClick={onRemove}
/>

6
web/app/components/workflow/nodes/start/components/var-item.tsx
View File

@@ -3,11 +3,13 @@ import type { FC } from 'react'
import React, { useCallback, useRef } from 'react'
import { useBoolean, useHover } from 'ahooks'
import { useTranslation } from 'react-i18next'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import InputVarTypeIcon from '../../_base/components/input-var-type-icon'
import type { InputVar, MoreInfo } from '@/app/components/workflow/types'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
import { Edit03 } from '@/app/components/base/icons/src/vender/solid/general'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import ConfigVarModal from '@/app/components/app/configuration/config-var/config-modal'
type Props = {
@@ -66,7 +68,7 @@ const VarItem: FC<Props> = ({
<Edit03 className='w-4 h-4 text-gray-500' />
</div>
<div onClick={onRemove} className='p-1 rounded-md cursor-pointer hover:bg-black/5'>
<Trash03 className='w-4 h-4 text-gray-500' />
<RiDeleteBinLine className='w-4 h-4 text-gray-500' />
</div>
</>
))}

6
web/app/components/workflow/nodes/template-transform/panel.tsx
View File

@@ -1,6 +1,9 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import {
RiQuestionLine,
} from '@remixicon/react'
import { CodeLanguage } from '../code/types'
import useConfig from './use-config'
import type { TemplateTransformNodeType } from './types'
@@ -10,7 +13,6 @@ import Field from '@/app/components/workflow/nodes/_base/components/field'
import Split from '@/app/components/workflow/nodes/_base/components/split'
import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor/editor-support-vars'
import OutputVars, { VarItem } from '@/app/components/workflow/nodes/_base/components/output-vars'
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
import type { NodePanelProps } from '@/app/components/workflow/types'
import BeforeRunForm from '@/app/components/workflow/nodes/_base/components/before-run-form'
import ResultPanel from '@/app/components/workflow/run/result-panel'
@@ -82,7 +84,7 @@ const Panel: FC<NodePanelProps<TemplateTransformNodeType>> = ({
href="https://jinja.palletsprojects.com/en/3.1.x/templates/"
target='_blank'>
<span>{t(`${i18nPrefix}.codeSupportTip`)}</span>
<HelpCircle className='w-3 h-3' />
<RiQuestionLine className='w-3 h-3' />
</a>
<div className='mx-1.5 w-px h-3 bg-gray-200'></div>
</div>

6
web/app/components/workflow/nodes/variable-assigner/components/var-group-item.tsx
View File

@@ -4,6 +4,9 @@ import type { ChangeEvent, FC } from 'react'
import { useTranslation } from 'react-i18next'
import produce from 'immer'
import { useBoolean } from 'ahooks'
import {
RiDeleteBinLine,
} from '@remixicon/react'
import type { VarGroupItem as VarGroupItemType } from '../types'
import VarReferencePicker from '../../_base/components/variable/var-reference-picker'
import VarList from '../components/var-list'
@@ -11,7 +14,6 @@ import Field from '@/app/components/workflow/nodes/_base/components/field'
import { VarType } from '@/app/components/workflow/types'
import type { NodeOutPutVar, ValueSelector, Var } from '@/app/components/workflow/types'
import { VarType as VarKindType } from '@/app/components/workflow/nodes/tool/types'
import { Trash03 } from '@/app/components/base/icons/src/vender/line/general'
import { Folder } from '@/app/components/base/icons/src/vender/line/files'
import { checkKeys } from '@/utils/var'
import Toast from '@/app/components/base/toast'
@@ -133,7 +135,7 @@ const VarGroupItem: FC<Props> = ({
className='group-hover:block hidden ml-0.5 p-1 rounded-md text-gray-500 cursor-pointer hover:bg-[#FEE4E2] hover:text-[#D92D20]'
onClick={onRemove}
>
<Trash03
<RiDeleteBinLine
className='w-4 h-4'
/>
</div>

16
web/app/components/workflow/note-node/note-editor/plugins/link-editor-plugin/component.tsx
View File

@@ -14,14 +14,14 @@ import {
import { useTranslation } from 'react-i18next'
import { useClickAway } from 'ahooks'
import cn from 'classnames'
import {
RiEditLine,
RiExternalLinkLine,
RiLinkUnlinkM,
} from '@remixicon/react'
import { useStore } from '../../store'
import { useLink } from './hooks'
import Button from '@/app/components/base/button'
import {
Edit03,
LinkBroken01,
LinkExternal01,
} from '@/app/components/base/icons/src/vender/line/general'
type LinkEditorComponentProps = {
containerElement: HTMLDivElement | null
@@ -109,7 +109,7 @@ const LinkEditorComponent = ({
target='_blank'
rel='noreferrer'
>
<LinkExternal01 className='mr-1 w-3 h-3' />
<RiExternalLinkLine className='mr-1 w-3 h-3' />
<div className='mr-1'>
{t('workflow.nodes.note.editor.openLink')}
</div>
@@ -128,14 +128,14 @@ const LinkEditorComponent = ({
setLinkOperatorShow(false)
}}
>
<Edit03 className='mr-1 w-3 h-3' />
<RiEditLine className='mr-1 w-3 h-3' />
{t('common.operation.edit')}
</div>
<div
className='flex items-center px-2 h-6 rounded-md cursor-pointer hover:bg-gray-50'
onClick={handleUnlink}
>
<LinkBroken01 className='mr-1 w-3 h-3' />
<RiLinkUnlinkM className='mr-1 w-3 h-3' />
{t('workflow.nodes.note.editor.unlink')}
</div>
</>

24
web/app/components/workflow/note-node/note-editor/toolbar/command.tsx
View File

@@ -4,15 +4,15 @@ import {
} from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import {
RiBold,
RiItalic,
RiLink,
RiListUnordered,
RiStrikethrough,
} from '@remixicon/react'
import { useStore } from '../store'
import { useCommand } from './hooks'
import { Link01 } from '@/app/components/base/icons/src/vender/line/general'
import {
Bold01,
Dotpoints01,
Italic01,
Strikethrough01,
} from '@/app/components/base/icons/src/vender/line/editor'
import TooltipPlus from '@/app/components/base/tooltip-plus'
type CommandProps = {
@@ -32,15 +32,15 @@ const Command = ({
const icon = useMemo(() => {
switch (type) {
case 'bold':
return <Bold01 className={cn('w-4 h-4', selectedIsBold && 'text-primary-600')} />
return <RiBold className={cn('w-4 h-4', selectedIsBold && 'text-primary-600')} />
case 'italic':
return <Italic01 className={cn('w-4 h-4', selectedIsItalic && 'text-primary-600')} />
return <RiItalic className={cn('w-4 h-4', selectedIsItalic && 'text-primary-600')} />
case 'strikethrough':
return <Strikethrough01 className={cn('w-4 h-4', selectedIsStrikeThrough && 'text-primary-600')} />
return <RiStrikethrough className={cn('w-4 h-4', selectedIsStrikeThrough && 'text-primary-600')} />
case 'link':
return <Link01 className={cn('w-4 h-4', selectedIsLink && 'text-primary-600')} />
return <RiLink className={cn('w-4 h-4', selectedIsLink && 'text-primary-600')} />
case 'bullet':
return <Dotpoints01 className={cn('w-4 h-4', selectedIsBullet && 'text-primary-600')} />
return <RiListUnordered className={cn('w-4 h-4', selectedIsBullet && 'text-primary-600')} />
}
}, [type, selectedIsBold, selectedIsItalic, selectedIsStrikeThrough, selectedIsLink, selectedIsBullet])

6
web/app/components/workflow/note-node/note-editor/toolbar/font-size-selector.tsx
View File

@@ -1,5 +1,6 @@
import { memo } from 'react'
import cn from 'classnames'
import { RiFontSize } from '@remixicon/react'
import { useTranslation } from 'react-i18next'
import { useFontSize } from './hooks'
import {
@@ -7,8 +8,6 @@ import {
PortalToFollowElemContent,
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import { TitleCase } from '@/app/components/base/icons/src/vender/line/editor'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
import { Check } from '@/app/components/base/icons/src/vender/line/general'
const FontSizeSelector = () => {
@@ -46,9 +45,8 @@ const FontSizeSelector = () => {
'flex items-center pl-2 pr-1.5 h-8 rounded-md text-[13px] font-medium text-gray-700 cursor-pointer hover:bg-gray-50',
fontSizeSelectorShow && 'bg-gray-50',
)}>
<TitleCase className='mr-1 w-4 h-4' />
<RiFontSize className='mr-1 w-4 h-4' />
{FONT_SIZE_LIST.find(font => font.key === fontSize)?.value || t('workflow.nodes.note.editor.small')}
<ChevronDown className='ml-0.5 w-3 h-3' />
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent>

4
web/app/components/workflow/note-node/note-editor/toolbar/operator.tsx
View File

@@ -4,13 +4,13 @@ import {
} from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import { RiMoreFill } from '@remixicon/react'
import ShortcutsName from '@/app/components/workflow/shortcuts-name'
import {
PortalToFollowElem,
PortalToFollowElemContent,
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import { DotsHorizontal } from '@/app/components/base/icons/src/vender/line/general'
import Switch from '@/app/components/base/switch'
export type OperatorProps = {
@@ -44,7 +44,7 @@ const Operator = ({
open && 'bg-black/5',
)}
>
<DotsHorizontal className='w-4 h-4 text-gray-500' />
<RiMoreFill className='w-4 h-4 text-gray-500' />
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent>

4
web/app/components/workflow/operator/add-block.tsx
View File

@@ -4,6 +4,7 @@ import {
useState,
} from 'react'
import cn from 'classnames'
import { RiAddCircleFill } from '@remixicon/react'
import { useStoreApi } from 'reactflow'
import { useTranslation } from 'react-i18next'
import type { OffsetOptions } from '@floating-ui/react'
@@ -19,7 +20,6 @@ import { NODES_INITIAL_DATA } from '../constants'
import { useWorkflowStore } from '../store'
import TipPopup from './tip-popup'
import BlockSelector from '@/app/components/workflow/block-selector'
import { Plus } from '@/app/components/base/icons/src/vender/line/general'
import type {
OnSelectBlock,
} from '@/app/components/workflow/types'
@@ -82,7 +82,7 @@ const AddBlock = ({
`${nodesReadOnly && '!cursor-not-allowed opacity-50'}`,
open && '!bg-black/5',
)}>
<Plus className='w-4 h-4' />
<RiAddCircleFill className='w-4 h-4' />
</div>
</TipPopup>
)

28
web/app/components/workflow/operator/control.tsx
View File

@@ -5,6 +5,12 @@ import {
} from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import {
RiCursorLine,
RiFunctionAddLine,
RiHand,
RiStickyNoteAddLine,
} from '@remixicon/react'
import { useKeyPress } from 'ahooks'
import {
useNodesReadOnly,
@@ -16,16 +22,6 @@ import { useStore } from '../store'
import AddBlock from './add-block'
import TipPopup from './tip-popup'
import { useOperator } from './hooks'
import {
Cursor02C,
Hand02,
} from '@/app/components/base/icons/src/vender/line/editor'
import {
Cursor02C as Cursor02CSolid,
Hand02 as Hand02Solid,
} from '@/app/components/base/icons/src/vender/solid/editor'
import { OrganizeGrid } from '@/app/components/base/icons/src/vender/line/layout'
import { StickerSquare } from '@/app/components/base/icons/src/vender/line/files'
const Control = () => {
const { t } = useTranslation()
@@ -101,7 +97,7 @@ const Control = () => {
)}
onClick={addNote}
>
<StickerSquare />
<RiStickyNoteAddLine className='w-4 h-4' />
</div>
</TipPopup>
<div className='mx-[3px] w-[1px] h-3.5 bg-gray-200'></div>
@@ -114,9 +110,7 @@ const Control = () => {
)}
onClick={handleModePointer}
>
{
controlMode === 'pointer' ? <Cursor02CSolid className='w-4 h-4' /> : <Cursor02C className='w-4 h-4' />
}
<RiCursorLine className='w-4 h-4' />
</div>
</TipPopup>
<TipPopup title={t('workflow.common.handMode')}>
@@ -128,9 +122,7 @@ const Control = () => {
)}
onClick={handleModeHand}
>
{
controlMode === 'hand' ? <Hand02Solid className='w-4 h-4' /> : <Hand02 className='w-4 h-4' />
}
<RiHand className='w-4 h-4' />
</div>
</TipPopup>
<div className='mx-[3px] w-[1px] h-3.5 bg-gray-200'></div>
@@ -142,7 +134,7 @@ const Control = () => {
)}
onClick={goLayout}
>
<OrganizeGrid className='w-4 h-4' />
<RiFunctionAddLine className='w-4 h-4' />
</div>
</TipPopup>
</div>

12
web/app/components/workflow/operator/zoom-in-out.tsx
View File

@@ -6,6 +6,10 @@ import {
useState,
} from 'react'
import cn from 'classnames'
import {
RiZoomInLine,
RiZoomOutLine,
} from '@remixicon/react'
import { useKeyPress } from 'ahooks'
import { useTranslation } from 'react-i18next'
import {
@@ -28,10 +32,6 @@ import {
PortalToFollowElemContent,
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import {
ZoomIn,
ZoomOut,
} from '@/app/components/base/icons/src/vender/line/editor'
enum ZoomType {
zoomIn = 'zoomIn',
@@ -234,7 +234,7 @@ const ZoomInOut: FC = () => {
zoomOut()
}}
>
<ZoomOut className='w-4 h-4' />
<RiZoomOutLine className='w-4 h-4' />
</div>
</TipPopup>
<div className='w-[34px]'>{parseFloat(`${zoom * 100}`).toFixed(0)}%</div>
@@ -249,7 +249,7 @@ const ZoomInOut: FC = () => {
zoomIn()
}}
>
<ZoomIn className='w-4 h-4' />
<RiZoomInLine className='w-4 h-4' />
</div>
</TipPopup>
</div>

4
web/app/components/workflow/panel/chat-record/index.tsx
View File

@@ -5,6 +5,7 @@ import {
useMemo,
useState,
} from 'react'
import { RiCloseLine } from '@remixicon/react'
import {
useStore,
useWorkflowStore,
@@ -16,7 +17,6 @@ import type { ChatItem } from '@/app/components/base/chat/types'
import { fetchConvesationMessages } from '@/service/debug'
import { useStore as useAppStore } from '@/app/components/app/store'
import Loading from '@/app/components/base/loading'
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
const ChatRecord = () => {
const [fetched, setFetched] = useState(false)
@@ -93,7 +93,7 @@ const ChatRecord = () => {
workflowStore.setState({ historyWorkflowData: undefined })
}}
>
<XClose className='w-4 h-4 text-gray-500' />
<RiCloseLine className='w-4 h-4 text-gray-500' />
</div>
</div>
<div className='grow h-0'>

4
web/app/components/workflow/panel/chat-record/user-input.tsx
View File

@@ -3,7 +3,7 @@ import {
useState,
} from 'react'
import { useTranslation } from 'react-i18next'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
import { RiArrowDownSLine } from '@remixicon/react'
const UserInput = () => {
const { t } = useTranslation()
@@ -27,7 +27,7 @@ const UserInput = () => {
`}
onClick={() => setExpanded(!expanded)}
>
<ChevronDown
<RiArrowDownSLine
className={`mr-1 w-3 h-3 ${!expanded ? '-rotate-90 text-indigo-600' : 'text-gray-300'}`}
/>
{t('workflow.panel.userInputField').toLocaleUpperCase()}

4
web/app/components/workflow/panel/debug-and-preview/index.tsx
View File

@@ -4,6 +4,7 @@ import {
} from 'react'
import { useKeyPress } from 'ahooks'
import cn from 'classnames'
import { RiCloseLine } from '@remixicon/react'
import { useTranslation } from 'react-i18next'
import {
useEdgesInteractions,
@@ -13,7 +14,6 @@ import {
import ChatWrapper from './chat-wrapper'
import Button from '@/app/components/base/button'
import { RefreshCcw01 } from '@/app/components/base/icons/src/vender/line/arrows'
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
export type ChatWrapperRefType = {
handleRestart: () => void
@@ -68,7 +68,7 @@ const DebugAndPreview = () => {
className='flex items-center justify-center w-6 h-6 cursor-pointer'
onClick={handleCancelDebugAndPreviewPanel}
>
<XClose className='w-4 h-4 text-gray-500' />
<RiCloseLine className='w-4 h-4 text-gray-500' />
</div>
</div>
</div>

4
web/app/components/workflow/panel/debug-and-preview/user-input.tsx
View File

@@ -4,6 +4,7 @@ import {
} from 'react'
import { useTranslation } from 'react-i18next'
import { useNodes } from 'reactflow'
import { RiArrowDownSLine } from '@remixicon/react'
import FormItem from '../../nodes/_base/components/before-run-form/form-item'
import { BlockEnum } from '../../types'
import {
@@ -11,7 +12,6 @@ import {
useWorkflowStore,
} from '../../store'
import type { StartNodeType } from '../../nodes/start/types'
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
const UserInput = () => {
const { t } = useTranslation()
@@ -46,7 +46,7 @@ const UserInput = () => {
`}
onClick={() => setExpanded(!expanded)}
>
<ChevronDown
<RiArrowDownSLine
className={`mr-1 w-3 h-3 ${!expanded ? '-rotate-90 text-indigo-600' : 'text-gray-300'}`}
/>
{t('workflow.panel.userInputField').toLocaleUpperCase()}

10
web/app/components/workflow/panel/workflow-preview.tsx
View File

@@ -6,6 +6,10 @@ import {
useState,
} from 'react'
import cn from 'classnames'
import {
RiClipboardLine,
RiCloseLine,
} from '@remixicon/react'
import { useTranslation } from 'react-i18next'
import copy from 'copy-to-clipboard'
import { useBoolean } from 'ahooks'
@@ -24,8 +28,6 @@ import Toast from '../../base/toast'
import IterationResultPanel from '../run/iteration-result-panel'
import InputsPanel from './inputs-panel'
import Loading from '@/app/components/base/loading'
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
import { Clipboard } from '@/app/components/base/icons/src/vender/line/files'
import type { NodeTracing } from '@/types/workflow'
const WorkflowPreview = ({
@@ -86,7 +88,7 @@ const WorkflowPreview = ({
<div className='flex items-center justify-between p-4 pb-1 text-base font-semibold text-gray-900'>
{`Test Run${!workflowRunningData?.result.sequence_number ? '' : `#${workflowRunningData?.result.sequence_number}`}`}
<div className='p-1 cursor-pointer' onClick={() => handleCancelDebugAndPreviewPanel()}>
<XClose className='w-4 h-4 text-gray-500' />
<RiCloseLine className='w-4 h-4 text-gray-500' />
</div>
</div>
<div className='grow relative flex flex-col'>
@@ -173,7 +175,7 @@ const WorkflowPreview = ({
copy(JSON.stringify(content))
Toast.notify({ type: 'success', message: t('common.actionMsg.copySuccessfully') })
}}>
<Clipboard className='w-3.5 h-3.5' />
<RiClipboardLine className='w-3.5 h-3.5' />
<div>{t('common.operation.copy')}</div>
</SimpleBtn>
)}

4
web/app/components/workflow/run/iteration-result-panel.tsx
View File

@@ -3,10 +3,10 @@ import type { FC } from 'react'
import React, { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import { RiCloseLine } from '@remixicon/react'
import { ArrowNarrowLeft } from '../../base/icons/src/vender/line/arrows'
import NodePanel from './node'
import type { NodeTracing } from '@/types/workflow'
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
const i18nPrefix = 'workflow.singleRun'
type Props = {
@@ -32,7 +32,7 @@ const IterationResultPanel: FC<Props> = ({
{t(`${i18nPrefix}.testRunIteration`)}
</div>
<div className='ml-2 shrink-0 p-1 cursor-pointer' onClick={onHide}>
<XClose className='w-4 h-4 text-gray-500 ' />
<RiCloseLine className='w-4 h-4 text-gray-500 ' />
</div>
</div>
<div className='flex items-center py-2 space-x-1 text-primary-600 cursor-pointer' onClick={onBack}>

22
web/app/components/workflow/run/node.tsx
View File

@@ -3,14 +3,18 @@ import { useTranslation } from 'react-i18next'
import type { FC } from 'react'
import { useCallback, useEffect, useState } from 'react'
import cn from 'classnames'
import {
RiArrowRightSLine,
RiCheckboxCircleLine,
RiErrorWarningLine,
RiLoader2Line,
} from '@remixicon/react'
import BlockIcon from '../block-icon'
import { BlockEnum } from '../types'
import Split from '../nodes/_base/components/split'
import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
import { AlertCircle, AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback'
import { CheckCircle, Loading02 } from '@/app/components/base/icons/src/vender/line/general'
import { ArrowNarrowRight, ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows'
import { AlertTriangle } from '@/app/components/base/icons/src/vender/line/alertsAndFeedback'
import type { NodeTracing } from '@/types/workflow'
type Props = {
@@ -79,7 +83,7 @@ const NodePanel: FC<Props> = ({
onClick={() => setCollapseState(!collapseState)}
>
{!hideProcessDetail && (
<ChevronRight
<RiArrowRightSLine
className={cn(
'shrink-0 w-3 h-3 mr-1 text-gray-400 transition-all group-hover:text-gray-500',
!collapseState && 'rotate-90',
@@ -96,10 +100,10 @@ const NodePanel: FC<Props> = ({
<div className='shrink-0 text-gray-500 text-xs leading-[18px]'>{`${getTime(nodeInfo.elapsed_time || 0)} · ${getTokenCount(nodeInfo.execution_metadata?.total_tokens || 0)} tokens`}</div>
)}
{nodeInfo.status === 'succeeded' && (
<CheckCircle className='shrink-0 ml-2 w-3.5 h-3.5 text-[#12B76A]' />
<RiCheckboxCircleLine className='shrink-0 ml-2 w-3.5 h-3.5 text-[#12B76A]' />
)}
{nodeInfo.status === 'failed' && (
<AlertCircle className='shrink-0 ml-2 w-3.5 h-3.5 text-[#F04438]' />
<RiErrorWarningLine className='shrink-0 ml-2 w-3.5 h-3.5 text-[#F04438]' />
)}
{nodeInfo.status === 'stopped' && (
<AlertTriangle className='shrink-0 ml-2 w-3.5 h-3.5 text-[#F79009]' />
@@ -107,7 +111,7 @@ const NodePanel: FC<Props> = ({
{nodeInfo.status === 'running' && (
<div className='shrink-0 flex items-center text-primary-600 text-[13px] leading-[16px] font-medium'>
<span className='mr-2 text-xs font-normal'>Running</span>
<Loading02 className='w-3.5 h-3.5 animate-spin' />
<RiLoader2Line className='w-3.5 h-3.5 animate-spin' />
</div>
)}
</div>
@@ -122,12 +126,12 @@ const NodePanel: FC<Props> = ({
<div className='leading-[18px] text-[13px] font-medium text-gray-700'>{t('workflow.nodes.iteration.iteration', { count: nodeInfo.metadata?.iterator_length || (nodeInfo.execution_metadata?.steps_boundary?.length - 1) })}</div>
{justShowIterationNavArrow
? (
<ArrowNarrowRight className='w-3.5 h-3.5 text-gray-500' />
<RiArrowRightSLine className='w-3.5 h-3.5 text-gray-500' />
)
: (
<div className='flex items-center space-x-1 text-[#155EEF]'>
<div className='text-[13px] font-normal '>{t('workflow.common.viewDetailInTracingPanel')}</div>
<ArrowNarrowRight className='w-3.5 h-3.5' />
<RiArrowRightSLine className='w-3.5 h-3.5' />
</div>
)}
</div>