Add pane resizing

Refactor styles
Update autoExpand with filtered result count
Add redux batch reducer

app/src/actions/Settings.ts

@@ -4,6 +4,8 @@ import { Dispatch } from 'redux'
 import { showTree } from './Tree'
 import { AppState } from '../reducers'
 import * as q from '../../../backend/src/Model'
+import { batchActions, enableBatching, batchDispatchMiddleware } from 'redux-batched-actions';
+import { autoExpandLimitSet } from '../components/Settings';
 
 export const setAutoExpandLimit = (autoExpandLimit: number = 0): Action => {
   return {
@@ -34,7 +36,7 @@ export const filterTopics = (filterStr: string) => (dispatch: Dispatch<any>, get
   })
 
   if (!filterStr || !tree) {
-    dispatch(showTree(tree))
+    dispatch(batchActions([setAutoExpandLimit(0), showTree(tree)]))
     return
   }
 
@@ -67,5 +69,21 @@ export const filterTopics = (filterStr: string) => (dispatch: Dispatch<any>, get
     nextTree.updateWithConnection(tree.updateSource, tree.connectionId, nodeFilter)
   }
 
-  dispatch(showTree(nextTree))
+  dispatch(batchActions([setAutoExpandLimit(autoExpandLimitForTree(nextTree)), showTree(nextTree)]))
+}
+
+function autoExpandLimitForTree(tree: q.Tree) {
+  if (!tree) {
+    return 0
+  }
+  function closestExistingLimit(i: number): number {
+    const sorted = autoExpandLimitSet.sort((a, b) => Math.abs(a.limit - i) - Math.abs(b.limit - i))
+    console.log('sorted', i, sorted)
+    return sorted[0]!.limit
+  }
+
+  const count = tree.childTopicCount()
+  const calculatedLimit = Math.max(7 - Math.log(count), 0) * 2
+
+  return closestExistingLimit(calculatedLimit)
 }