Upgrade dependecies

app/src/components/Sidebar/CodeDiff.tsx

@@ -60,7 +60,7 @@ class CodeDiff extends React.Component<Props, {}> {
 
   public render() {
     const changes = diff.diffLines(this.props.previous, this.props.current)
-    const styledLines = Prism.highlight(this.props.current, Prism.languages.json).split('\n')
+    const styledLines = Prism.highlight(this.props.current, Prism.languages.json, 'json').split('\n')
 
     let lineNumber = 0
     const code = changes.map((change, key) => {
@@ -68,8 +68,8 @@ class CodeDiff extends React.Component<Props, {}> {
       const changedLines = change.count || 0
       if (hasStyledCode && this.props.language === 'json') {
         const currentLines = styledLines.slice(lineNumber, lineNumber + changedLines)
-        const lines = currentLines.map((l, idx) => {
-          return <div key={`${key}-${idx}`} className={this.props.classes.line}><span className={this.cssClassForChange(change)} dangerouslySetInnerHTML={{ __html: l }} /></div>
+        const lines = currentLines.map((html: string, idx: number) => {
+          return <div key={`${key}-${idx}`} className={this.props.classes.line}><span className={this.cssClassForChange(change)} dangerouslySetInnerHTML={{ __html: html }} /></div>
         })
         lineNumber += changedLines
 

app/src/index.tsx

@@ -1,25 +1,18 @@
 import * as React from 'react'
 import * as ReactDOM from 'react-dom'
+import amber from '@material-ui/core/colors/amber'
 import App from './App'
 import Demo from './components/Demo'
 import reducers, { AppState } from './reducers'
 import reduxThunk from 'redux-thunk'
+import teal from '@material-ui/core/colors/teal'
 import { applyMiddleware, compose, createStore } from 'redux'
 import { batchDispatchMiddleware } from 'redux-batched-actions'
-import { createMuiTheme, MuiThemeProvider, Theme } from '@material-ui/core/styles'
-import { Provider, connect } from 'react-redux'
+import { connect, Provider } from 'react-redux'
+import { createMuiTheme, Theme } from '@material-ui/core/styles'
+import { ThemeProvider } from '@material-ui/styles'
 import './tracking'
-import blue from '@material-ui/core/colors/blue'
-import red from '@material-ui/core/colors/red'
-import pink from '@material-ui/core/colors/pink'
-import orange from '@material-ui/core/colors/orange'
-import deepOrange from '@material-ui/core/colors/deepOrange'
-import indigo from '@material-ui/core/colors/indigo'
-import lime from '@material-ui/core/colors/lime'
-import green from '@material-ui/core/colors/green'
-import teal from '@material-ui/core/colors/teal'
-import amber from '@material-ui/core/colors/amber'
-import brown from '@material-ui/core/colors/brown'
+
 
 const composeEnhancers = /*(window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || */ compose
 const store = createStore(
@@ -46,11 +39,10 @@ function createTheme(type: 'light' | 'dark') {
         background: {
           default: '#fafafa',
         },
-        //primary: teal,
-        secondary: amber,
         primary: {
-          main: '#931e2e'
+          main: '#931e2e',
         },
+        secondary: amber,
         // error: red,
         action: {
           disabledBackground: '#fafafa',
@@ -62,10 +54,10 @@ function createTheme(type: 'light' | 'dark') {
 
 function ApplicationRenderer(props: {theme: 'light' | 'dark'}) {
   return (
-    <MuiThemeProvider theme={createTheme(props.theme)}>
+    <ThemeProvider theme={createTheme(props.theme)}>
       <App />
       <Demo />
-    </MuiThemeProvider>
+    </ThemeProvider>
   )
 }