import {
selectElement,
makeElement,
pathInterpolators,
Symbols
} from 'muze-utils';
import { updateStyle } from '../../helpers';
const line = Symbols.line;
/**
* Draws a line from the points
* Generates a svg path string
* @param {Object} params Contains container, points and interpolate attribute.
*/
export const drawLine = (context) => {
let filteredPoints;
const { container, points, interpolate, connectNullData, className, style, transition } = context;
const mount = selectElement(container).attr('class', className);
const curveInterpolatorFn = pathInterpolators[interpolate];
const linepath = line()
.curve(curveInterpolatorFn)
.x(d => d.update.x)
.y(d => d.update.y)
.defined(d => d.update.y !== null);
filteredPoints = points;
if (connectNullData) {
filteredPoints = points.filter(d => d.update.y !== null);
}
updateStyle(mount, style);
let element = makeElement(mount, 'path', [1]);
element.classed(points[0].className, true);
if (!transition.disabled) {
element = element.transition().duration(transition.duration);
}
element.attr('d', linepath(filteredPoints))
.style('fill-opacity', 0);
return element;
};