polyline не перемещается вместе с картой

я просто хочу нарисовать ломаную на карте. почему она цепляется к углу карты и при передвижении карты не движется вместе с нею? первый скрин (начальное положение) второй скрин (двигаю карту, она двигается вместе с ломанной. еще не отпустил пкм) третий скрин (отпустил пкм, ломанная вернулась обратно в угол, в дополнение еще и обрезалась

import * as ReactDOM from 'react-dom'
import { useEffect, useState } from 'react'
const POLYLINE1 = {
  id: 'one',
  geometry: {
    type: 'LineString',
    coordinates: [
      // Specify the coordinates of the vertices of the polyline.
      [37.5, 55.7],
      [37.4, 55.8],
      [37.5, 55.8],
      [37.4, 55.7],
    ],
  },
  style: { stroke: [{ color: '#f00', width: 4 }] },
}


export const ReactMap = () => {
  const [reactify, setReactify] = useState(null)
  useEffect(() => {
    Promise.all([
      ymaps3.import('@yandex/ymaps3-reactify'),
      ymaps3.ready,
    ]).then(([ymaps3Reactify]) => {
      setReactify(ymaps3Reactify.reactify.bindTo(React, ReactDOM))
    })
  }, [])
  if (!reactify) return <>Loading</>
  const {
    YMap,
    YMapDefaultSchemeLayer,
    YMapDefaultFeaturesLayer,
    YMapFeature,
  } = reactify.module(ymaps3)

  return (
    <YMap location={{ center: [37.623082, 55.75254], zoom: 10 }} mode='vector'>
      <YMapDefaultSchemeLayer />
      <YMapDefaultFeaturesLayer />
      <YMapFeature {...POLYLINE1} />
    </YMap>
  )
}