import React, { memo } from 'react';
import {  Position } from '@xyflow/react';
import './CustomNode.css';
import OnlyOneHandle from './OnlyOneHandle';

const CustomNode = memo(({ data: { style, position, ...data}, isConnectable }) => {
    return (
        <div className='custom-node' style={{ ...style }}>
            <div >
                {data.label}
            </div>
            {position?.includes('left') && <OnlyOneHandle connectionCount={1} type="target" position={Position.Left} isConnectable={isConnectable} />}
            {position?.includes('right') && <OnlyOneHandle connectionCount={1} type="source" position={Position.Right} isConnectable={isConnectable} />}
        </div>
    );
})

export default CustomNode;
