fix: fix y axis direction, create csv story

Author: seveibar

src/components/ControllableWave/index.js

@@ -26,9 +26,10 @@ export const ControllableWave = ({
     const minY = Math.min(...curves[0].data.map(([, y]) => y))
 
     return mat
+      .scale(1, -1)
       .scale(1, height)
       .scale(1, 1 / (maxY - minY))
-      .translate(0, -minY)
+      .translate(0, -maxY)
   })
 
   matrix = matrix

src/components/ReactTimeSeries/ReactTimeSeries.stories.js

@@ -52,7 +52,7 @@ export const ReallySimple = () => {
       sample={{
         timeData: [
           { time: 0, value: 0 },
-          { time: 500, value: 500 },
+          { time: 500, value: 750 },
           { time: 1000, value: 1000 },
         ],
       }}
@@ -132,3 +132,21 @@ export const CreateDurationsOnly = () => {
     />
   )
 }
+
+export const TimeDataFromCSV = () => {
+  const [sample, setSample] = useState({
+    csvUrl:
+      "https://gist.githubusercontent.com/philaturner/644b3e8bd17641766d90f38d475edcc6/raw/a6c35e97a89eda49098def90fe2e750ceb898f79/tesla.csv",
+  })
+  return (
+    <ReactTimeSeries
+      interface={{
+        durationLabels: ["duration1", "duration2"],
+        timestampLabels: ["ts1", "ts2"],
+        enabledTools: ["create-durations"],
+      }}
+      sample={sample}
+      onModifySample={setSample}
+    />
+  )
+}

src/components/Wave/index.js

@@ -31,20 +31,23 @@ const reduceForVisibleDuration = (data, startTime, visibleDuration, width) => {
     if (data[i][0] - points[points.length - 1][0] > minDistance) {
       // points.push(data[i])
       const timeSinceLastPoint = data[i][0] - points[points.length - 1][0]
-
-      points.push([
-        data[i][0] - timeSinceLastPoint / 2,
-        Math.max(
-          ...data.slice(lastAddedPointIndex + 1, i + 1).map(([, v]) => v)
-        ),
-      ])
-
-      points.push([
-        data[i][0],
-        Math.min(
-          ...data.slice(lastAddedPointIndex + 1, i + 1).map(([, v]) => v)
-        ),
-      ])
+      if (i - lastAddedPointIndex === 1) {
+        points.push(data[i])
+      } else {
+        points.push([
+          data[i][0] - timeSinceLastPoint / 2,
+          Math.max(
+            ...data.slice(lastAddedPointIndex + 1, i + 1).map(([, v]) => v)
+          ),
+        ])
+
+        points.push([
+          data[i][0],
+          Math.min(
+            ...data.slice(lastAddedPointIndex + 1, i + 1).map(([, v]) => v)
+          ),
+        ])
+      }
 
       lastAddedPointIndex = i
     }