Make some timeline into presentational comps

This commit is contained in:
Franc Camps-Febrer
2019-01-04 19:44:13 +01:00
parent 9fad640fbe
commit 8fe6600c67
9 changed files with 102 additions and 110 deletions

View File

@@ -0,0 +1,25 @@
import React from 'react';
const TimelineZoomControls = ({ zoomLevels, dims, onApplyZoom }) => {
function renderZoom(zoom, idx) {
return (
<text
className={`zoom-level-button ${zoom.active ? 'active' : ''}`}
x="60"
y={(idx * 15) + 20}
onClick={() => onApplyZoom(zoom)}
>
{zoom.label}
</text>
)
}
return (
<g transform={`translate(${dims.width - dims.width_controls}, 0)`}>
{zoomLevels.map((z, idx) => renderZoom(z, idx))}
</g>
);
}
export default TimelineZoomControls;