text: import React, { useContext, useMemo } from 'react';
  import { Text } from 'react-native';
  import Animated from 'react-native-reanimated';
  import { Svg, Line} from 'react-native-svg';
  import ChartContext from '../../helpers/ChartContext';
  import withReanimatedFallback from '../../helpers/withReanimatedFallback';
  
  const LineType = {
    currentPosition: 'currentPosition',
    openingPosition: 'openingPosition',
    min: 'min',
    max: 'max',
  }
  
  function ChartLineFactory(lineType) {
    return function ChartLine({
      color = '#000000',
      thickness = 2,
      length,
      ...props
    }) {
  
      const isVertical = lineType === LineType.currentPosition;
  
      const {
        currentPositionVerticalLineStyle,
        openingPositionHorizontalLineStyle,
        minimalPositionHorizontalLineStyle,
        maximalPositionHorizontalLineStyle,
        extremes,
      } = useContext(ChartContext);
  
      const lineValue = useMemo(() => {
        switch (lineType) {
          case LineType.min: {
            if (!extremes.minY || extremes.minY === 'undefined') {
              return '0.000';
            }
            return extremes.minY;
          }
          case LineType.max: {
            return extremes.maxY;
          }
          default: return null;
        }
      }, [lineType, extremes]);
  
      const additionalStyle = useMemo(() => {
        switch (lineType) {
          case LineType.openingPosition: {
            return openingPositionHorizontalLineStyle;
          }
          case LineType.min: {
            return minimalPositionHorizontalLineStyle;
          }
          case LineType.max: {
            return maximalPositionHorizontalLineStyle;
          }
          case LineType.currentPosition: {
            return currentPositionVerticalLineStyle;
          }
          default: return {};
        }
      }, [lineType, minimalPositionHorizontalLineStyle, currentPositionVerticalLineStyle]);
  
      return (
        <Animated.View
          pointerEvents="none"
          style={[
            additionalStyle,
            {
              height: isVertical ? length + 20 : 16,
              position: 'absolute',
              left: 0,
              top: 10,
              width: isVertical ? thickness : length,
              zIndex: -1,
              overflow: 'visible',
            },
          ]}
        >
          <Svg>
            <Line
              stroke={color}
              strokeWidth={thickness}
              strokeDasharray={10}
              x1={0}
              y1={0}
              x2={isVertical ? 0 : length}
              y2={isVertical ? length + 20 : 0}
              {...props}
            />
          </Svg>
          {
            lineValue
              ? (
                    <Text style={{
                      position: 'absolute',
                      top: -10,
                      right: 0,
                      fontFamily: 'Neue Haas Unica W1G',
                      fontSize: 10,
                      fontStyle: 'normal',
                      fontWeight: '500',
                      lineHeight: 16,
                      color: '#C7C7C7'
                    }}>{lineValue}</Text>
                ): null
          }
        </Animated.View>
      );
    };
  }
  
  export const CurrentPositionVerticalLine = withReanimatedFallback(
    ChartLineFactory(LineType.currentPosition)
  );
  export const OpeningPositionHorizontalLine = withReanimatedFallback(
    ChartLineFactory(LineType.openingPosition)
  );
  export const MinimalPositionHorizontalLine = withReanimatedFallback(
      ChartLineFactory(LineType.min)
  );
  export const MaximalPositionHorizontalLine = withReanimatedFallback(
      ChartLineFactory(LineType.max)
  );
  