Migrate plugins manager view into application settings

src/fontra/client/lang/en.json

@@ -29,6 +29,7 @@
   "action.undo": "Undo",
   "application-settings.clipboard.title": "Clipboard",
   "application-settings.display-language.title": "Display Language",
+  "application-settings.plugins-manager.title": "Plugin Manager",
   "application-settings.server-info.title": "Server info",
   "application-settings.shortcuts.title": "Shortcuts",
   "application-settings.theme-settings.title": "Theme settings",

src/fontra/client/lang/zh-CN.json

@@ -28,6 +28,7 @@
   "action.undo": "撤销",
   "application-settings.clipboard.title": "剪贴板导出格式",
   "application-settings.display-language.title": "Display Language",
+  "application-settings.plugins-manager.title": "插件管理器",
   "application-settings.server-info.title": "服务器信息",
   "application-settings.shortcuts.title": "Shortcuts",
   "application-settings.theme-settings.title": "主题设置",

src/fontra/views/applicationsettings/applicationsettings.html

@@ -7,6 +7,7 @@
     <title>Fontra Application Settings</title>
     <script type="module" src="/web-components/modal-dialog.js"></script>
     <script type="module" src="/web-components/grouped-settings.js"></script>
+    <script type="module" src="/web-components/plugin-manager.js"></script>
     <script type="module" src="/core/theme-settings.js"></script>
     <style>
       body {

src/fontra/views/applicationsettings/applicationsettings.js

@@ -1,6 +1,7 @@
 import * as html from "../core/html-utils.js";
 import { ClipboardPanel } from "./panel-clipboard.js";
 import { DisplayLanguagePanel } from "./panel-display-language.js";
+import { PluginsManagerPanel } from "./panel-plugins-manager.js";
 import { ServerInfoPanel } from "./panel-server-info.js";
 import { ShortCutsPanel } from "./panel-shortcuts.js";
 import { ThemeSettingsPanel } from "./panel-theme-settings.js";
@@ -28,6 +29,7 @@ export class ApplicationSettingsController {
       ThemeSettingsPanel,
       DisplayLanguagePanel,
       ClipboardPanel,
+      PluginsManagerPanel,
       ServerInfoPanel,
     ]) {
       const headerElement = html.div(

src/fontra/views/applicationsettings/panel-plugins-manager.js

@@ -0,0 +1,25 @@
+import * as html from "../core/html-utils.js";
+import { addStyleSheet } from "../core/html-utils.js";
+import { BaseInfoPanel } from "./panel-base.js";
+
+addStyleSheet(`
+  .fontra-ui-plugins-manager-panel-card {
+    background-color: var(--ui-element-background-color);
+    border-radius: 0.5em;
+    padding: 1em;
+  }
+  `);
+
+export class PluginsManagerPanel extends BaseInfoPanel {
+  static title = "application-settings.plugins-manager.title";
+  static id = "plugins-manager-panel";
+
+  async setupUI() {
+    this.panelElement.innerHTML = "";
+    const container = html.createDomElement("plugin-manager", {
+      id: "plugin-manager",
+    });
+    container.className = "fontra-ui-plugins-manager-panel-card";
+    this.panelElement.appendChild(container);
+  }
+}

src/fontra/views/editor/editor.js

@@ -615,6 +615,7 @@ export class EditorController {
             "theme-settings",
             "display-language",
             "clipboard",
+            "plugins-manager",
             "server-info",
           ];
           return menuItems.map((panelID) => ({