🚧 dashboard is back

package.json

@@ -130,6 +130,7 @@
             ],
             "curly": "off",
             "no-undef": "off",
+            "no-console": "warn",
             "consistent-return": "off",
             "vue/max-attributes-per-line": "off",
             "vue/multi-word-component-names": "warn",
@@ -174,4 +175,4 @@
             "publish": false
         }
     }
-}
+}

src/bootstrap/addon.ts

@@ -166,7 +166,7 @@ export default class Addon extends toolBase.BasicTool {
         this.listeners.forEach(({ target, type, listener }) =>
             target?.deref()?.removeEventListener(type, listener)
         );
-        Zotero.getActiveZoteroPane().itemsView.onSelect.removeListener(onItemSelect);
+        (Zotero.getActiveZoteroPane().itemsView as any).onSelect.removeListener(onItemSelect);
         await this.worker.close();
         toolBase.unregister(this);
     }

src/bootstrap/events.ts

@@ -1,8 +1,8 @@
 import { config } from '../../package.json';
 import { addDebugMenu } from './modules/debug';
-import { DebuggerBackend, waitForReader } from './modules/utils';
+import { ICON_URL, DebuggerBackend, waitForReader } from './modules/utils';
 import { mountMinimap, updateMinimap } from './modules/minimap/minimap';
-import { renderSummaryPanel, updateDashboard } from './modules/sidebar';
+import { registerPanels, renderSummaryPanel, updateDashboard } from './modules/sidebar';
 import { hideDeleteMenuForHistory, initReaderAlert, patchedZoteroSearch, protectData } from './modules/history/misc';
 import addImagesPanelForReader from './modules/images/images';
 import buildRecentMenu from "./modules/recent";
@@ -49,6 +49,8 @@ export function onAddonLoad() {
         patcher: patchedZoteroSearch
     });
 
+    registerPanels();
+
     Zotero.Reader.registerEventListener('renderToolbar', e => onOpenReader(e.reader), config.addonID);
     Zotero.Reader._readers.forEach(onOpenReader);
 
@@ -71,7 +73,7 @@ export function onMainWindowLoad(win: MainWindow) {
         tag: 'menuitem',
         label: addon.locale.overview,
         commandListener: openOverview,
-        icon: `chrome://${config.addonName}/content/icons/icon.svg`,
+        icon: ICON_URL,
     });
     buildRecentMenu(win);
     if (__dev__)

src/bootstrap/modules/sidebar.ts

@@ -1,3 +1,5 @@
+import { config } from "../../../package.json";
+
 const dashboards: { [id: number]: HTMLIFrameElement } = {};
 
 export function updateDashboard(id?: number) {
@@ -10,26 +12,50 @@ export function updateDashboard(id?: number) {
  * 初始化侧边栏TabPanel
  */
 export function registerPanels() {
-    // addon.readerTab.register(
-    //     addon.locale.dashboard,
-    //     (
-    //         panel: XUL.TabPanel,
-    //         ownerDeck: XUL.Deck,
-    //         ownerWindow: Window,
-    //         reader: _ZoteroTypes.ReaderInstance
-    //     ) => renderDashboard(panel, reader)
-    // );
-    // addon.libTab.register(addon.locale.dashboard, (panel: XUL.TabPanel) =>
-    //     renderDashboard(panel)
-    // );
-    // addon.reader.register('initialized', 'chartero', async reader => {
-    //     await reader._waitForReader();
-    //     await waitForReader(reader);
-    //     if (addon.getPref('enableMinimap'))
-    //         mountMinimap(reader);
-    //     if (addon.getPref('enableAllImages'))
-    //         addImagesPanelForReader(reader);
-    // });
+    Zotero.ItemPaneManager?.registerSections({
+        paneID: 'chartero-dashboard',
+        pluginID: config.addonID,
+        head: {
+            l10nID: 'zotero-toolbar-tabs-menu',
+            icon: `chrome://zotero/skin/itempane/16/abstract.svg`,
+        },
+        sidenav: {
+            l10nID: 'zotero-toolbar-tabs-menu',
+            icon: `resource://${config.addonName}/icons/sidebar.svg`,
+        },
+        sectionButtons: [{
+            type: 'info',
+            icon: `resource://${config.addonName}/icons/sidebar.svg`,
+            onClick: addon.log
+        }],
+        onInit: args => {
+            const iframe = args.doc.createXULElement('iframe') as HTMLElement as HTMLIFrameElement;
+            iframe.setAttribute('src', 'resource://chartero/dashboard/index.html');
+            iframe.style.width = '100%';
+            iframe.style.height = '100%';
+            iframe.addEventListener('load', ({ target }) => {
+                const win = (target as Document).defaultView!;
+                (win as any).wrappedJSObject.addon = addon;
+            }, true);
+            args.body.appendChild(iframe);
+            args.body.style.height = '600px';
+        },
+        onRender: args => {
+            addon.log(args.getData());
+        },
+        onSecondaryRender: args => {
+            addon.log(args.getData());
+        },
+        onDataChange: args => {
+            addon.log(args.incomingData);
+            if (args.incomingData.type === 'item') {
+                const iframe = args.body.getElementsByTagName('iframe')[0];
+                iframe.contentWindow!.postMessage({ id: args.incomingData.value.id }, '*');
+            }
+            return true;
+        },
+        onDestroy: args => addon.log(args),
+    });
 }
 
 export function renderSummaryPanel(ids: number[]) {

src/vue/vite.config.ts

@@ -16,6 +16,7 @@ export default defineConfig({
             input: {
                 summary: resolve(__dirname, 'summary/index.html'),
                 overview: resolve(__dirname, 'overview/index.html'),
+                dashboard: resolve(__dirname, 'dashboard/index.html'),
             },
         },
         cssMinify: true,

tools/build.ts

@@ -1,3 +1,4 @@
+/* eslint-disable no-console */
 import type { RollupWatcher } from 'rollup';
 import { build } from 'esbuild';
 import type { BuildOptions } from 'esbuild';