From 41edf41e6b1a947a473be1ddf161b517f51b3795 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Igor=20Ste=CC=A8pien=CC=81?= <igor@istepien.dev>
Date: Tue, 17 Oct 2023 01:43:57 +0200
Subject: [PATCH] Bootstrap dynamic imports changes

---
 .../useBootstrapComponentDynamicImport.js     | 35 +++++++++++++------
 1 file changed, 25 insertions(+), 10 deletions(-)

diff --git a/_dev/js/theme/utils/dynamicImports/useBootstrapComponentDynamicImport.js b/_dev/js/theme/utils/dynamicImports/useBootstrapComponentDynamicImport.js
index fcf1ad87..b2ab0477 100644
--- a/_dev/js/theme/utils/dynamicImports/useBootstrapComponentDynamicImport.js
+++ b/_dev/js/theme/utils/dynamicImports/useBootstrapComponentDynamicImport.js
@@ -10,6 +10,21 @@ const useBootstrapComponentDynamicImport = (importFiles, {
   let filesLoaded = false;
   const callStack = [];
   const jQueryCallStack = [];
+  const instancesMap = new Map();
+
+  const setInstanceInMap = (element, instance) => {
+    if (!instancesMap.has(element)) {
+      instancesMap.set(element, instance);
+    }
+  }
+
+  const getInstanceFromMap = (element) => {
+    if (!instancesMap.has(element)) {
+      return null;
+    }
+
+    return instancesMap.get(element);
+  }
 
   if (!componentName) {
     throw new Error('Component name is required');
@@ -40,18 +55,18 @@ const useBootstrapComponentDynamicImport = (importFiles, {
     const pluginInstance = getComponentInstance(element);
 
     if (pluginInstance) {
-      return pluginInstance.instanceProxy;
+      return pluginInstance.proxyInstance;
     }
 
-    return new ComponentObjectConstructorFunction(element);
-  }
+    const proxyInstance = new ComponentObjectConstructorFunction(element);
 
-  const getComponentInstance = (element) => {
-    const pluginInstance = callStack.find(({ element: instanceElement }) => instanceElement === element);
+    setInstanceInMap(element, proxyInstance);
 
-    return pluginInstance ? pluginInstance.componentInstance : null;
+    return proxyInstance;
   }
 
+  const getComponentInstance = (element) => getInstanceFromMap(element);
+
   const proxyFactory = (pluginInstance) => {
     const pluginObject = {};
     const proxyHandler = {
@@ -83,14 +98,13 @@ const useBootstrapComponentDynamicImport = (importFiles, {
       args,
       instanceMethodCall: [],
       componentInstance: null,
-      element: null,
     }
 
-    pluginInstance.instanceProxy = proxyFactory(pluginInstance);
+    pluginInstance.proxyInstance = proxyFactory(pluginInstance);
 
     callStack.push(pluginInstance);
 
-    return pluginInstance.instanceProxy;
+    return pluginInstance.proxyInstance;
   };
 
   ComponentObjectConstructorFunction.getOrCreateInstance = getOrCreateInstance;
@@ -110,7 +124,8 @@ const useBootstrapComponentDynamicImport = (importFiles, {
       componentInstance = new window.bootstrap[componentName](args);
 
       callStack[i].componentInstance = componentInstance;
-      callStack[i].element = componentInstance._element;
+
+      setInstanceInMap(componentInstance._element, componentInstance);
 
       instanceMethodCall.forEach(({ prop, args }) => {
         componentInstance[prop](...args);