From 5f1c04e9ed90e2602a6e7ace5db1554d8f04a7b3 Mon Sep 17 00:00:00 2001
From: Andrew Watkins <watts@influxdb.com>
Date: Wed, 2 May 2018 12:26:30 -0700
Subject: [PATCH] Remove a lot from divisor

---
 ui/src/shared/components/ResizeDivision.tsx | 67 +++++----------------
 1 file changed, 15 insertions(+), 52 deletions(-)

diff --git a/ui/src/shared/components/ResizeDivision.tsx b/ui/src/shared/components/ResizeDivision.tsx
index a00c655e0..358327628 100644
--- a/ui/src/shared/components/ResizeDivision.tsx
+++ b/ui/src/shared/components/ResizeDivision.tsx
@@ -31,34 +31,30 @@ class Division extends PureComponent<Props> {
   }
 
   public render() {
-    const {render} = this.props
-
-    return (
-      <div className={this.className} style={this.style}>
-        {this.dragHandle}
-        <div className="resizer--contents">{render()}</div>
-      </div>
-    )
-  }
-
-  private get dragHandle() {
-    const {name, activeHandleID, orientation, id, draggable} = this.props
+    const {render, draggable} = this.props
 
     if (!name && !draggable) {
       return null
     }
 
     return (
-      <ResizeHandle
-        id={id}
-        name={name}
-        orientation={orientation}
-        activeHandleID={activeHandleID}
-        onHandleStartDrag={this.dragCallback}
-      />
+      <>
+        <div className="threesizer--handle" onMouseDown={this.dragCallback}>
+          {name}
+        </div>
+        <div className="threesizer--division" style={this.style}>
+          {render()}
+        </div>
+      </>
     )
   }
 
+  private get style() {
+    return {
+      height: `calc(${this.props.size}% - 30px)`,
+    }
+  }
+
   private get dragCallback() {
     const {draggable} = this.props
     if (!draggable) {
@@ -67,39 +63,6 @@ class Division extends PureComponent<Props> {
 
     return this.props.onHandleStartDrag
   }
-
-  private get style() {
-    const {orientation, maxPercent, minPixels, size} = this.props
-
-    const sizePercent = `${size * HUNDRED}%`
-    // const max = `${maxPercent * HUNDRED}%`
-    const max = '100%'
-
-    if (orientation === HANDLE_VERTICAL) {
-      return {
-        top: '0',
-        width: sizePercent,
-        minWidth: minPixels,
-        maxWidth: max,
-      }
-    }
-
-    return {
-      left: '0',
-      height: sizePercent,
-      minHeight: minPixels,
-      maxHeight: max,
-    }
-  }
-
-  private get className(): string {
-    const {orientation} = this.props
-
-    return classnames('resizer--division', {
-      resizer__vertical: orientation === HANDLE_VERTICAL,
-      resizer__horizontal: orientation === HANDLE_HORIZONTAL,
-    })
-  }
 }
 
 export default Division