client/src/root-helpers/plugins-manager.ts

   1 /* eslint-disable @typescript-eslint/no-implied-eval */
   2 import * as debug from 'debug'
   3 import { firstValueFrom, ReplaySubject } from 'rxjs'
   4 import { first, shareReplay } from 'rxjs/operators'
   5 import { RegisterClientHelpers } from 'src/types/register-client-option.model'
   6 import { getHookType, internalRunHook } from '@shared/core-utils/plugins/hooks'
   7 import {
   8   ClientHookName,
   9   clientHookObject,
  10   ClientScript,
  11   HTMLServerConfig,
  12   PluginClientScope,
  13   PluginType,
  14   RegisterClientFormFieldOptions,
  15   RegisterClientHookOptions,
  16   RegisterClientSettingsScript,
  17   RegisterClientVideoFieldOptions,
  18   ServerConfigPlugin
  19 } from '../../../shared/models'
  20 import { environment } from '../environments/environment'
  21 import { ClientScript as ClientScriptModule } from '../types/client-script.model'
  22
  23 interface HookStructValue extends RegisterClientHookOptions {
  24   plugin: ServerConfigPlugin
  25   clientScript: ClientScript
  26 }
  27
  28 type Hooks = { [ name: string ]: HookStructValue[] }
  29
  30 type PluginInfo = {
  31   plugin: ServerConfigPlugin
  32   clientScript: ClientScript
  33   pluginType: PluginType
  34   isTheme: boolean
  35 }
  36
  37 type PeertubeHelpersFactory = (pluginInfo: PluginInfo) => RegisterClientHelpers
  38 type OnFormFields = (options: RegisterClientFormFieldOptions, videoFormOptions: RegisterClientVideoFieldOptions) => void
  39 type OnSettingsScripts = (pluginInfo: PluginInfo, options: RegisterClientSettingsScript) => void
  40
  41 const logger = debug('peertube:plugins')
  42
  43 class PluginsManager {
  44   private hooks: Hooks = {}
  45
  46   private scopes: { [ scopeName: string ]: PluginInfo[] } = {}
  47
  48   private loadedScripts: { [ script: string ]: boolean } = {}
  49   private loadedScopes: PluginClientScope[] = []
  50   private loadingScopes: { [id in PluginClientScope]?: boolean } = {}
  51
  52   private pluginsLoaded: { [ scope in PluginClientScope ]: ReplaySubject<boolean> } = {
  53     common: new ReplaySubject<boolean>(1),
  54     'admin-plugin': new ReplaySubject<boolean>(1),
  55     search: new ReplaySubject<boolean>(1),
  56     'video-watch': new ReplaySubject<boolean>(1),
  57     signup: new ReplaySubject<boolean>(1),
  58     login: new ReplaySubject<boolean>(1),
  59     'video-edit': new ReplaySubject<boolean>(1),
  60     embed: new ReplaySubject<boolean>(1)
  61   }
  62
  63   private readonly peertubeHelpersFactory: PeertubeHelpersFactory
  64   private readonly onFormFields: OnFormFields
  65   private readonly onSettingsScripts: OnSettingsScripts
  66
  67   constructor (options: {
  68     peertubeHelpersFactory: PeertubeHelpersFactory
  69     onFormFields?: OnFormFields
  70     onSettingsScripts?: OnSettingsScripts
  71   }) {
  72     this.peertubeHelpersFactory = options.peertubeHelpersFactory
  73     this.onFormFields = options.onFormFields
  74     this.onSettingsScripts = options.onSettingsScripts
  75   }
  76
  77   static getPluginPathPrefix (isTheme: boolean) {
  78     return isTheme ? '/themes' : '/plugins'
  79   }
  80
  81   loadPluginsList (config: HTMLServerConfig) {
  82     for (const plugin of config.plugin.registered) {
  83       this.addPlugin(plugin)
  84     }
  85   }
  86
  87   async runHook<T> (hookName: ClientHookName, result?: T, params?: any) {
  88     if (!this.hooks[hookName]) return result
  89
  90     const hookType = getHookType(hookName)
  91
  92     for (const hook of this.hooks[hookName]) {
  93       console.log('Running hook %s of plugin %s.', hookName, hook.plugin.name)
  94
  95       result = await internalRunHook(hook.handler, hookType, result, params, err => {
  96         console.error('Cannot run hook %s of script %s of plugin %s.', hookName, hook.clientScript.script, hook.plugin.name, err)
  97       })
  98     }
  99
 100     return result
 101   }
 102
 103   ensurePluginsAreLoaded (scope: PluginClientScope) {
 104     this.loadPluginsByScope(scope)
 105
 106     const obs = this.pluginsLoaded[scope].asObservable()
 107                .pipe(first(), shareReplay())
 108
 109     return firstValueFrom(obs)
 110   }
 111
 112   async reloadLoadedScopes () {
 113     for (const scope of this.loadedScopes) {
 114       await this.loadPluginsByScope(scope, true)
 115     }
 116   }
 117
 118   addPlugin (plugin: ServerConfigPlugin, isTheme = false) {
 119     const pathPrefix = PluginsManager.getPluginPathPrefix(isTheme)
 120
 121     for (const key of Object.keys(plugin.clientScripts)) {
 122       const clientScript = plugin.clientScripts[key]
 123
 124       for (const scope of clientScript.scopes) {
 125         if (!this.scopes[scope]) this.scopes[scope] = []
 126
 127         this.scopes[scope].push({
 128           plugin,
 129           clientScript: {
 130             script: `${pathPrefix}/${plugin.name}/${plugin.version}/client-scripts/${clientScript.script}`,
 131             scopes: clientScript.scopes
 132           },
 133           pluginType: isTheme ? PluginType.THEME : PluginType.PLUGIN,
 134           isTheme
 135         })
 136
 137         this.loadedScripts[clientScript.script] = false
 138       }
 139     }
 140   }
 141
 142   removePlugin (plugin: ServerConfigPlugin) {
 143     for (const key of Object.keys(this.scopes)) {
 144       this.scopes[key] = this.scopes[key].filter(o => o.plugin.name !== plugin.name)
 145     }
 146   }
 147
 148   async loadPluginsByScope (scope: PluginClientScope, isReload = false) {
 149     if (this.loadingScopes[scope]) return
 150     if (!isReload && this.loadedScopes.includes(scope)) return
 151
 152     this.loadingScopes[scope] = true
 153
 154     logger('Loading scope %s', scope)
 155
 156     try {
 157       if (!isReload) this.loadedScopes.push(scope)
 158
 159       const toLoad = this.scopes[scope]
 160       if (!Array.isArray(toLoad)) {
 161         this.loadingScopes[scope] = false
 162         this.pluginsLoaded[scope].next(true)
 163
 164         logger('Nothing to load for scope %s', scope)
 165         return
 166       }
 167
 168       const promises: Promise<any>[] = []
 169       for (const pluginInfo of toLoad) {
 170         const clientScript = pluginInfo.clientScript
 171
 172         if (this.loadedScripts[clientScript.script]) continue
 173
 174         promises.push(this.loadPlugin(pluginInfo))
 175
 176         this.loadedScripts[clientScript.script] = true
 177       }
 178
 179       await Promise.all(promises)
 180
 181       this.pluginsLoaded[scope].next(true)
 182       this.loadingScopes[scope] = false
 183
 184       logger('Scope %s loaded', scope)
 185     } catch (err) {
 186       console.error('Cannot load plugins by scope %s.', scope, err)
 187     }
 188   }
 189
 190   private loadPlugin (pluginInfo: PluginInfo) {
 191     const { plugin, clientScript } = pluginInfo
 192
 193     const registerHook = (options: RegisterClientHookOptions) => {
 194       if (clientHookObject[options.target] !== true) {
 195         console.error('Unknown hook %s of plugin %s. Skipping.', options.target, plugin.name)
 196         return
 197       }
 198
 199       if (!this.hooks[options.target]) this.hooks[options.target] = []
 200
 201       this.hooks[options.target].push({
 202         plugin,
 203         clientScript,
 204         target: options.target,
 205         handler: options.handler,
 206         priority: options.priority || 0
 207       })
 208     }
 209
 210     const registerVideoField = (commonOptions: RegisterClientFormFieldOptions, videoFormOptions: RegisterClientVideoFieldOptions) => {
 211       if (!this.onFormFields) {
 212         throw new Error('Video field registration is not supported')
 213       }
 214
 215       return this.onFormFields(commonOptions, videoFormOptions)
 216     }
 217
 218     const registerSettingsScript = (options: RegisterClientSettingsScript) => {
 219       if (!this.onSettingsScripts) {
 220         throw new Error('Registering settings script is not supported')
 221       }
 222
 223       return this.onSettingsScripts(pluginInfo, options)
 224     }
 225
 226     const peertubeHelpers = this.peertubeHelpersFactory(pluginInfo)
 227
 228     console.log('Loading script %s of plugin %s.', clientScript.script, plugin.name)
 229
 230     const absURL = (environment.apiUrl || window.location.origin) + clientScript.script
 231     return dynamicImport(absURL)
 232       .then((script: ClientScriptModule) => script.register({ registerHook, registerVideoField, registerSettingsScript, peertubeHelpers }))
 233       .then(() => this.sortHooksByPriority())
 234       .catch(err => console.error('Cannot import or register plugin %s.', pluginInfo.plugin.name, err))
 235   }
 236
 237   private sortHooksByPriority () {
 238     for (const hookName of Object.keys(this.hooks)) {
 239       this.hooks[hookName].sort((a, b) => {
 240         return b.priority - a.priority
 241       })
 242     }
 243   }
 244 }
 245
 246 export {
 247   PluginsManager,
 248
 249   PluginInfo,
 250   PeertubeHelpersFactory,
 251   OnFormFields,
 252   OnSettingsScripts
 253 }
 254
 255 // ---------------------------------------------------------------------------
 256
 257 async function dynamicImport (url: string) {
 258   try {
 259     // eslint-disable-next-line no-new-func
 260     return new Function(`return import('${url}')`)()
 261   } catch {
 262     console.log('Fallback to import polyfill')
 263
 264     return new Promise((resolve, reject) => {
 265       const vector = '$importModule$' + Math.random().toString(32).slice(2)
 266       const script = document.createElement('script')
 267
 268       const destructor = () => {
 269         delete window[vector]
 270         script.onerror = null
 271         script.onload = null
 272         script.remove()
 273         URL.revokeObjectURL(script.src)
 274         script.src = ''
 275       }
 276
 277       script.defer = true
 278       script.type = 'module'
 279
 280       script.onerror = () => {
 281         reject(new Error(`Failed to import: ${url}`))
 282         destructor()
 283       }
 284       script.onload = () => {
 285         resolve(window[vector])
 286         destructor()
 287       }
 288       const loader = `import * as m from "${url}"; window.${vector} = m;` // export Module
 289       const blob = new Blob([ loader ], { type: 'text/javascript' })
 290       script.src = URL.createObjectURL(blob)
 291
 292       document.head.appendChild(script)
 293     })
 294   }
 295 }