[web] rewrite ProxyApp and MainView with es6

1 files changed, 26 insertions, 18 deletions

diff --git a/web/src/js/app.js b/web/src/js/app.js
index b49de002..8fa52a00 100644
--- a/web/src/js/app.js
+++ b/web/src/js/app.js
@@ -1,33 +1,41 @@
 import React from "react"
-import {render} from 'react-dom'
-import {applyMiddleware, createStore} from 'redux'
-import {Provider} from 'react-redux'
+import { render } from 'react-dom'
+import { applyMiddleware, createStore } from 'redux'
+import { Provider } from 'react-redux'
 import createLogger from 'redux-logger'
 import thunkMiddleware from 'redux-thunk'
-
+import { Route, Router as ReactRouter, hashHistory, Redirect } from "react-router"
 
 import Connection from "./connection"
-import {App} from "./components/proxyapp.js"
-import rootReducer from './ducks/index';
-import {addLogEntry} from "./ducks/eventLog";
+import ProxyApp from "./components/ProxyApp"
+import MainView from './components/MainView'
+import rootReducer from './ducks/index'
+import { addLogEntry } from "./ducks/eventLog"
 
 // logger must be last
-const logger = createLogger();
 const store = createStore(
     rootReducer,
-    applyMiddleware(thunkMiddleware, logger)
-);
+    applyMiddleware(thunkMiddleware, createLogger())
+)
 
-window.onerror = function (msg) {
-    store.dispatch(addLogEntry(msg));
-};
+window.addEventListener('error', msg => {
+    store.dispatch(addLogEntry(msg))
+})
 
+// @todo remove this
 document.addEventListener('DOMContentLoaded', () => {
-    window.ws = new Connection("/updates", store.dispatch);
+    window.ws = new Connection("/updates", store.dispatch)
 
     render(
-        <Provider store={store}>{App}</Provider>,
+        <Provider store={store}>
+            <ReactRouter history={hashHistory}>
+                <Redirect from="/" to="/flows" />
+                <Route path="/" component={ProxyApp}>
+                    <Route path="flows" component={MainView}/>
+                    <Route path="flows/:flowId/:detailTab" component={MainView}/>
+                </Route>
+            </ReactRouter>
+        </Provider>,
         document.getElementById("mitmproxy")
-    );
-
-});
+    )
+})