import { memo } from 'react';
import { NodeProps } from 'reactflow';
import { BaseNode } from './BaseNode';
import { SurrogateNodeData } from '../../../lib/canvas/schema';

function SurrogateNodeComponent(props: NodeProps<SurrogateNodeData>) {
  const { data } = props;
  return (
    <BaseNode {...props} icon={<span>🚀</span>} color="text-pink-600" colorBg="bg-pink-50" outputs={0}>
      <div>{data.enabled ? 'Enabled' : 'Disabled'}</div>
      {data.enabled && data.modelType && (
        <div className="text-xs text-gray-400">{data.modelType}</div>
      )}
    </BaseNode>
  );
}
export const SurrogateNode = memo(SurrogateNodeComponent);