X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Froot-helpers%2Fplugins-manager.ts;h=61731032ad7f8cbed25bddd558370b246fdc01f2;hb=462a833e4c14b84224182adbe9e963535c165ad1;hp=f919db8afb4ebb27c1a3164c72cd7a2fd5a97959;hpb=cf21b2cbef61929177b9c09b5e017c3b7eb8535d;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/root-helpers/plugins-manager.ts b/client/src/root-helpers/plugins-manager.ts index f919db8af..61731032a 100644 --- a/client/src/root-helpers/plugins-manager.ts +++ b/client/src/root-helpers/plugins-manager.ts @@ -1,41 +1,52 @@ +/* eslint-disable @typescript-eslint/no-implied-eval */ import * as debug from 'debug' -import { ReplaySubject } from 'rxjs' +import { firstValueFrom, ReplaySubject } from 'rxjs' import { first, shareReplay } from 'rxjs/operators' import { RegisterClientHelpers } from 'src/types/register-client-option.model' import { getHookType, internalRunHook } from '@shared/core-utils/plugins/hooks' import { ClientHookName, clientHookObject, - ClientScript, + ClientScriptJSON, HTMLServerConfig, PluginClientScope, PluginType, RegisterClientFormFieldOptions, RegisterClientHookOptions, - RegisterClientSettingsScript, + RegisterClientRouteOptions, + RegisterClientSettingsScriptOptions, RegisterClientVideoFieldOptions, + RegisteredExternalAuthConfig, ServerConfigPlugin -} from '../../../shared/models' +} from '@shared/models' import { environment } from '../environments/environment' -import { ClientScript as ClientScriptModule } from '../types/client-script.model' +import { ClientScript } from '../types' interface HookStructValue extends RegisterClientHookOptions { plugin: ServerConfigPlugin - clientScript: ClientScript + clientScript: ClientScriptJSON } type Hooks = { [ name: string ]: HookStructValue[] } type PluginInfo = { plugin: ServerConfigPlugin - clientScript: ClientScript + clientScript: ClientScriptJSON pluginType: PluginType isTheme: boolean } type PeertubeHelpersFactory = (pluginInfo: PluginInfo) => RegisterClientHelpers -type OnFormFields = (options: RegisterClientFormFieldOptions, videoFormOptions: RegisterClientVideoFieldOptions) => void -type OnSettingsScripts = (pluginInfo: PluginInfo, options: RegisterClientSettingsScript) => void + +type OnFormFields = ( + pluginInfo: PluginInfo, + options: RegisterClientFormFieldOptions, + videoFormOptions: RegisterClientVideoFieldOptions +) => void + +type OnSettingsScripts = (pluginInfo: PluginInfo, options: RegisterClientSettingsScriptOptions) => void + +type OnClientRoute = (options: RegisterClientRouteOptions) => void const logger = debug('peertube:plugins') @@ -62,21 +73,29 @@ class PluginsManager { private readonly peertubeHelpersFactory: PeertubeHelpersFactory private readonly onFormFields: OnFormFields private readonly onSettingsScripts: OnSettingsScripts + private readonly onClientRoute: OnClientRoute constructor (options: { peertubeHelpersFactory: PeertubeHelpersFactory onFormFields?: OnFormFields onSettingsScripts?: OnSettingsScripts + onClientRoute?: OnClientRoute }) { this.peertubeHelpersFactory = options.peertubeHelpersFactory this.onFormFields = options.onFormFields this.onSettingsScripts = options.onSettingsScripts + this.onClientRoute = options.onClientRoute } static getPluginPathPrefix (isTheme: boolean) { return isTheme ? '/themes' : '/plugins' } + static getExternalAuthHref (auth: RegisteredExternalAuthConfig) { + return environment.apiUrl + `/plugins/${auth.name}/${auth.version}/auth/${auth.authName}` + + } + loadPluginsList (config: HTMLServerConfig) { for (const plugin of config.plugin.registered) { this.addPlugin(plugin) @@ -102,9 +121,10 @@ class PluginsManager { ensurePluginsAreLoaded (scope: PluginClientScope) { this.loadPluginsByScope(scope) - return this.pluginsLoaded[scope].asObservable() + const obs = this.pluginsLoaded[scope].asObservable() .pipe(first(), shareReplay()) - .toPromise() + + return firstValueFrom(obs) } async reloadLoadedScopes () { @@ -154,7 +174,7 @@ class PluginsManager { try { if (!isReload) this.loadedScopes.push(scope) - const toLoad = this.scopes[ scope ] + const toLoad = this.scopes[scope] if (!Array.isArray(toLoad)) { this.loadingScopes[scope] = false this.pluginsLoaded[scope].next(true) @@ -167,11 +187,11 @@ class PluginsManager { for (const pluginInfo of toLoad) { const clientScript = pluginInfo.clientScript - if (this.loadedScripts[ clientScript.script ]) continue + if (this.loadedScripts[clientScript.script]) continue promises.push(this.loadPlugin(pluginInfo)) - this.loadedScripts[ clientScript.script ] = true + this.loadedScripts[clientScript.script] = true } await Promise.all(promises) @@ -210,10 +230,10 @@ class PluginsManager { throw new Error('Video field registration is not supported') } - return this.onFormFields(commonOptions, videoFormOptions) + return this.onFormFields(pluginInfo, commonOptions, videoFormOptions) } - const registerSettingsScript = (options: RegisterClientSettingsScript) => { + const registerSettingsScript = (options: RegisterClientSettingsScriptOptions) => { if (!this.onSettingsScripts) { throw new Error('Registering settings script is not supported') } @@ -221,13 +241,29 @@ class PluginsManager { return this.onSettingsScripts(pluginInfo, options) } + const registerClientRoute = (options: RegisterClientRouteOptions) => { + if (!this.onClientRoute) { + throw new Error('Registering client route is not supported') + } + + return this.onClientRoute(options) + } + const peertubeHelpers = this.peertubeHelpersFactory(pluginInfo) console.log('Loading script %s of plugin %s.', clientScript.script, plugin.name) const absURL = (environment.apiUrl || window.location.origin) + clientScript.script - return import(/* webpackIgnore: true */ absURL) - .then((script: ClientScriptModule) => script.register({ registerHook, registerVideoField, registerSettingsScript, peertubeHelpers })) + return dynamicImport(absURL) + .then((script: ClientScript) => { + return script.register({ + registerHook, + registerVideoField, + registerSettingsScript, + registerClientRoute, + peertubeHelpers + }) + }) .then(() => this.sortHooksByPriority()) .catch(err => console.error('Cannot import or register plugin %s.', pluginInfo.plugin.name, err)) } @@ -249,3 +285,45 @@ export { OnFormFields, OnSettingsScripts } + +// --------------------------------------------------------------------------- + +async function dynamicImport (url: string) { + try { + // eslint-disable-next-line no-new-func + return new Function(`return import('${url}')`)() + } catch { + console.log('Fallback to import polyfill') + + return new Promise((resolve, reject) => { + const vector = '$importModule$' + Math.random().toString(32).slice(2) + const script = document.createElement('script') + + const destructor = () => { + delete window[vector] + script.onerror = null + script.onload = null + script.remove() + URL.revokeObjectURL(script.src) + script.src = '' + } + + script.defer = true + script.type = 'module' + + script.onerror = () => { + reject(new Error(`Failed to import: ${url}`)) + destructor() + } + script.onload = () => { + resolve(window[vector]) + destructor() + } + const loader = `import * as m from "${url}"; window.${vector} = m;` // export Module + const blob = new Blob([ loader ], { type: 'text/javascript' }) + script.src = URL.createObjectURL(blob) + + document.head.appendChild(script) + }) + } +}