import React from "react";
import Editor from "@/components/Editor";
import { Node } from "@antv/x6";
export default function ExtraModule({
  node,
  extraModules,
}: {
  node: Node;
  extraModules: { type: "image" | "code"; data: Record<string, any> };
}) {
  return extraModules.type === "code" ? (
    <Editor
      width={node.size().width}
      height={node.size().height / 2}
      code={extraModules.data.code}
      language={extraModules.data.language}
      onChange={(code: string) => {
        node.setData({
          extraModules: {
            type: "code",
            data: {
              code,
              language: extraModules.data.language,
            },
          },
        });
      }}
      onLanguageChange={(language: string) => {
        node.setData({
          extraModules: {
            type: "code",
            data: {
              code: extraModules.data.code,
              language,
            },
          },
        });
      }}
    />
  ) : (
    <img src={extraModules.data.imageUrl} alt="" />
  );
}
