add: sidepane preview

addon/chrome/content/styles/context.css

@@ -1,3 +1,3 @@
 bn-context {
-    min-width: 182px;
+    min-width: 360px;
 }

addon/chrome/content/styles/workspace.css

@@ -6,6 +6,11 @@ bn-workspace,
   flex-grow: 1;
 }
 
-bn-workspace #__addonRef__-editor-main #links-container {
+bn-workspace #__addonRef__-editor-main #links-container,
+.bn-note-preview #links-container {
   display: none;
 }
+
+.bn-note-preview {
+  height: 300px;
+}

addon/locale/en-US/notePreview.ftl

@@ -0,0 +1,8 @@
+note-preview-header =
+    .label = Preview: {$title}
+note-preview-sidenav =
+    .tooltiptext = {$title}
+note-preview-open =
+    .tooltiptext = Open note
+note-preview-close =
+    .tooltiptext = Close

addon/locale/it-IT/notePreview.ftl

@@ -0,0 +1,8 @@
+note-preview-header =
+    .label = Preview: {$title}
+note-preview-sidenav =
+    .tooltiptext = {$title}
+note-preview-open =
+    .tooltiptext = Open note
+note-preview-close =
+    .tooltiptext = Close

addon/locale/ru-RU/notePreview.ftl

@@ -0,0 +1,8 @@
+note-preview-header =
+    .label = Preview: {$title}
+note-preview-sidenav =
+    .tooltiptext = {$title}
+note-preview-open =
+    .tooltiptext = Open note
+note-preview-close =
+    .tooltiptext = Close

addon/locale/tr-TR/notePreview.ftl

@@ -0,0 +1,8 @@
+note-preview-header =
+    .label = Preview: {$title}
+note-preview-sidenav =
+    .tooltiptext = {$title}
+note-preview-open =
+    .tooltiptext = Open note
+note-preview-close =
+    .tooltiptext = Close

addon/locale/zh-CN/notePreview.ftl

@@ -0,0 +1,8 @@
+note-preview-header =
+    .label = 预览: {$title}
+note-preview-sidenav =
+    .tooltiptext = {$title}
+note-preview-open =
+    .tooltiptext = 打开笔记
+note-preview-close =
+    .tooltiptext = 关闭

addon/prefs.js

@@ -1,5 +1,3 @@
-pref("__prefsPrefix__.recentMainNoteIds", "");
-
 pref("__prefsPrefix__.syncNoteIds", "");
 pref("__prefsPrefix__.syncPeriodSeconds", 30);
 pref("__prefsPrefix__.syncAttachmentFolder", "attachments");

src/elements/detailsPane.ts

@@ -21,6 +21,11 @@ export class NoteDetails extends ItemDetails {
   </html:div>
 </hbox>`);
 
+  init() {
+    MozXULElement.insertFTLIfNeeded(`${config.addonRef}-notePreview.ftl`);
+    super.init();
+  }
+
   forceUpdateSideNav() {
     this._sidenav
       .querySelectorAll("toolbarbutton")

src/elements/related.ts

@@ -1,5 +1,8 @@
 // @ts-nocheck
 import { config } from "../../package.json";
+import { getPref } from "../utils/prefs";
+import { waitUtilAsync } from "../utils/wait";
+
 const RelatedBox = customElements.get("related-box")! as typeof XULElementBase;
 
 const _require = window.require;
@@ -68,15 +71,19 @@ export class NoteRelatedBox extends RelatedBox {
         if (relatedItem.isNote()) {
           const note = document.createXULElement("toolbarbutton");
           note.addEventListener("command", (event) => {
-            const position = event.shiftKey ? "window" : "workspace";
+            const position = event.shiftKey ? "window" : "tab";
             Zotero[config.addonRef].hooks.onOpenNote(id, position);
           });
           note.className = "zotero-clicky zotero-clicky-open-link";
           note.setAttribute("tabindex", "0");
           row.append(note);
         }
 
-        if (this.editable) {
+        if (
+          this.editable &&
+          (!relatedItem.isNote() ||
+            !getPref("workspace.autoUpdateRelatedNotes"))
+        ) {
           const remove = document.createXULElement("toolbarbutton");
           remove.addEventListener("command", () => this._handleRemove(id));
           remove.className = "zotero-clicky zotero-clicky-minus";
@@ -97,7 +104,64 @@ export class NoteRelatedBox extends RelatedBox {
       // @ts-ignore
       return super._handleShowItem(id);
     }
-    // TODO: open in sidebar
-    Zotero[config.addonRef].hooks.onOpenNote(id, "workspace");
+    openNotePreview(item, this.closest("bn-workspace")?.dataset.uid);
   }
 }
+
+function openNotePreview(noteItem: Zotero.Item, workspaceUID: string) {
+  const key = Zotero.ItemPaneManager.registerSection({
+    paneID: `bn-note-preview-${workspaceUID}-${noteItem.id}`,
+    pluginID: config.addonID,
+    header: {
+      icon: "chrome://zotero/skin/16/universal/note.svg",
+      l10nID: `${config.addonRef}-note-preview-header`,
+      l10nArgs: JSON.stringify({ title: noteItem.getNoteTitle() }),
+    },
+    sidenav: {
+      icon: "chrome://zotero/skin/20/universal/note.svg",
+      l10nID: `${config.addonRef}-note-preview-sidenav`,
+      l10nArgs: JSON.stringify({ title: noteItem.getNoteTitle() }),
+    },
+    bodyXHTML: `<note-editor class="bn-note-preview"></note-editor>`,
+    sectionButtons: [
+      {
+        type: "openNote",
+        icon: "chrome://zotero/skin/16/universal/open-link.svg",
+        l10nID: `${config.addonRef}-note-preview-open`,
+        onClick: ({ event }) => {
+          const position = event.shiftKey ? "window" : "tab";
+          Zotero[config.addonRef].hooks.onOpenNote(noteItem.id, position);
+        },
+      },
+      {
+        type: "closePreview",
+        icon: "chrome://zotero/skin/16/universal/minus.svg",
+        l10nID: `${config.addonRef}-note-preview-close`,
+        onClick: () => {
+          Zotero.ItemPaneManager.unregisterSection(key);
+        },
+      },
+    ],
+    onItemChange: ({ body, tabType, setEnabled }) => {
+      if (body.closest("bn-workspace")?.dataset.uid !== workspaceUID) {
+        setEnabled(false);
+        return;
+      }
+      setEnabled(true);
+    },
+    onRender: () => {},
+    onAsyncRender: async ({ body }) => {
+      const editorElement = body.querySelector("note-editor")! as EditorElement;
+      await waitUtilAsync(() => Boolean(editorElement._initialized));
+      if (!editorElement._initialized) {
+        throw new Error("initNoteEditor: waiting initialization failed");
+      }
+      editorElement.mode = "edit";
+      editorElement.viewMode = "library";
+      editorElement.parent = noteItem?.parentItem;
+      editorElement.item = noteItem;
+      await waitUtilAsync(() => Boolean(editorElement._editorInstance));
+      await editorElement._editorInstance._initPromise;
+    },
+  });
+}

src/elements/workspace.ts

@@ -67,6 +67,9 @@ export class Workspace extends PluginCEBase {
   init(): void {
     // MozXULElement.insertFTLIfNeeded(`${config.addonRef}-workspace.ftl`);
 
+    // For note preview section enabled decision
+    this.dataset.uid = Zotero.Utilities.randomString(8);
+
     this._outline = this._queryID("left-container") as unknown as OutlinePane;
     this._editorElement = this._queryID("editor-main") as EditorElement;
     this._outline._editorElement = this._editorElement;
@@ -95,11 +98,6 @@ export class Workspace extends PluginCEBase {
     this._editorElement.item = this.item;
     await waitUtilAsync(() => Boolean(this._editorElement._editorInstance));
     await this._editorElement._editorInstance._initPromise;
-    // Hide BN toolbar
-    this._editorElement._editorInstance._iframeWindow.document.body.setAttribute(
-      "no-bn-toolbar",
-      "true",
-    );
     return;
   }
 

src/utils/linkNote.ts

@@ -6,7 +6,7 @@ async function openLinkNoteDialog(currentNote: Zotero.Item) {
   const io = {
     openedNoteIDs: Zotero_Tabs._tabs
       .map((tab) => tab.data?.itemID)
-      .filter((id) => id),
+      .filter((id) => id && id != currentNote.id),
     currentNoteID: currentNote.id,
     deferred: Zotero.Promise.defer(),
   } as any;