Fix export graph

Author: Siegrift

index.js

@@ -1,25 +1,3 @@
 // This file is not processed by check_flow.py script
-import React from 'react'
 import DiagramEditor from './src'
-import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
-import CssBaseline from '@material-ui/core/CssBaseline'
-
-const theme = createMuiTheme({
-  typography: {
-    useNextVariants: true,
-  },
-})
-
-// MuiThemeProvider uses ref, which can be used only with statefull components
-class Editor extends React.Component {
-  render() {
-    return (
-      <MuiThemeProvider theme={theme}>
-        <CssBaseline>
-          <DiagramEditor {...this.props} />
-        </CssBaseline>
-      </MuiThemeProvider>
-    )
-  }
-}
-export default Editor
+export default DiagramEditor

src/diagramEditor/mainEditor/widgets/Widget.js

@@ -11,8 +11,6 @@ import Tooltip from '@material-ui/core/Tooltip'
 import { WIDGET_ICON_MODE_TRASHHOLD } from '../../../constants'
 import { withSchemaCommandContext } from '../../SchemaContext'
 
-// TODO: We get a warning about variant not being recognized because of
-// https://github.com/mui-org/material-ui/issues/13145
 const WholeWidget = ({
   className,
   editorKey,

src/diagramEditor/topPanel/TopPanel.js

@@ -42,7 +42,7 @@ const TopPanel = ({
 }) => (
   <AppBar position="static" className="TopPanel">
     <Toolbar variant="dense">
-      <Typography variant="title" color="inherit">
+      <Typography variant="h6" color="inherit">
         Diagrams
       </Typography>
 

src/index.js

@@ -1,17 +1,25 @@
 // @flow
 import * as React from 'react'
 import { Provider } from 'react-redux'
+import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
+import CssBaseline from '@material-ui/core/CssBaseline'
 import DiagramEditor from './diagramEditor/DiagramEditor'
 import getConfiguredStore from './configureStore'
 
+import type { ExportedGraph } from './diagramEditor/editorApi'
 import type { DiagramEditorApi } from './diagramEditor/DiagramEditor'
 import type { Schema } from './flow/schemaTypes'
-import type { ExportedGraph } from './diagramEditor/editorApi'
 
 const store = getConfiguredStore()
 
 type DiagramEditorRef = { getWrappedInstance: () => DiagramEditorApi }
 
+const theme = createMuiTheme({
+  typography: {
+    useNextVariants: true,
+  },
+})
+
 export class DiagramEditorWrapper extends React.Component<Schema> {
   editorRef: ?DiagramEditorApi
 
@@ -22,15 +30,19 @@ export class DiagramEditorWrapper extends React.Component<Schema> {
 
   render(): React.Node {
     return (
-      <Provider store={store}>
-        <DiagramEditor
-          // FLOW: flow doesn't understand getWrappedInstance from connectAdvanced
-          ref={(ref: DiagramEditorRef) => {
-            this.editorRef = ref.getWrappedInstance()
-          }}
-          {...this.props}
-        />
-      </Provider>
+      <MuiThemeProvider theme={theme}>
+        <CssBaseline>
+          <Provider store={store}>
+            <DiagramEditor
+              // FLOW: flow doesn't understand getWrappedInstance from connectAdvanced
+              ref={(ref: DiagramEditorRef) => {
+                this.editorRef = ref.getWrappedInstance()
+              }}
+              {...this.props}
+            />
+          </Provider>
+        </CssBaseline>
+      </MuiThemeProvider>
     )
   }
 }