split panes: rebalance sizes on insert/removal

lib/reducers/term-groups.js

@@ -38,6 +38,24 @@ const setActiveGroup = (state, action) => {
     .setIn(['activeSessions', rootGroup.uid], action.uid);
 };
 
+// Reduce existing sizes to fit a new split:
+const insertRebalance = (oldSizes, index) => {
+  const newSize = 1 / (oldSizes.length + 1);
+  // We spread out how much each pane should be reduced
+  // with based on their existing size:
+  const balanced = oldSizes.map(size => size - (newSize * size));
+  return [...balanced.slice(0, index), newSize, ...balanced.slice(index)];
+};
+
+// Spread out the removed size to all the existing sizes:
+const removalRebalance = (oldSizes, index) => {
+  const removedSize = oldSizes[index];
+  const increase = removedSize / (oldSizes.length - 1);
+  return oldSizes
+    .filter((_size, i) => i !== index)
+    .map(size => size + increase);
+};
+
 const splitGroup = (state, action) => {
   const { splitDirection, uid, activeUid } = action;
   const activeGroup = findBySession(state, activeUid);
@@ -84,11 +102,17 @@ const splitGroup = (state, action) => {
   // Insert the new child pane right after the active one:
   const index = children.indexOf(activeGroup.uid) + 1;
   const newChildren = [...children.slice(0, index), newSession.uid, ...children.slice(index)];
-  return state
-    .setIn(['termGroups', parentGroup.uid], parentGroup.merge({
-      direction: splitDirection,
-      children: newChildren
-    }));
+  state = state.setIn(['termGroups', parentGroup.uid], parentGroup.merge({
+    direction: splitDirection,
+    children: newChildren
+  }));
+
+  if (parentGroup.sizes) {
+    const newSizes = insertRebalance(parentGroup.sizes, index);
+    state = state.setIn(['termGroups', parentGroup.uid, 'sizes'], newSizes);
+  }
+
+  return state;
 };
 
 // Replace the parent by the given child in the tree,
@@ -134,6 +158,11 @@ const removeGroup = (state, uid) => {
       state = replaceParent(state, parent, child);
     } else {
       state = state.setIn(['termGroups', group.parentUid, 'children'], newChildren);
+      if (parent.sizes) {
+        const childIndex = parent.children.indexOf(uid);
+        const newSizes = removalRebalance(parent.sizes, childIndex);
+        state = state.setIn(['termGroups', group.parentUid, 'sizes'], newSizes);
+      }
     }
   }