OC.Plugins.register("OCA.Files.NewFileMenu", {
  attach: function () {
    const refreshMenu = () => {
      const menu = document.querySelector(".newFileMenu ul");

      const addSeparator = (selector, title) => {
        const firtEl = document.querySelector(selector);

        const separator = document.createElement("li");
        separator.classList.add("menu-item-separator");
        separator.innerHTML = `
                      <div></div>
                      <p>${title}</p>
                  `;

        menu.insertBefore(separator, firtEl.parentNode);
      };

      const addExtension = (selector) => {
        const elements = document.querySelectorAll(selector);
        for (const el of elements) {
          const span = document.createElement("span");
          span.classList.add("menu-item-extension");
          span.innerText = el.getAttribute("data-templatename").split(".")[1];
          el.appendChild(span);
        }
      };

      addSeparator(
        '.newFileMenu .menuitem[data-action*="template-new-onlyoffice"]',
        "ONLYOFFICE"
      );
      addSeparator(
        '.newFileMenu .menuitem[data-action*="template-new-richdocument"]',
        "LIBREOFFICE"
      );

      addExtension(
        '.newFileMenu .menuitem[data-action*="template-new-onlyoffice"]'
      );
      addExtension(
        '.newFileMenu .menuitem[data-action*="template-new-richdocument"]'
      );
    };
    setTimeout(refreshMenu);
    document.querySelector(".new").addEventListener("click", refreshMenu);
  },
});