Enhancement: Allow UI extensibility out of experimental mode #829

estruyf · Jul 3, 2024 · 5b3223a · 5b3223a
1 parent 2cb6c89
commit 5b3223a
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 34 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -11,6 +11,7 @@
 
 - [#819](https://github.com/estruyf/vscode-front-matter/issues/819): Added new extensibility support for media scripts
 - [#822](https://github.com/estruyf/vscode-front-matter/issues/822): Added docs to the panel & dashboard views
+- [#829](https://github.com/estruyf/vscode-front-matter/issues/829): UI extensibility is now generally available
 
 ### 🐞 Fixes
 

diff --git a/src/commands/Dashboard.ts b/src/commands/Dashboard.ts
@@ -3,7 +3,6 @@ import {
   CONTEXT,
   ExtensionState,
   SETTING_EXPERIMENTAL,
-  SETTING_EXTENSIBILITY_SCRIPTS,
   COMMAND_NAME,
   TelemetryEvent
 } from '../constants';
@@ -34,7 +33,7 @@ import * as l10n from '@vscode/l10n';
 import { LocalizationKey } from '../localization';
 import { DashboardMessage } from '../dashboardWebView/DashboardMessage';
 import { NavigationType } from '../dashboardWebView/models';
-import { ignoreMsgCommand } from '../utils';
+import { getExtensibilityScripts, ignoreMsgCommand } from '../utils';
 
 export class Dashboard {
   private static webview: WebviewPanel | null = null;
@@ -307,20 +306,8 @@ export class Dashboard {
 
     // Get experimental setting
     const experimental = SettingsHelper.get(SETTING_EXPERIMENTAL);
-    const extensibilityScripts = SettingsHelper.get<string[]>(SETTING_EXTENSIBILITY_SCRIPTS) || [];
 
-    const scriptsToLoad: string[] = [];
-    if (experimental) {
-      for (const script of extensibilityScripts) {
-        if (script.startsWith('https://')) {
-          scriptsToLoad.push(script);
-        } else {
-          const absScriptPath = Folders.getAbsFilePath(script);
-          const scriptUri = webView.asWebviewUri(Uri.file(absScriptPath));
-          scriptsToLoad.push(scriptUri.toString());
-        }
-      }
-    }
+    const scriptsToLoad: string[] = getExtensibilityScripts(webView);
 
     const csp = [
       `default-src 'none';`,

diff --git a/src/panelWebView/PanelProvider.ts b/src/panelWebView/PanelProvider.ts
@@ -9,7 +9,7 @@ import {
   FieldsListener,
   LocalizationListener
 } from './../listeners/panel';
-import { SETTING_EXPERIMENTAL, SETTING_EXTENSIBILITY_SCRIPTS, TelemetryEvent } from '../constants';
+import { SETTING_EXPERIMENTAL, TelemetryEvent } from '../constants';
 import {
   CancellationToken,
   Disposable,
@@ -29,7 +29,7 @@ import { Telemetry } from '../helpers/Telemetry';
 import { GitListener, ModeListener } from '../listeners/general';
 import { Folders } from '../commands';
 import { basename } from 'path';
-import { ignoreMsgCommand } from '../utils';
+import { getExtensibilityScripts, ignoreMsgCommand } from '../utils';
 
 export class PanelProvider implements WebviewViewProvider, Disposable {
   public static readonly viewType = 'frontMatter.explorer';
@@ -242,20 +242,8 @@ export class PanelProvider implements WebviewViewProvider, Disposable {
 
     // Get experimental setting
     const experimental = Settings.get(SETTING_EXPERIMENTAL);
-    const extensibilityScripts = Settings.get<string[]>(SETTING_EXTENSIBILITY_SCRIPTS) || [];
-
-    const scriptsToLoad: string[] = [];
-    if (experimental) {
-      for (const script of extensibilityScripts) {
-        if (script.startsWith('https://')) {
-          scriptsToLoad.push(script);
-        } else {
-          const absScriptPath = Folders.getAbsFilePath(script);
-          const scriptUri = webView.asWebviewUri(Uri.file(absScriptPath));
-          scriptsToLoad.push(scriptUri.toString());
-        }
-      }
-    }
+
+    const scriptsToLoad: string[] = getExtensibilityScripts(webView);
 
     const csp = [
       `default-src 'none';`,
@@ -289,9 +277,9 @@ export class PanelProvider implements WebviewViewProvider, Disposable {
       <body>
         <div id="app" data-isProd="${isProd}" data-environment="${
       isBeta ? 'BETA' : 'main'
-    }" data-version="${
-      version.usedVersion
-    }" data-is-crash-disabled="${!Telemetry.isVscodeEnabled()}"></div>
+    }" data-version="${version.usedVersion}" ${
+      experimental ? `data-experimental="${experimental}"` : ''
+    } data-is-crash-disabled="${!Telemetry.isVscodeEnabled()}"></div>
 
       ${(scriptsToLoad || [])
         .map((script) => {

diff --git a/src/utils/getExtensibilityScripts.ts b/src/utils/getExtensibilityScripts.ts
@@ -0,0 +1,21 @@
+import { Uri, Webview } from 'vscode';
+import { Folders } from '../commands';
+import { SETTING_EXTENSIBILITY_SCRIPTS } from '../constants';
+import { Settings } from '../helpers';
+
+export const getExtensibilityScripts = (webview: Webview) => {
+  const extensibilityScripts = Settings.get<string[]>(SETTING_EXTENSIBILITY_SCRIPTS) || [];
+
+  const scriptsToLoad: string[] = [];
+  for (const script of extensibilityScripts) {
+    if (script.startsWith('https://')) {
+      scriptsToLoad.push(script);
+    } else {
+      const absScriptPath = Folders.getAbsFilePath(script);
+      const scriptUri = webview.asWebviewUri(Uri.file(absScriptPath));
+      scriptsToLoad.push(scriptUri.toString());
+    }
+  }
+
+  return scriptsToLoad;
+};
diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -5,6 +5,7 @@ export * from './existsAsync';
 export * from './fetchWithTimeout';
 export * from './fieldWhenClause';
 export * from './flattenObjectKeys';
+export * from './getExtensibilityScripts';
 export * from './getLocalizationFile';
 export * from './ignoreMsgCommand';
 export * from './isWindows';