[sync] Add syncing with link

scripts/build.ts

@@ -29,6 +29,16 @@ const builds: (BuildOptions & { entryPoints: [string] })[] = [
     sourcemap,
     target,
   },
+  {
+    bundle: true,
+    entryPoints: ['src/content/prefs/dialog.tsx'],
+    external: ['components/*', 'react', 'react-dom'],
+    format: 'iife',
+    globalName: 'notero',
+    outdir: 'build/content/prefs',
+    sourcemap,
+    target,
+  },
 ];
 
 Promise.all(

shell.nix

@@ -0,0 +1,10 @@
+{ pkgs ? import <nixpkgs> {} }:
+
+pkgs.mkShell {
+
+  buildInputs = [
+    pkgs.nodejs
+    pkgs.pnpm
+  ];
+
+}

src/bootstrap.ts

@@ -8,6 +8,7 @@ function log(msg: string) {
   Zotero.debug(`${LOG_PREFIX}${msg}`);
   Zotero.log(`${LOG_PREFIX}${msg}`, 'info');
 }
+var chromeHandle
 
 /**
  *
@@ -40,7 +41,15 @@ async function startup(
 ) {
   log(`Starting v${version}`);
 
+
+  Zotero.log(rootURI)
   Services.scriptloader.loadSubScript(rootURI + 'content/notero.js');
+  // @ts-expect-error - `Zotero.Notero` is not defined in the Zotero namespace
+  const aomStartup = Components.classes[
+    "@mozilla.org/addons/addon-manager-startup;1"
+  ].getService(Components.interfaces.amIAddonManagerStartup);
+  const manifestURI = Services.io.newURI(rootURI + "manifest.json");
+  chromeHandle = aomStartup.registerChrome(manifestURI, [["content", "notero", rootURI + "content/"]],);
 
   await Zotero.Notero?.startup({ pluginID: id, rootURI, version });
 }

src/content/prefs/collection-sync-config.ts

@@ -5,6 +5,7 @@ import { getNoteroPref, NoteroPref, setNoteroPref } from './notero-pref';
 export type CollectionSyncConfig = {
   notionOptionID?: string;
   syncEnabled: boolean;
+  associatedLink?: string;
 };
 
 export type CollectionSyncConfigsRecord = Record<

src/content/prefs/dialog.tsx

@@ -0,0 +1,74 @@
+import { isFullPage } from '@notionhq/client';
+
+import { getGlobalNotero, getXULElementById } from '../utils';
+
+import { getNoteroPref, NoteroPref } from './notero-pref';
+import { setMenuItems } from '../utils/elements';
+
+type DialogArguments = {
+  accepted: boolean;
+  associatedLink: string;
+  syncEnabled: boolean;
+};
+
+class Dialog {
+  private collectionDialogContainer!: XUL.XULElement;
+  private associatedLinkElement!: XUL.MenuListElement;
+  private syncEnabledElement!: XUL.CheckboxElement;
+  private params!: DialogArguments;
+
+  public async init(): Promise<void> {
+    await Zotero.uiReadyPromise;
+
+    /* eslint-disable @typescript-eslint/no-non-null-assertion */
+    this.params = window.arguments![0]! as DialogArguments;
+
+    /* eslint-disable @typescript-eslint/no-non-null-assertion */
+    this.collectionDialogContainer = getXULElementById(
+      'notero-collection-dialog',
+    )!;
+    this.associatedLinkElement = getXULElementById('notero-associatedLink')!;
+
+    const notero = getGlobalNotero();
+    const pref = getNoteroPref(NoteroPref.linkedCollectionID);
+    Zotero.log(pref);
+    if (pref) {
+      const client = await notero.getNotionClient();
+      const res = await client.databases.query({ database_id: pref });
+      const results = res.results
+        .map((result: (typeof res.results)[0]) => {
+          if (isFullPage(result)) {
+            return {
+              value: result.id,
+              label: Object.values(result.properties).find(
+                (prop) => prop.type === 'title',
+              )?.title[0]!.plain_text,
+            };
+          }
+        })
+        .filter((item) => item != undefined);
+      Zotero.log(results);
+      setMenuItems(this.associatedLinkElement, results);
+    }
+
+    this.associatedLinkElement.value = this.params.associatedLink;
+    this.syncEnabledElement = getXULElementById('notero-syncEnabled')!;
+    this.syncEnabledElement.checked = this.params.syncEnabled;
+    document.addEventListener('dialogaccept', () => {
+      return this.accept();
+    });
+  }
+  accept(): boolean {
+    console.log('SKIBIDI');
+    window.arguments![0]!.dataOut = {
+      associatedLink: this.associatedLinkElement.value,
+      syncEnabled: this.syncEnabledElement.checked,
+      accepted: true,
+    };
+    return true;
+  }
+}
+
+module.exports = {
+  dialog: new Dialog(),
+};

src/content/prefs/dialog.xhtml

@@ -0,0 +1,36 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>
+<?xml-stylesheet href="chrome://zotero-platform/content/zotero.css" type="text/css"?>
+
+<window type="child" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+    xmlns:html="http://www.w3.org/1999/xhtml" style="width: 100px; height: 100px;" buttons="cancel,accept"
+    onload="notero.dialog.init();">
+    <script>
+        Services.scriptloader.loadSubScript('chrome://zotero/content/customElements.js', this);
+
+        Services.scriptloader.loadSubScript('chrome://notero/content/prefs/dialog.js', this);
+
+
+    </script>
+    <dialog id="notero-collection-dialog" title="Collection Properties" onload="notero.dialog.init();">
+        <div>
+            <label>Collection Settings</label>
+            <grid>
+                <rows>
+                    <row>
+                        <label value="Associated Link:" />
+                        <menulist id="notero-associatedLink">
+                            <menupopup />
+                        </menulist>
+                    </row>
+                    <row>
+                        <label value="Sync Enabled:" />
+                        <checkbox id="notero-syncEnabled" />
+                    </row>
+                </rows>
+            </grid>
+        </div>
+
+    </dialog>
+</window>

src/content/prefs/notero-pref.ts

@@ -3,6 +3,7 @@ import { MissingPrefError } from '../errors';
 
 export enum NoteroPref {
   collectionSyncConfigs = 'collectionSyncConfigs',
+  linkedCollectionID = 'linkedCollectionID',
   notionDatabaseID = 'notionDatabaseID',
   notionToken = 'notionToken',
   pageTitleFormat = 'pageTitleFormat',
@@ -35,8 +36,12 @@ export const PAGE_TITLE_FORMAT_L10N_IDS: Record<
   [PageTitleFormat.itemTitle]: 'notero-page-title-format-item-title',
 };
 
+
+
+
 type NoteroPrefValue = Partial<{
   [NoteroPref.collectionSyncConfigs]: string;
+  [NoteroPref.linkedCollectionID]: string;
   [NoteroPref.notionDatabaseID]: string;
   [NoteroPref.notionToken]: string;
   [NoteroPref.pageTitleFormat]: PageTitleFormat;
@@ -71,6 +76,9 @@ function getPageTitleFormatPref(
   return isPageTitleFormat(value) ? value : undefined;
 }
 
+
+
+
 function convertRawPrefValue<P extends NoteroPref>(
   pref: P,
   value: Zotero.Prefs.Value,
@@ -84,6 +92,7 @@ function convertRawPrefValue<P extends NoteroPref>(
 
   return {
     [NoteroPref.collectionSyncConfigs]: stringPref,
+    [NoteroPref.linkedCollectionID]: stringPref,
     [NoteroPref.notionDatabaseID]: stringPref,
     [NoteroPref.notionToken]: stringPref,
     [NoteroPref.pageTitleFormat]: pageTitleFormatPref,

src/content/prefs/preferences.tsx

@@ -20,32 +20,10 @@ import {
 
 import { PAGE_TITLE_FORMAT_L10N_IDS, PageTitleFormat } from './notero-pref';
 import { SyncConfigsTable } from './sync-configs-table';
+import { MenuItem, setMenuItems } from '../utils/elements';
 
 type ReactDOMClient = typeof ReactDOM & { createRoot: typeof createRoot };
 
-type MenuItem = {
-  disabled?: boolean;
-  l10nId?: FluentMessageId;
-  label?: string;
-  value: string;
-};
-
-function setMenuItems(menuList: XUL.MenuListElement, items: MenuItem[]): void {
-  menuList.menupopup.replaceChildren();
-
-  items.forEach(({ disabled, l10nId, label, value }) => {
-    const item = createXULElement(document, 'menuitem');
-    item.value = value;
-    item.disabled = Boolean(disabled);
-    if (l10nId) {
-      document.l10n.setAttributes(item, l10nId);
-    } else {
-      item.label = label || value;
-    }
-    menuList.menupopup.append(item);
-  });
-}
-
 class Preferences {
   private eventManager!: EventManager;
   private notionAuthManager!: NotionAuthManager;
@@ -54,6 +32,7 @@ class Preferences {
   private notionConnectButton!: XUL.ButtonElement;
   private notionUpgradeConnectionButton!: XUL.ButtonElement;
   private notionDatabaseMenu!: XUL.MenuListElement;
+  private notionLinkedDatabaseMenu!: XUL.MenuListElement;
   private notionError!: XUL.LabelElement;
   private notionWorkspaceLabel!: XUL.LabelElement;
   private pageTitleFormatMenu!: XUL.MenuListElement;
@@ -77,6 +56,9 @@ class Preferences {
     )!;
     this.notionWorkspaceLabel = getXULElementById('notero-notionWorkspace')!;
     this.notionDatabaseMenu = getXULElementById('notero-notionDatabase')!;
+    this.notionLinkedDatabaseMenu = getXULElementById(
+      'notero-notionLinkedDatabase',
+    )!;
     this.notionError = getXULElementById('notero-notionError')!;
     this.pageTitleFormatMenu = getXULElementById('notero-pageTitleFormat')!;
     /* eslint-enable @typescript-eslint/no-non-null-assertion */
@@ -133,9 +115,13 @@ class Preferences {
     const syncEnabled = await document.l10n.formatValue(
       'notero-preferences-sync-enabled-column',
     );
+    const associatedLink = await document.l10n.formatValue(
+      'notero-preferences-associatedLink-column',
+    );
     const columnLabels = {
       collectionFullName: collection || 'Collection',
       syncEnabled: syncEnabled || 'Sync Enabled',
+      associatedLink: associatedLink || 'Associated Link',
     };
 
     (ReactDOM as ReactDOMClient)
@@ -215,6 +201,7 @@ class Preferences {
     let menuItems: MenuItem[] = [];
 
     this.notionDatabaseMenu.disabled = true;
+    this.notionLinkedDatabaseMenu.disabled = true;
 
     try {
       const databases = await this.retrieveNotionDatabases(notion);
@@ -231,8 +218,10 @@ class Preferences {
       });
 
       this.notionDatabaseMenu.disabled = false;
+      this.notionLinkedDatabaseMenu.disabled = false;
     } finally {
       setMenuItems(this.notionDatabaseMenu, menuItems);
+      setMenuItems(this.notionLinkedDatabaseMenu, menuItems);
     }
   }
 

src/content/prefs/preferences.xhtml

@@ -47,6 +47,13 @@
         <menupopup />
       </menulist>
     </hbox>
+    <hbox align="center">
+      <label control="notero-notionLinkedDatabase" data-l10n-id="notero-preferences-notion-linked-database" />
+      <menulist id="notero-notionLinkedDatabase" disabled="true" native="true"
+        preference="extensions.notero.linkedCollectionID">
+        <menupopup />
+      </menulist>
+    </hbox>
   </vbox>
   <label class="notero-error" hidden="true" id="notero-notionError" />
 </groupbox>