From ecca570e3066e432f84bca42503d572cd8697f33 Mon Sep 17 00:00:00 2001
From: Elio Struyf <elio@struyfconsulting.be>
Date: Fri, 24 Feb 2023 19:11:31 +0100
Subject: [PATCH] Extensibility script solution

---
 src/commands/Dashboard.ts                     |  5 +++-
 .../components/Contents/Item.tsx              | 25 ++++++++++++++-----
 2 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/src/commands/Dashboard.ts b/src/commands/Dashboard.ts
index 005473ab..6e3034a4 100644
--- a/src/commands/Dashboard.ts
+++ b/src/commands/Dashboard.ts
@@ -238,7 +238,7 @@ export class Dashboard {
       } 'self' 'unsafe-inline' https://*`,
       `script-src ${
         isProd ? `'nonce-${nonce}'` : `http://${localServerUrl} http://0.0.0.0:${localPort}`
-      } 'unsafe-eval'`,
+      } https://* 'unsafe-eval'`,
       `style-src ${webView.cspSource} 'self' 'unsafe-inline'`,
       `font-src ${webView.cspSource}`,
       `connect-src https://o1022172.ingest.sentry.io ${
@@ -267,6 +267,9 @@ export class Dashboard {
 
         <img style="display:none" src="https://api.visitorbadge.io/api/combined?user=estruyf&repo=frontmatter-usage&countColor=%23263759&slug=${`dashboard-${version.installedVersion}`}" alt="Daily usage" />
 
+        <script src="${webView.asWebviewUri(
+          Uri.parse(`/Users/eliostruyf/blog/web-eliostruyf-hugo/external.js`)
+        )}" nonce="${nonce}"></script>
         <script ${isProd ? `nonce="${nonce}"` : ''} src="${scriptUri}"></script>
       </body>
       </html>
diff --git a/src/dashboardWebView/components/Contents/Item.tsx b/src/dashboardWebView/components/Contents/Item.tsx
index bffeb918..040a945f 100644
--- a/src/dashboardWebView/components/Contents/Item.tsx
+++ b/src/dashboardWebView/components/Contents/Item.tsx
@@ -17,6 +17,10 @@ export interface IItemProps extends Page { }
 
 const PREVIEW_IMAGE_FIELD = 'fmPreviewImage';
 
+declare const fmExternal: {
+  getCardHtml: (filePath: string, data: any) => string | undefined;
+};
+
 export const Item: React.FunctionComponent<IItemProps> = ({
   fmFilePath,
   date,
@@ -77,12 +81,21 @@ export const Item: React.FunctionComponent<IItemProps> = ({
   }, [settings, pageData]);
 
   useEffect(() => {
-    messageHandler.request<string>(DashboardMessage.getCustomHtml, {
-      path: fmFilePath,
-      data: pageData,
-    }).then((html) => {
-      setCustomHtml(html || "");
-    });
+    // messageHandler.request<string>(DashboardMessage.getCustomHtml, {
+    //   path: fmFilePath,
+    //   data: pageData,
+    // }).then((html) => {
+    //   setCustomHtml(html || "");
+    // });
+
+    if (fmExternal && fmExternal.getCardHtml) {
+      const data = fmExternal.getCardHtml(fmFilePath, pageData);
+      if (data) {
+        setCustomHtml(data);
+      } else {
+        setCustomHtml(undefined);
+      }
+    }
   }, []);
 
   if (view === DashboardViewType.Grid) {