Example of potential plugin implementation

client/pages/item/_id/index.vue

@@ -364,6 +364,9 @@ export default {
     showCollectionsButton() {
       return this.isBook && this.userCanUpdate
     },
+    pluginExtensions() {
+      return this.$store.getters['getPluginExtensions']('item.detail.actions')
+    },
     contextMenuItems() {
       const items = []
 
@@ -429,6 +432,18 @@ export default {
         })
       }
 
+      if (this.pluginExtensions.length) {
+        this.pluginExtensions.forEach((plugin) => {
+          const pluginSlug = plugin.slug
+          plugin.extensions.forEach((pext) => {
+            items.push({
+              text: pext.label,
+              action: `plugin-${pluginSlug}-action-${pext.name}`
+            })
+          })
+        })
+      }
+
       return items
     }
   },
@@ -763,7 +778,31 @@ export default {
       } else if (action === 'share') {
         this.$store.commit('setSelectedLibraryItem', this.libraryItem)
         this.$store.commit('globals/setShareModal', this.mediaItemShare)
+      } else if (action.startsWith('plugin-')) {
+        const actionStrSplit = action.replace('plugin-', '').split('-action-')
+        const pluginSlug = actionStrSplit[0]
+        const pluginAction = actionStrSplit[1]
+        console.log('Plugin action for', pluginSlug, 'with action', pluginAction)
+        this.onPluginAction(pluginSlug, pluginAction)
       }
+    },
+    onPluginAction(pluginSlug, pluginAction) {
+      this.$axios
+        .$post(`/api/plugins/action`, {
+          pluginSlug,
+          pluginAction,
+          target: 'item.detail.actions',
+          data: {
+            entityId: this.libraryItemId,
+            entityType: 'libraryItem'
+          }
+        })
+        .then((data) => {
+          console.log('Plugin action response', data)
+        })
+        .catch((error) => {
+          console.error('Plugin action failed', error)
+        })
     }
   },
   mounted() {

client/pages/login.vue

@@ -166,10 +166,11 @@ export default {
 
       location.reload()
     },
-    setUser({ user, userDefaultLibraryId, serverSettings, Source, ereaderDevices }) {
+    setUser({ user, userDefaultLibraryId, serverSettings, Source, ereaderDevices, pluginExtensions }) {
       this.$store.commit('setServerSettings', serverSettings)
       this.$store.commit('setSource', Source)
       this.$store.commit('libraries/setEReaderDevices', ereaderDevices)
+      this.$store.commit('setPluginExtensions', pluginExtensions)
       this.$setServerLanguageCode(serverSettings.language)
 
       if (serverSettings.chromecastEnabled) {

client/store/index.js

@@ -28,7 +28,8 @@ export const state = () => ({
   openModal: null,
   innerModalOpen: false,
   lastBookshelfScrollData: {},
-  routerBasePath: '/'
+  routerBasePath: '/',
+  pluginExtensions: []
 })
 
 export const getters = {
@@ -61,6 +62,19 @@ export const getters = {
   getHomeBookshelfView: (state) => {
     if (!state.serverSettings || isNaN(state.serverSettings.homeBookshelfView)) return Constants.BookshelfView.STANDARD
     return state.serverSettings.homeBookshelfView
+  },
+  getPluginExtensions: (state) => (target) => {
+    return state.pluginExtensions
+      .map((pext) => {
+        const extensionsMatchingTarget = pext.extensions.filter((ext) => ext.target === target)
+        if (!extensionsMatchingTarget.length) return null
+        return {
+          name: pext.name,
+          slug: pext.slug,
+          extensions: extensionsMatchingTarget
+        }
+      })
+      .filter(Boolean)
   }
 }
 
@@ -239,5 +253,8 @@ export const mutations = {
   },
   setInnerModalOpen(state, val) {
     state.innerModalOpen = val
+  },
+  setPluginExtensions(state, val) {
+    state.pluginExtensions = val
   }
 }