From 77f05178ad23a8bb1f2cc43e1cdcf0593acd43d2 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Wed, 9 Nov 2016 13:01:25 +0100
Subject: [PATCH] mitmweb: minor fixes

---
 mitmproxy/tools/web/app.py       |  3 +++
 web/src/js/backends/websocket.js |  7 ++++++-
 web/src/js/ducks/flows.js        |  6 +++---
 web/src/js/ducks/utils/store.js  | 16 ++++++++++++++++
 web/src/js/urlState.js           | 12 +++++++++---
 5 files changed, 37 insertions(+), 7 deletions(-)

diff --git a/mitmproxy/tools/web/app.py b/mitmproxy/tools/web/app.py
index d04af430d..4449a13ce 100644
--- a/mitmproxy/tools/web/app.py
+++ b/mitmproxy/tools/web/app.py
@@ -8,6 +8,7 @@ from io import BytesIO
 
 import tornado.web
 import tornado.websocket
+import tornado.escape
 from mitmproxy import contentviews
 from mitmproxy import flow
 from mitmproxy import flowfilter
@@ -95,6 +96,8 @@ class BasicAuth:
 class RequestHandler(BasicAuth, tornado.web.RequestHandler):
 
     def write(self, chunk):
+        # Writing arrays on the top level is ok nowadays.
+        # http://flask.pocoo.org/docs/0.11/security/#json-security
         if isinstance(chunk, list):
             chunk = tornado.escape.json_encode(chunk)
             self.set_header("Content-Type", "application/json; charset=UTF-8")
diff --git a/web/src/js/backends/websocket.js b/web/src/js/backends/websocket.js
index 40dde0d74..44b260c98 100644
--- a/web/src/js/backends/websocket.js
+++ b/web/src/js/backends/websocket.js
@@ -1,6 +1,11 @@
+/**
+ *  The WebSocket backend is responsible for updating our knowledge of flows and events
+ *  from the REST API and live updates delivered via a WebSocket connection.
+ *  An alternative backend may use the REST API only to host static instances.
+ */
 import { fetchApi } from "../utils"
 
-export const CMD_RESET = 'reset'
+const CMD_RESET = 'reset'
 
 export default class WebsocketBackend {
     constructor(store) {
diff --git a/web/src/js/ducks/flows.js b/web/src/js/ducks/flows.js
index 3375e4bd8..d37175339 100644
--- a/web/src/js/ducks/flows.js
+++ b/web/src/js/ducks/flows.js
@@ -1,6 +1,5 @@
 import { fetchApi } from "../utils"
-import reduceStore from "./utils/store"
-import * as storeActions from "./utils/store"
+import reduceStore, * as storeActions from "./utils/store"
 import Filt from "../filt/filt"
 import { RequestUtils } from "../flow/utils"
 
@@ -30,7 +29,8 @@ export default function reduce(state = defaultState, action) {
         case UPDATE:
         case REMOVE:
         case RECEIVE:
-            // FIXME: Implement select switch for remove
+            // FIXME: Update state.selected on REMOVE:
+            // The selected flow may have been removed, we need to select the next one in the view.
             let storeAction = storeActions[action.cmd](
                 action.data,
                 makeFilter(state.filter),
diff --git a/web/src/js/ducks/utils/store.js b/web/src/js/ducks/utils/store.js
index 3252d6979..9ea4f02e6 100644
--- a/web/src/js/ducks/utils/store.js
+++ b/web/src/js/ducks/utils/store.js
@@ -13,6 +13,22 @@ const defaultState = {
     viewIndex: {},
 }
 
+/**
+ * The store reducer can be used as a mixin to another reducer that always returns a
+ * new { byId, list, listIndex, view, viewIndex } object. The reducer using the store
+ * usually has to map its action to the matching store action and then call the mixin with that.
+ *
+ * Example Usage:
+ *
+ *      import reduceStore, * as storeActions from "./utils/store"
+ *
+ *      case EVENTLOG_ADD:
+ *          return {
+ *              ...state,
+ *              ...reduceStore(state, storeActions.add(action.data))
+ *          }
+ *
+ */
 export default function reduce(state = defaultState, action) {
 
     let { byId, list, listIndex, view, viewIndex } = state
diff --git a/web/src/js/urlState.js b/web/src/js/urlState.js
index 77b393932..ca9187b20 100644
--- a/web/src/js/urlState.js
+++ b/web/src/js/urlState.js
@@ -1,3 +1,10 @@
+/**
+ * Instead of dealing with react-router's ever-changing APIs,
+ * we use a simple url state manager where we only
+ *
+ * - read the initial URL state on page load
+ * - push updates to the URL later on.
+ */
 import { select, setFilter, setHighlight } from "./ducks/flows"
 import { selectTab } from "./ducks/ui/flow"
 import { toggleVisibility } from "./ducks/eventLog"
@@ -65,9 +72,8 @@ function updateUrlFromStore(store) {
     if (queryStr) {
         url += "?" + queryStr
     }
-    if (window.location.hash !== url) {
-        // FIXME: replace state
-        window.location.hash = url
+    if (window.location.hash.substr(1) !== url) {
+        history.replaceState(undefined, "", `/#${url}`)
     }
 }