From 238e220d9fb90acb166ee2c3e9f01991928f69a5 Mon Sep 17 00:00:00 2001
From: Lachlan Kermode <lachiekermode@gmail.com>
Date: Fri, 18 Jan 2019 16:46:02 +0000
Subject: [PATCH] fix categories labels y position

---
 src/components/Timeline.jsx                   |  9 +++---
 src/components/TimelineCategories.jsx         |  6 +---
 .../presentational/Timeline/Labels.js         | 30 +++++++++----------
 3 files changed, 21 insertions(+), 24 deletions(-)

diff --git a/src/components/Timeline.jsx b/src/components/Timeline.jsx
index a7ebdba..840f05f 100644
--- a/src/components/Timeline.jsx
+++ b/src/components/Timeline.jsx
@@ -275,6 +275,7 @@ class Timeline extends React.Component {
               />
               <Categories
                 dims={dims}
+                getCategoryY={this.state.scaleY}
                 onDragStart={() => { this.onDragStart() }}
                 onDrag={() => { this.onDrag() }}
                 onDragEnd={() => { this.onDragEnd() }}
@@ -290,10 +291,10 @@ class Timeline extends React.Component {
                 dims={dims}
                 onApplyZoom={this.onApplyZoom}
               />
-              <Labels
-                dims={dims}
-                timelabels={this.state.timerange}
-              />
+              {/* <Labels */}
+              {/*   dims={dims} */}
+              {/*   timelabels={this.state.timerange} */}
+              {/* /> */}
               <Markers
                 selected={this.props.app.selected}
                 getEventX={this.getDatetimeX}
diff --git a/src/components/TimelineCategories.jsx b/src/components/TimelineCategories.jsx
index 25dce29..6ecdad4 100644
--- a/src/components/TimelineCategories.jsx
+++ b/src/components/TimelineCategories.jsx
@@ -24,14 +24,10 @@ class TimelineCategories extends React.Component {
     }
   }
 
-  getY(idx) {
-    return (idx + 1) * this.props.dims.trackHeight / this.props.categories.length + 7.5;
-  }
-
   renderCategory(category, idx) {
     const dims = this.props.dims;
     return (
-      <g class="tick" opacity="1" transform={`translate(0,${this.getY(idx)})`}>
+      <g class="tick" opacity="1" transform={`translate(0,${this.props.getCategoryY(category.category)})`}>
         <line x1={dims.margin_left} x2={dims.width - dims.width_controls}></line>
         <text x={dims.margin_left - 5} dy="0.32em">{category.category}</text>
       </g>
diff --git a/src/components/presentational/Timeline/Labels.js b/src/components/presentational/Timeline/Labels.js
index 9a75743..60e260e 100644
--- a/src/components/presentational/Timeline/Labels.js
+++ b/src/components/presentational/Timeline/Labels.js
@@ -22,21 +22,21 @@ const TimelineLabels = ({ dims, timelabels }) => {
         y2="20"
       >
       </line>
-      {/* <text */}
-      {/*   class="timeLabel0 timeLabel" */}
-      {/*   x="5" */}
-      {/*   y="15" */}
-      {/* > */}
-      {/*   {formatterWithYear(timelabels[0])} */}
-      {/* </text> */}
-      {/* <text */}
-      {/*   class="timelabelF timeLabel" */}
-      {/*   x={dims.width - dims.width_controls - 5} */}
-      {/*   y="15" */}
-      {/*   style={{ textAnchor: 'end' }} */}
-      {/* > */}
-      {/*   {formatterWithYear(timelabels[1])} */}
-      {/* </text> */}
+      <text
+        class="timeLabel0 timeLabel"
+        x="5"
+        y="15"
+      >
+        {formatterWithYear(timelabels[0])}
+      </text>
+      <text
+        class="timelabelF timeLabel"
+        x={dims.width - dims.width_controls - 5}
+        y="15"
+        style={{ textAnchor: 'end' }}
+      >
+        {formatterWithYear(timelabels[1])}
+      </text>
     </g>
   )
 }