apps/canvas/front/src/components/node-network.tsx

import { NodeRect } from './node-rect';
import { nodeLabel, NetworkNode } from '@/lib/state';
import { Handle, Position } from "@xyflow/react";

export function NodeNetwork(node: NetworkNode) {
    const { id, selected } = node;
    return (
        <NodeRect id={id} selected={selected} type={node.type} state={node.data.state}>
            <div style={{ padding: '10px 20px' }}>
                {nodeLabel(node)}
                <Handle
                    id="subdomain"
                    type={"target"}
                    position={Position.Bottom}
                    isConnectableStart={true}
                    isConnectableEnd={true}
                    isConnectable={true}
                />
            </div>
        </NodeRect>
    );
}