somewhat better import

eea · Jan 11, 2023 · 48219a3 · 48219a3
1 parent 4e03cb2
commit 48219a3
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 20 deletions.
diff --git a/src/Tableau/View.jsx b/src/Tableau/View.jsx
@@ -21,8 +21,8 @@ const Tableau = (props) => {
     loaded = false,
     mode = 'view',
     screen = {},
-    setError = () => { },
-    setLoaded = () => { },
+    setError = () => {},
+    setLoaded = () => {},
     version = '2.8.0',
   } = props;
   const {
@@ -44,11 +44,10 @@ const Tableau = (props) => {
       default:
         console.log(`Sorry, we don't support ${version} yet.`);
     }
-  }
-
+  };
 
   //load tableau from script tag
-  const tableau = isMyScriptLoaded(version) && __CLIENT__ ? window.tableau : '';
+  const tableau = loadTableauScript(() => {}, version);
   //TODO: if using an importmap then there would be tableau1, tableau2, etc and ^^ would need a switch for each version. This way, the scripts needed are there, loaded dinamicaly
 
   const onFilterChange = (filter) => {
@@ -175,7 +174,7 @@ const Tableau = (props) => {
       props.setTableauApi(version, props.mode);
     }
     if (__CLIENT__) {
-      loadTableauScript(() => { }, version);
+      loadTableauScript(() => {}, version);
     }
     /* eslint-disable-next-line */
   }, [version]);

diff --git a/src/helpers.js b/src/helpers.js
@@ -19,25 +19,21 @@ const loadTableauScript = (callback, version) => {
   //callback, if needed
   if (existingScript && callback) callback();
 
-  //TODO: instead of replacing the tableau script  
-  //   <script type="importmap">
-  //   {
-  //     "imports": {
-  //       "tableau1": "https://example.com/shapes/tableau1.js",
-  //       "tableau2": "https://example.com/shapes/tableau2.js",
-  //       "tableau3": "https://example.com/shapes/tableau3.js",
-  //     }
-  //   }
-  // </script>
-  //try creating an importmap script with each different tableau version https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#importing_modules_with_importmap
+  const tableau = isMyScriptLoaded(version) && __CLIENT__ ? window.tableau : '';
+  console.log('loading the tableau script version:', version);
+  return tableau;
 };
 
-const isMyScriptLoaded = (id) => {
+const isMyScriptLoaded = (version) => {
   //check for loaded Tableau script in dom scripts
   var scripts = document.getElementsByTagName('script');
-  for (var i = scripts.length; i--;) {
+  for (var i = scripts.length; i--; ) {
     // eslint-disable-next-line eqeqeq
-    if (scripts[i].id == `tableauJS`) return true;
+    if (
+      scripts[i].src ===
+      `https://public.tableau.com/javascripts/api/tableau-${version}.min.js`
+    )
+      return true;
   }
   return false;
 };