Canvas: Reuse Name component in node details
Change-Id: Ide8094b50f9ac019e7bada9a000100f9233133da
diff --git a/apps/canvas/front/src/components/node-details.tsx b/apps/canvas/front/src/components/node-details.tsx
index 39ae059..6267ac3 100644
--- a/apps/canvas/front/src/components/node-details.tsx
+++ b/apps/canvas/front/src/components/node-details.tsx
@@ -1,36 +1,37 @@
import { NodeAppDetails } from "./node-app";
import { NodeGatewayHttpsDetails } from "./node-gateway-https";
-import { AppNode } from "@/lib/state";
import { NodeVolumeDetails } from "./node-volume";
import { NodePostgreSQLDetails } from "./node-postgresql";
import { NodeMongoDBDetails } from "./node-mongodb";
import { NodeGithubDetails } from "./node-github";
import { NodeGatewayTCPDetails } from "./node-gateway-tcp";
+import { NodeDetailsProps } from "@/lib/types";
-export function NodeDetails({ node, disabled }: { node: AppNode; disabled?: boolean }) {
+export function NodeDetails(props: NodeDetailsProps) {
return (
<div className="px-1 flex flex-col gap-2">
- <NodeDetailsImpl node={node} disabled={disabled} />
+ <NodeDetailsImpl {...props} />
</div>
);
}
-function NodeDetailsImpl({ node, disabled }: { node: AppNode; disabled?: boolean }) {
+function NodeDetailsImpl(props: NodeDetailsProps) {
+ const { node, ...rest } = props;
switch (node.type) {
case "app":
- return <NodeAppDetails node={node} disabled={disabled} />;
+ return <NodeAppDetails {...rest} node={node} />;
case "gateway-https":
- return <NodeGatewayHttpsDetails node={node} disabled={disabled} />;
+ return <NodeGatewayHttpsDetails {...rest} node={node} />;
case "gateway-tcp":
- return <NodeGatewayTCPDetails node={node} disabled={disabled} />;
+ return <NodeGatewayTCPDetails {...rest} node={node} />;
case "volume":
- return <NodeVolumeDetails node={node} disabled={disabled} />;
+ return <NodeVolumeDetails {...rest} node={node} />;
case "postgresql":
- return <NodePostgreSQLDetails node={node} disabled={disabled} />;
+ return <NodePostgreSQLDetails {...rest} node={node} />;
case "mongodb":
- return <NodeMongoDBDetails node={node} disabled={disabled} />;
+ return <NodeMongoDBDetails {...rest} node={node} />;
case "github":
- return <NodeGithubDetails node={node} disabled={disabled} />;
+ return <NodeGithubDetails {...rest} node={node} />;
default:
return <>nooo</>;
}