improve(plugin): support register page bar menu action item

libs/src/LSPlugin.ts

@@ -188,6 +188,11 @@ export interface IAppProxy {
     opts: { key: string, template: string }
   ) => boolean
 
+  registerPagebarMenuItem: (
+    tag: string,
+    action: (e: IHookEvent & { page: string }) => void
+  ) => unknown
+
   // events
   onCurrentGraphChanged: IUserHook
   onThemeModeChanged: IUserHook<{ mode: 'dark' | 'light' }>
@@ -232,10 +237,10 @@ export interface IEditorProxy extends Record<string, any> {
    * @param tag - displayed name of command
    * @param action - can be a single callback function to run when the command is called
    */
-  registerBlockContextMenu: (
+  registerBlockContextMenuItem: (
     tag: string,
     action: BlockCommandCallback
-  ) => boolean
+  ) => unknown
 
   // block related APIs
 

libs/src/LSPlugin.user.ts

@@ -10,7 +10,7 @@ import {
   BlockCommandCallback,
   StyleString,
   ThemeOptions,
-  UIOptions
+  UIOptions, IHookEvent
 } from './LSPlugin'
 import Debug from 'debug'
 import * as CSS from 'csstype'
@@ -25,6 +25,35 @@ declare global {
 
 const debug = Debug('LSPlugin:user')
 
+/**
+ * @param type
+ * @param opts
+ * @param action
+ */
+function registerSimpleCommand (
+  this: LSPluginUser,
+  type: string,
+  opts: {
+    key: string,
+    label: string
+  },
+  action: BlockCommandCallback
+) {
+  if (typeof action !== 'function') {
+    return false
+  }
+
+  const { key, label } = opts
+  const eventKey = `SimpleCommandHook${key}${++registeredCmdUid}`
+
+  this.Editor['on' + eventKey](action)
+
+  this.caller?.call(`api:call`, {
+    method: 'register-plugin-simple-command',
+    args: [this.baseInfo.id, [{ key, label, type }, ['editor/hook', eventKey]]]
+  })
+}
+
 const app: Partial<IAppProxy> = {
   registerUIItem (
     type: 'toolbar' | 'pagebar',
@@ -38,6 +67,27 @@ const app: Partial<IAppProxy> = {
       args: [pid, type, opts]
     })
 
+    return false
+  },
+
+  registerPagebarMenuItem (
+    this: LSPluginUser,
+    tag: string,
+    action: (e: IHookEvent & { page: string }) => void
+  ): unknown {
+    if (typeof action !== 'function') {
+      return false
+    }
+
+    const key = tag + '_' + this.baseInfo.id
+    const label = tag
+    const type = 'pagebar-menu-item'
+
+    registerSimpleCommand.call(this,
+      type, {
+        key, label
+      }, action)
+
     return false
   }
 }
@@ -95,28 +145,25 @@ const editor: Partial<IEditorProxy> = {
     return false
   },
 
-  registerBlockContextMenu (
+  registerBlockContextMenuItem (
     this: LSPluginUser,
     tag: string,
     action: BlockCommandCallback
-  ): boolean {
+  ): unknown {
     if (typeof action !== 'function') {
       return false
     }
 
-    const key = tag
+    const key = + '_' + this.baseInfo.id
     const label = tag
-    const type = 'block-context-menu'
-    const eventKey = `SimpleCommandHook${tag}${++registeredCmdUid}`
-
-    this.Editor['on' + eventKey](action)
+    const type = 'block-context-menu-item'
 
-    this.caller?.call(`api:call`, {
-      method: 'register-plugin-simple-command',
-      args: [this.baseInfo.id, [{ key, label, type }, ['editor/hook', eventKey]]]
-    })
+    registerSimpleCommand.call(this,
+      type, {
+        key, label
+      }, action)
 
-    return true
+    return false
   }
 }
 

src/main/frontend/components/content.cljs

@@ -197,12 +197,12 @@
            "Cut")
 
           (when (state/sub [:plugin/simple-commands])
-            (when-let [cmds (state/get-plugins-commands-with-type :block-context-menu)]
+            (when-let [cmds (state/get-plugins-commands-with-type :block-context-menu-item)]
               (for [[_ {:keys [key label] :as cmd} action pid] cmds]
                 (ui/menu-link
                   {:key      key
                    :on-click #(commands/exec-plugin-simple-command!
-                                pid (assoc cmd :block-id block-id) action)}
+                                pid (assoc cmd :uuid block-id) action)}
                   label))))
 
           (when (state/sub [:ui/developer-mode?])

src/main/frontend/components/page.cljs

@@ -6,6 +6,7 @@
             [frontend.handler.page :as page-handler]
             [frontend.handler.ui :as ui-handler]
             [frontend.handler.common :as common-handler]
+            [frontend.commands :as commands]
             [frontend.handler.plugin :as plugin-handler]
             [frontend.handler.route :as route-handler]
             [frontend.handler.graph :as graph-handler]
@@ -350,6 +351,12 @@
                                                      (if public? false true))
                                                     (state/close-modal!))}})
 
+                                     (when plugin-handler/lsp-enabled?
+                                       (for [[_ {:keys [key label] :as cmd} action pid] (state/get-plugins-commands-with-type :pagebar-menu-item)]
+                                         {:title label
+                                          :options {:on-click #(commands/exec-plugin-simple-command!
+                                                                 pid (assoc cmd :page (state/get-current-page)) action)}}))
+
                                      (when developer-mode?
                                        {:title   "(Dev) Show page data"
                                         :options {:on-click (fn []
@@ -367,15 +374,15 @@
                                     (remove nil?)))]
                    [:div.flex.flex-row
 
-                    (plugins/hook-ui-slot :page-head-actions-slotted nil)
-
                     (when plugin-handler/lsp-enabled?
+                      (plugins/hook-ui-slot :page-head-actions-slotted nil)
                       (plugins/hook-ui-items :pagebar))
 
                     [:a.opacity-60.hover:opacity-100.page-op.mr-1
                      {:title "Search in current page"
                       :on-click #(route-handler/go-to-search! :page)}
                      svg/search]
+
                     (ui/dropdown-with-links
                      (fn [{:keys [toggle-fn]}]
                        [:a.cp__vertical-menu-button