Fix dataset and global tool bar error with standalone React component (…

…kedro-org#1475) * Fix bugs for React 18 dev build Signed-off-by: Vladimir <[email protected]> * Update release file Signed-off-by: Vladimir <[email protected]> * Remove logs, update release notes, move Router outside of ternary operator Signed-off-by: Vladimir <[email protected]> * Update RELEASE.md Co-authored-by: Tynan DeBold <[email protected]> --------- Signed-off-by: Vladimir <[email protected]> Co-authored-by: Tynan DeBold <[email protected]>
ravi-kumar-pilla · Aug 8, 2023 · 6e1d127 · 6e1d127
1 parent e4346a6
commit 6e1d127
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 14 deletions.
diff --git a/RELEASE.md b/RELEASE.md
@@ -6,11 +6,11 @@ Please follow the established format:
 - Include the ID number for the related PR (or PRs) in parentheses
 -->
 
-
 ## Bug fixes and other changes
 
 - Fix incorrect rendering of datasets in modular pipelines. (#1439)
 - Fix broken SVG/PNG exports in light theme. (#1463)
+- Fix dataset and global toolbar error with standalone React component (#1351)
 
 # Release 6.3.4
 

diff --git a/src/actions/graph.js b/src/actions/graph.js
@@ -33,7 +33,7 @@ export function updateGraph(graph) {
  * @param {Object} state A subset of main state
  * @return {Function} Promise function
  */
-const layout = (instance, state) => instance.graphNew(state);
+const layout = async (instance, state) => instance.graphNew(state);
 
 // Prepare new layout worker
 const layoutWorker = preventWorkerQueues(worker, layout);

diff --git a/src/components/ui/dropdown/dropdown.js b/src/components/ui/dropdown/dropdown.js
@@ -107,11 +107,9 @@ const Dropdown = (props) => {
     if (!mounted.current) {
       // update mounted on componentDidMount
       mounted.current = true;
-    } else {
+    } else if (prevProps && _childrenHaveChanged(prevProps)) {
       // triggers every time on componentDidUpdate
-      if (_childrenHaveChanged(prevProps)) {
-        setSelectedOption(_findSelectedOption(prevProps));
-      }
+      setSelectedOption(_findSelectedOption(prevProps));
     }
   }, [_findSelectedOption, prevProps, props]);
 

diff --git a/src/components/wrapper/wrapper.js b/src/components/wrapper/wrapper.js
@@ -48,9 +48,9 @@ export const Wrapper = ({ displayGlobalToolbar, theme }) => {
       })}
     >
       <h1 className="pipeline-title">Kedro-Viz</h1>
-      {displayGlobalToolbar ? (
-        <GraphQLProvider>
-          <Router>
+      <Router>
+        {displayGlobalToolbar ? (
+          <GraphQLProvider>
             <GlobalToolbar isOutdated={isOutdated} />
             <SettingsModal
               isOutdated={isOutdated}
@@ -71,11 +71,11 @@ export const Wrapper = ({ displayGlobalToolbar, theme }) => {
                 <ExperimentWrapper />
               </Route>
             </Switch>
-          </Router>
-        </GraphQLProvider>
-      ) : (
-        <FlowChartWrapper />
-      )}
+          </GraphQLProvider>
+        ) : (
+          <FlowChartWrapper />
+        )}
+      </Router>
     </div>
   );
 };