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

export function NodeMongoDB(node: MongoDBNode) {
  const { id, selected } = node;
  return (
    <NodeRect id={id} selected={selected} type={node.type}>
      <div style={{ padding: '10px 20px' }}>
        {nodeLabel(node)}
        <Handle
          id="env_var"
          type={"source"}
          position={Position.Top}
          isConnectableStart={true}
          isConnectableEnd={true}
          isConnectable={true}
         />
      </div>
    </NodeRect>
  );
}

export function NodeMongoDBDetails(node: MongoDBNode) {
  return (
    <>
      <div>{nodeLabel(node)}</div>
    </>);
}