From 6ed3eaa896c5d8d8b54812a2aa9f3d423d91fe84 Mon Sep 17 00:00:00 2001
From: Jan Prochazka <jan.prochazka@gmail.com>
Date: Sat, 21 Nov 2020 20:20:47 +0100
Subject: [PATCH] useExtensions fixed (extensions in context)

---
 packages/web/src/App.js                       | 23 ++++++++++--------
 .../src/impexp/ImportExportConfigurator.js    |  4 ----
 packages/web/src/utility/useExtensions.js     | 24 ++++++++++++-------
 3 files changed, 29 insertions(+), 22 deletions(-)

diff --git a/packages/web/src/App.js b/packages/web/src/App.js
index 0497767a..28426f75 100644
--- a/packages/web/src/App.js
+++ b/packages/web/src/App.js
@@ -17,6 +17,7 @@ import { ModalLayerProvider } from './modals/showModal';
 import UploadsProvider from './utility/UploadsProvider';
 import ThemeHelmet from './themes/ThemeHelmet';
 import PluginsProvider from './plugins/PluginsProvider';
+import { ExtensionsProvider } from './utility/useExtensions';
 
 function App() {
   return (
@@ -29,16 +30,18 @@ function App() {
                 <LeftPanelWidthProvider>
                   <ConnectionsPinger>
                     <PluginsProvider>
-                      <ModalLayerProvider>
-                        <CurrentArchiveProvider>
-                          <CurrentThemeProvider>
-                            <UploadsProvider>
-                              <ThemeHelmet />
-                              <Screen />
-                            </UploadsProvider>
-                          </CurrentThemeProvider>
-                        </CurrentArchiveProvider>
-                      </ModalLayerProvider>
+                      <ExtensionsProvider>
+                        <ModalLayerProvider>
+                          <CurrentArchiveProvider>
+                            <CurrentThemeProvider>
+                              <UploadsProvider>
+                                <ThemeHelmet />
+                                <Screen />
+                              </UploadsProvider>
+                            </CurrentThemeProvider>
+                          </CurrentArchiveProvider>
+                        </ModalLayerProvider>
+                      </ExtensionsProvider>
                     </PluginsProvider>
                   </ConnectionsPinger>
                 </LeftPanelWidthProvider>
diff --git a/packages/web/src/impexp/ImportExportConfigurator.js b/packages/web/src/impexp/ImportExportConfigurator.js
index 6913ef28..82c5d21e 100644
--- a/packages/web/src/impexp/ImportExportConfigurator.js
+++ b/packages/web/src/impexp/ImportExportConfigurator.js
@@ -354,10 +354,6 @@ export default function ImportExportConfigurator({ uploadedFile = undefined, onC
   const [previewSource, setPreviewSource] = React.useState(null);
   const extensions = useExtensions();
 
-  console.log('ImportExportConfigurator', extensions);
-  const installed = useInstalledPlugins();
-  console.log('installed', installed);
-
   const handleUpload = React.useCallback(
     (file) => {
       console.log('UPLOAD', extensions);
diff --git a/packages/web/src/utility/useExtensions.js b/packages/web/src/utility/useExtensions.js
index 6b53996c..71220913 100644
--- a/packages/web/src/utility/useExtensions.js
+++ b/packages/web/src/utility/useExtensions.js
@@ -2,14 +2,22 @@ import React from 'react';
 import { usePlugins } from '../plugins/PluginsProvider';
 import { buildFileFormats } from './fileformats';
 
-export default function useExtensions() {
+const ExtensionsContext = React.createContext(buildExtensions([]));
+
+export function ExtensionsProvider({ children }) {
   const plugins = usePlugins();
-  const extensions = React.useMemo(
-    () => ({
-      plugins,
-      fileFormats: buildFileFormats(plugins),
-    }),
-    [plugins]
-  );
+  const extensions = React.useMemo(() => buildExtensions(plugins), [plugins]);
+  return <ExtensionsContext.Provider value={extensions}>{children}</ExtensionsContext.Provider>;
+}
+
+export function buildExtensions(plugins) {
+  const extensions = {
+    plugins,
+    fileFormats: buildFileFormats(plugins),
+  };
   return extensions;
 }
+
+export default function useExtensions() {
+  return React.useContext(ExtensionsContext);
+}