diff --git a/apps/canvas/src/components/node-mongodb.tsx b/apps/canvas/src/components/node-mongodb.tsx
new file mode 100644
index 0000000..f75b7b9
--- /dev/null
+++ b/apps/canvas/src/components/node-mongodb.tsx
@@ -0,0 +1,29 @@
+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>
+    </>);
+}
\ No newline at end of file