dify/web/app/components/workflow/node-control.tsx

43 lines
1.2 KiB
TypeScript

import type { FC } from 'react'
import { memo } from 'react'
import {
DotsHorizontal,
Loading02,
} from '@/app/components/base/icons/src/vender/line/general'
import {
Play,
Stop,
} from '@/app/components/base/icons/src/vender/line/mediaAndDevices'
type NodeControlProps = {
isRunning?: boolean
}
const NodeControl: FC<NodeControlProps> = ({
isRunning,
}) => {
return (
<div className='absolute left-0 -top-7 flex items-center px-0.5 h-6 bg-white rounded-lg border-[0.5px] border-gray-100 shadow-xs text-gray-500'>
{
isRunning && (
<div className='flex items-center px-1 h-5 rounded-md bg-primary-50 text-xs font-medium text-primary-600'>
<Loading02 className='mr-1 w-3 h-3 animate-spin' />
RUNNING
</div>
)
}
<div className='flex items-center justify-center w-5 h-5 cursor-pointer'>
{
isRunning
? <Stop className='w-3 h-3' />
: <Play className='w-3 h-3' />
}
</div>
<div className='flex items-center justify-center w-5 h-5 cursor-pointer'>
<DotsHorizontal className='w-3 h-3' />
</div>
</div>
)
}
export default memo(NodeControl)