i18n of variable inspect panel

This commit is contained in:
jZonG 2025-04-22 17:50:19 +08:00
parent 1e2ee40b2a
commit 9ef2c1a64c
5 changed files with 35 additions and 10 deletions

View File

@ -1,16 +1,19 @@
import type { FC } from 'react'
import { useTranslation } from 'react-i18next'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
const Empty: FC = () => {
const { t } = useTranslation()
return (
<div className='flex h-full flex-col gap-3 rounded-xl bg-background-section p-8'>
<div className='flex h-10 w-10 items-center justify-center rounded-[10px] border-[0.5px] border-components-card-border bg-components-card-bg shadow-lg backdrop-blur-sm'>
<Variable02 className='h-5 w-5 text-text-accent' />
</div>
<div className='flex flex-col gap-1'>
<div className='system-sm-semibold text-text-secondary'>Variable Inspect</div>
<div className='system-xs-regular text-text-tertiary'>No variables to inspect</div>
<a className='system-xs-regular cursor-pointer text-text-accent'>Learn more</a>
<div className='system-sm-semibold text-text-secondary'>{t('workflow.debug.variableInspect.title')}</div>
<div className='system-xs-regular text-text-tertiary'>{t('workflow.debug.variableInspect.emptyTip')}</div>
<a className='system-xs-regular cursor-pointer text-text-accent'>{t('workflow.debug.variableInspect.emptyLink')}</a>
</div>
</div>
)

View File

@ -1,11 +1,12 @@
// import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import {
RiArrowRightSLine,
RiErrorWarningFill,
RiLoader2Line,
} from '@remixicon/react'
// import { useStore } from '../store'
import { BlockEnum } from '../types'
// import { useStore } from '../store'
import { BlockEnum } from '../types'
import Button from '@/app/components/base/button'
// import ActionButton from '@/app/components/base/action-button'
// import Tooltip from '@/app/components/base/tooltip'
@ -20,6 +21,8 @@ type Props = {
}
const Left = ({ handleMenuClick }: Props) => {
const { t } = useTranslation()
// const bottomPanelWidth = useStore(s => s.bottomPanelWidth)
// const setShowVariableInspectPanel = useStore(s => s.setShowVariableInspectPanel)
const {
@ -33,8 +36,8 @@ const Left = ({ handleMenuClick }: Props) => {
<div className={cn('flex h-full flex-col')}>
{/* header */}
<div className='flex shrink-0 items-center justify-between gap-1 pl-4 pr-1 pt-2'>
<div className='system-sm-semibold-uppercase truncate text-text-primary'>Variable inspect</div>
<Button variant='ghost' size='small' className='shrink-0' onClick={clearCurrentVars}>Clear all</Button>
<div className='system-sm-semibold-uppercase truncate text-text-primary'>{t('workflow.debug.variableInspect.title')}</div>
<Button variant='ghost' size='small' className='shrink-0' onClick={clearCurrentVars}>{t('workflow.debug.variableInspect.clearAll')}</Button>
</div>
{/* content */}
<div className='grow overflow-y-auto py-1'>
@ -44,7 +47,7 @@ const Left = ({ handleMenuClick }: Props) => {
<div className='flex h-6 items-center gap-0.5'>
<RiArrowRightSLine className='h-3 w-3 rotate-90 text-text-tertiary' />
<div className='flex grow cursor-pointer items-center gap-1'>
<div className='system-xs-medium-uppercase truncate text-text-tertiary'>Environment</div>
<div className='system-xs-medium-uppercase truncate text-text-tertiary'>{t('workflow.env.envPanelTitle')}</div>
</div>
</div>
{/* var item list */}
@ -68,7 +71,7 @@ const Left = ({ handleMenuClick }: Props) => {
<div className='flex h-6 items-center gap-0.5'>
<RiArrowRightSLine className='h-3 w-3 rotate-90 text-text-tertiary' />
<div className='flex grow cursor-pointer items-center gap-1'>
<div className='system-xs-medium-uppercase truncate text-text-tertiary'>Conversation</div>
<div className='system-xs-medium-uppercase truncate text-text-tertiary'>{t('workflow.chatVariable.panelTitle')}</div>
</div>
</div>
{/* var item list */}

View File

@ -1,5 +1,6 @@
import type { FC } from 'react'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import {
RiCloseLine,
} from '@remixicon/react'
@ -11,6 +12,8 @@ import ActionButton from '@/app/components/base/action-button'
import cn from '@/utils/classnames'
const Panel: FC = () => {
const { t } = useTranslation()
const bottomPanelWidth = useStore(s => s.bottomPanelWidth)
const setShowVariableInspectPanel = useStore(s => s.setShowVariableInspectPanel)
const [showLeftPanel, setShowLeftPanel] = useState(true)
@ -20,7 +23,7 @@ const Panel: FC = () => {
return (
<div className={cn('flex h-full flex-col')}>
<div className='flex shrink-0 items-center justify-between pl-4 pr-2 pt-2'>
<div className='system-sm-semibold-uppercase'>Variable Inspect</div>
<div className='system-sm-semibold-uppercase'>{t('workflow.debug.variableInspect.title')}</div>
<ActionButton onClick={() => setShowVariableInspectPanel(false)}>
<RiCloseLine className='h-4 w-4' />
</ActionButton>

View File

@ -915,6 +915,14 @@ const translation = {
runThisNode: 'Run this node',
},
variableInspect: {
title: 'Variable Inspect',
emptyTip: 'After stepping through a node on the canvas or running a node step by step, you can view the current value of the node variable in Variable Inspect',
emptyLink: 'Learn more',
clearAll: 'Clear all',
clearNode: 'Clear cached variable',
view: 'View log',
edited: 'Edited',
reset: 'Reset to last run value',
trigger: {
normal: 'Variable Inspect',
running: 'Caching running status',

View File

@ -916,6 +916,14 @@ const translation = {
runThisNode: '运行此节点',
},
variableInspect: {
title: '变量检查',
emptyTip: '在画布上逐步浏览节点或逐步运行节点后,您可以在变量检查中查看节点变量的当前值',
emptyLink: '了解更多',
clearAll: '清除所有',
clearNode: '清除缓存',
view: '查看记录',
edited: '已编辑',
reset: '还原至上一次运行',
trigger: {
normal: '变量检查',
running: '缓存中',