How can I add a hover tooltip & vertical line to a Linechart in React Native using Victory Native?

I Want result like this on hover getting vertical line with tooltip

but I’m not able to add tooltip of data

here is my result below

how can I achieve desire result, I’m looking for when I hover on chart so it should show line with toolttip of data which I provide to linechart?

Here is my code

import React, {useState} from 'react';
import {
  VictoryChart,
  VictoryCursorContainer,
  VictoryLine,
} from 'victory-native';


const TestComp = () => {
  const [hoverData, setHoverData] = useState(null);

  const handleCursorChange = (points, props) => {
    console.log(props.cursorValue);
    if (points && points.length > 0) {
      const {x} = points[0];
      setHoverData(x);
    } else {
      setHoverData(null);
    }
  };
  return (
    <View style={styles.container}>
      <VictoryChart
        domain={{x: [0, 10], y: [0, 10]}}
        containerComponent={
          <VictoryCursorContainer
            cursorDimension="x"
            cursorLabel={hoverData ? hoverData : ''}
            onCursorChange={handleCursorChange}
          />
        }>
        <VictoryLine
          data={[
            {x: 1, y: 2},
            {x: 2, y: 3},
            {x: 3, y: 5},
            {x: 4, y: 4},
            {x: 5, y: 7},
            {x: 6, y: 6},
            {x: 7, y: 8},
            {x: 8, y: 7},
            {x: 9, y: 9},
            {x: 10, y: 8},
          ]}
        />
      </VictoryChart>
    </View>
  );
};

export default TestComp;