fix bug where error at import dashboard fails to show toast in "welcome" app (#9714)

* fix bug where error at import dashboard fails

* fix: make reusable component for messages and bring to app level

* fix: add liscence

* fix: lint errors and tests

* fix

* fix: lint

* fix: lint error

* add suggestions

* add suggestions

Co-authored-by: Phillip Kelley-Dotson <pkd@pkd.lan>

superset-frontend/src/components/FlashProvider.tsx

@@ -0,0 +1,53 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from 'react';
+import withToasts from 'src/messageToasts/enhancers/withToasts';
+
+type Message = Array<string>;
+
+interface CommonObject {
+  flash_messages: Array<Message>;
+}
+interface Props {
+  children: Node;
+  common: CommonObject;
+}
+
+const flashObj = {
+  info: 'addInfoToast',
+  danger: 'addDangerToast',
+  warning: 'addWarningToast',
+  success: 'addSuccessToast',
+};
+
+class FlashProvider extends React.PureComponent<Props> {
+  componentDidMount() {
+    const flashMessages = this.props.common.flash_messages;
+    flashMessages.forEach(message => {
+      const [type, text] = message;
+      const flash = flashObj[type];
+      this.props[flash](text);
+    });
+  }
+  render() {
+    return this.props.children;
+  }
+}
+
+export default withToasts(FlashProvider);

superset-frontend/src/views/dashboardList/DashboardList.tsx

@@ -482,7 +482,6 @@ class DashboardList extends React.PureComponent<Props, State> {
       filters,
       dashboardToEdit,
     } = this.state;
-
     return (
       <div className="container welcome">
         <Panel>

superset-frontend/src/welcome/App.jsx

@@ -29,6 +29,7 @@ import { initFeatureFlags } from 'src/featureFlags';
 import { supersetTheme } from '@superset-ui/style';
 import ErrorBoundary from 'src/components/ErrorBoundary';
 import Menu from 'src/components/Menu/Menu';
+import FlashProvider from 'src/components/FlashProvider';
 import DashboardList from 'src/views/dashboardList/DashboardList';
 import ChartList from 'src/views/chartList/ChartList';
 import DatasetList from 'src/views/datasetList/DatasetList';
@@ -47,7 +48,7 @@ const container = document.getElementById('app');
 const bootstrap = JSON.parse(container.getAttribute('data-bootstrap'));
 const user = { ...bootstrap.user };
 const menu = { ...bootstrap.common.menu_data };
-
+const common = { ...bootstrap.common };
 initFeatureFlags(bootstrap.common.feature_flags);
 
 const store = createStore(
@@ -61,34 +62,36 @@ const store = createStore(
 const App = () => (
   <Provider store={store}>
     <ThemeProvider theme={supersetTheme}>
-      <Router>
-        <QueryParamProvider ReactRouterRoute={Route}>
-          <Menu data={menu} />
-          <Switch>
-            <Route path="/superset/welcome/">
-              <ErrorBoundary>
-                <Welcome user={user} />
-              </ErrorBoundary>
-            </Route>
-            <Route path="/dashboard/list/">
-              <ErrorBoundary>
-                <DashboardList user={user} />
-              </ErrorBoundary>
-            </Route>
-            <Route path="/chart/list/">
-              <ErrorBoundary>
-                <ChartList user={user} />
-              </ErrorBoundary>
-            </Route>
-            <Route path="/tablemodelview/list/">
-              <ErrorBoundary>
-                <DatasetList user={user} />
-              </ErrorBoundary>
-            </Route>
-          </Switch>
-          <ToastPresenter />
-        </QueryParamProvider>
-      </Router>
+      <FlashProvider common={common}>
+        <Router>
+          <QueryParamProvider ReactRouterRoute={Route}>
+            <Menu data={menu} />
+            <Switch>
+              <Route path="/superset/welcome/">
+                <ErrorBoundary>
+                  <Welcome user={user} />
+                </ErrorBoundary>
+              </Route>
+              <Route path="/dashboard/list/">
+                <ErrorBoundary>
+                  <DashboardList user={user} />
+                </ErrorBoundary>
+              </Route>
+              <Route path="/chart/list/">
+                <ErrorBoundary>
+                  <ChartList user={user} />
+                </ErrorBoundary>
+              </Route>
+              <Route path="/tablemodelview/list/">
+                <ErrorBoundary>
+                  <DatasetList user={user} />
+                </ErrorBoundary>
+              </Route>
+            </Switch>
+            <ToastPresenter />
+          </QueryParamProvider>
+        </Router>
+      </FlashProvider>
     </ThemeProvider>
   </Provider>
 );