import type { Editor } from "grapesjs";

export function configureEditor(editor: Editor): void {
  editor.Panels.getPanel("devices-c")?.set("visible", false);
  editor.Panels.removeButton("devices-c", "set-device-mobile");
  editor.Panels.removeButton("devices-c", "set-device-desktop");
  editor.Panels.removeButton("views", "open-tm");
  editor.Panels.removeButton("options", "export-template");
  editor.Panels.removeButton("options", "preview");
  // editor.Panels.removeButton("options", "fullscreen");
  editor.Panels.removeButton("options", "gjs-open-import-template");
  editor.Panels.removeButton("options", "gjs-toggle-images");
  editor.BlockManager.remove("button");
  editor.BlockManager.remove("image");
  editor.BlockManager.remove("link-block");
  editor.BlockManager.remove("list-items");
  editor.BlockManager.remove("grid-items");
  editor.BlockManager.remove("sect37");
  editor.BlockManager.remove("text-sect");

  editor.DomComponents.addType("heading", {
    model: {
      defaults: {
        tagName: "h1",
        content: "Heading",
      },
    },
    isComponent(el) {
      return el.tagName === "H1";
    },
  });
  editor.BlockManager.add("heading-block", {
    label: "Heading",
    content: { type: "heading" },
    category: "Text",
    media: `
      <svg viewBox="0 0 24 24">
        <path fill="currentColor" d="M18.5,4L19.66,8.35L18.7,8.61C18.25,7.74 17.79,6.87 17.26,6.43C16.73,6 16.11,6 15.5,6H13V16.5C13,17 13,17.5 13.33,17.75C13.67,18 14.33,18 15,18V19H9V18C9.67,18 10.33,18 10.67,17.75C11,17.5 11,17 11,16.5V6H8.5C7.89,6 7.27,6 6.74,6.43C6.21,6.87 5.75,7.74 5.3,8.61L4.34,8.35L5.5,4H18.5Z"></path>
      </svg>
    `,
  });
  editor.BlockManager.get("text").set("category", "Text");
  editor.BlockManager.get("quote").set("category", "Text");
  editor.BlockManager.get("link").set("category", "Text");
  editor.BlockManager.get("sect100").set("category", "Struktur");
  editor.BlockManager.get("sect50").set("category", "Struktur");
  editor.BlockManager.get("sect30").set("category", "Struktur");
  editor.BlockManager.get("divider").set("category", "Struktur");
}