variable inspect button

This commit is contained in:
jZonG 2025-04-18 11:52:42 +08:00
parent b1977eb920
commit ccf0a5752d
2 changed files with 55 additions and 0 deletions

View File

@ -2,6 +2,7 @@ import { memo, useEffect, useMemo, useRef } from 'react'
import { MiniMap } from 'reactflow'
import UndoRedo from '../header/undo-redo'
import ZoomInOut from './zoom-in-out'
import Trigger from '../variable-inspect/trigger'
import { useStore } from '../store'
export type OperatorProps = {
@ -49,6 +50,7 @@ const Operator = ({ handleUndo, handleRedo }: OperatorProps) => {
>
<div className='flex justify-between px-1 pb-2'>
<UndoRedo handleUndo={handleUndo} handleRedo={handleRedo} />
<Trigger />
<div className='relative'>
<MiniMap
pannable

View File

@ -0,0 +1,53 @@
import type { FC } from 'react'
import { RiLoader2Line, RiStopCircleFill } from '@remixicon/react'
import Tooltip from '@/app/components/base/tooltip'
import cn from '@/utils/classnames'
const VariableInspectTrigger: FC = () => {
return (
<div className={cn('flex items-center gap-1')}>
{/* view button */}
<div
className='system-2xs-semibold-uppercase flex h-5 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-tertiary shadow-lg backdrop-blur-sm hover:bg-background-default-hover'
// onClick={() => {}}
>
Variable inspect
</div>
{/* caching button */}
<div
className='system-xs-medium flex h-6 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-accent shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
// onClick={() => {}}
>
<RiLoader2Line className='h-4 w-4' />
<span className='text-text-accent'>Caching running status</span>
</div>
{/* stop button */}
<Tooltip
popupContent={'Stop run'}
>
<div
className='flex h-6 cursor-pointer items-center rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-1 shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
// onClick={() => {}}
>
<RiStopCircleFill className='h-4 w-4 text-text-accent' />
</div>
</Tooltip>
{/* finish button */}
<div
className='system-xs-medium flex h-6 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-accent shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
// onClick={() => {}}
>
View cached variables
</div>
{/* clear button */}
<div
className='system-xs-medium flex h-6 cursor-pointer items-center rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-1 text-text-tertiary shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent hover:text-text-accent'
// onClick={() => {}}
>
Clear
</div>
</div>
)
}
export default VariableInspectTrigger