From f401ce97435c8f3ef49341635e255870101b0969 Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <madsr@hey.com>
Date: Tue, 7 Jun 2022 11:52:58 +0200
Subject: [PATCH] temp POC solution to load "external" extensions from public
 folder

---
 src/Umbraco.Web.UI.Client/APP_PLUGINS/readme.md             | 1 -
 .../{APP_PLUGINS => public/App_Plugins}/property-editor.js  | 0
 src/Umbraco.Web.UI.Client/public/App_Plugins/readme.md      | 5 +++++
 .../{APP_PLUGINS => public/App_Plugins}/section.js          | 0
 .../src/core/extension/load-extension.function.ts           | 6 +++---
 .../src/mocks/domains/manifests.handlers.ts                 | 6 ++++--
 6 files changed, 12 insertions(+), 6 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI.Client/APP_PLUGINS/readme.md
 rename src/Umbraco.Web.UI.Client/{APP_PLUGINS => public/App_Plugins}/property-editor.js (100%)
 create mode 100644 src/Umbraco.Web.UI.Client/public/App_Plugins/readme.md
 rename src/Umbraco.Web.UI.Client/{APP_PLUGINS => public/App_Plugins}/section.js (100%)

diff --git a/src/Umbraco.Web.UI.Client/APP_PLUGINS/readme.md b/src/Umbraco.Web.UI.Client/APP_PLUGINS/readme.md
deleted file mode 100644
index c273f4fdac..0000000000
--- a/src/Umbraco.Web.UI.Client/APP_PLUGINS/readme.md
+++ /dev/null
@@ -1 +0,0 @@
-// TODO: write description
diff --git a/src/Umbraco.Web.UI.Client/APP_PLUGINS/property-editor.js b/src/Umbraco.Web.UI.Client/public/App_Plugins/property-editor.js
similarity index 100%
rename from src/Umbraco.Web.UI.Client/APP_PLUGINS/property-editor.js
rename to src/Umbraco.Web.UI.Client/public/App_Plugins/property-editor.js
diff --git a/src/Umbraco.Web.UI.Client/public/App_Plugins/readme.md b/src/Umbraco.Web.UI.Client/public/App_Plugins/readme.md
new file mode 100644
index 0000000000..57d6e5a1eb
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/public/App_Plugins/readme.md
@@ -0,0 +1,5 @@
+# The App_Plugins Mock Directory
+
+This App_Plugins directory is a mock for any external extensions/packages files added to the CMS. These files are referenced through manifests.
+
+A [mocked server request](../../src/mocks/domains/manifests.handlers.ts) is made when the app starts to fetch manifest files.
diff --git a/src/Umbraco.Web.UI.Client/APP_PLUGINS/section.js b/src/Umbraco.Web.UI.Client/public/App_Plugins/section.js
similarity index 100%
rename from src/Umbraco.Web.UI.Client/APP_PLUGINS/section.js
rename to src/Umbraco.Web.UI.Client/public/App_Plugins/section.js
diff --git a/src/Umbraco.Web.UI.Client/src/core/extension/load-extension.function.ts b/src/Umbraco.Web.UI.Client/src/core/extension/load-extension.function.ts
index ff834b04cc..9ac0227cf2 100644
--- a/src/Umbraco.Web.UI.Client/src/core/extension/load-extension.function.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/extension/load-extension.function.ts
@@ -7,13 +7,14 @@ export function loadExtension(manifest: UmbExtensionManifest): Promise<object |
 
   // TODO: verify if this is acceptable solution.
   if (typeof manifest.js === 'string') {
-    return import(/* @vite-ignore */ manifest.js);
-    /*
+    // TODO: change this back to dynamic import after POC. Vite complains about the dynamic imports in the public folder but doesn't include the temp app_plugins folder in the final build.
+    // return import(/* @vite-ignore */ manifest.js);
       return new Promise((resolve, reject) => {
           const script  = document.createElement('script');
           script.type = 'text/javascript';
           //script.charset = 'utf-8';
           script.async = true;
+          script.type = 'module';
           script.src = manifest.js as string;
           script.onload = function () {
             resolve(null);
@@ -23,7 +24,6 @@ export function loadExtension(manifest: UmbExtensionManifest): Promise<object |
           };
           document.body.appendChild(script);
       }) as Promise<null>;
-      */
   }
 
   console.log('-- Extension does not have any referenced JS');
diff --git a/src/Umbraco.Web.UI.Client/src/mocks/domains/manifests.handlers.ts b/src/Umbraco.Web.UI.Client/src/mocks/domains/manifests.handlers.ts
index ad864220ff..de2f6b395b 100644
--- a/src/Umbraco.Web.UI.Client/src/mocks/domains/manifests.handlers.ts
+++ b/src/Umbraco.Web.UI.Client/src/mocks/domains/manifests.handlers.ts
@@ -12,7 +12,8 @@ export const handlers = [
             type: 'section',
             alias: 'My.Section.Custom',
             name: 'Custom Section',
-            js: '/APP_PLUGINS/section.js',
+            js: '/App_Plugins/section.js',
+            elementName: 'my-section-custom',
             meta: {
               pathname: 'my-custom',
               weight: 1,
@@ -22,7 +23,8 @@ export const handlers = [
             type: 'propertyEditorUI',
             alias: 'My.PropertyEditorUI.Custom',
             name: 'My Custom Property Editor UI',
-            js: '/APP_PLUGINS/property-editor.js',
+            js: '/App_Plugins/property-editor.js',
+            elementName: 'my-property-editor-ui-custom',
             meta: {
               icon: 'document',
               group: 'common',