diff --git a/src/components/map/Gpx.tsx b/src/components/map/Gpx.tsx index 2194bd0..141e66a 100644 --- a/src/components/map/Gpx.tsx +++ b/src/components/map/Gpx.tsx @@ -1,4 +1,4 @@ -import react, { useEffect, useState } from 'react'; +import react, { startTransition, useEffect, useState } from 'react'; import dispatch from '../../workers/dispatcher-main'; import Trk from './Trk'; import { TileKeyObject, Rectangle } from './types'; @@ -22,7 +22,7 @@ export const Gpx: react.FC = (props: GpxProperties) => { }, }); console.log(`, gpx: ${JSON.stringify(gpx)}`); - setGpx(gpx); + startTransition(() => setGpx(gpx)); }; getGpx(); }, [props.id]); diff --git a/src/components/map/Gpxes.tsx b/src/components/map/Gpxes.tsx index 90b6bd7..5f435ea 100644 --- a/src/components/map/Gpxes.tsx +++ b/src/components/map/Gpxes.tsx @@ -1,4 +1,4 @@ -import react, { useEffect, useState } from 'react'; +import react, { startTransition, useEffect, useState } from 'react'; import dispatch from '../../workers/dispatcher-main'; import Gpx from './Gpx'; import { TileKeyObject, Rectangle } from './types'; @@ -21,7 +21,7 @@ export const Gpxes: react.FC = (props: GpxesProperties) => { }, }); console.log(`Gpxes, visibles: ${JSON.stringify(gpxes)}`); - setVisibleGpxes(gpxes); + startTransition(() => setVisibleGpxes(gpxes)); }; if (props.viewPort !== undefined) { getVisibleGpxes(); diff --git a/src/components/map/Trk.tsx b/src/components/map/Trk.tsx index b3ef309..d9355d5 100644 --- a/src/components/map/Trk.tsx +++ b/src/components/map/Trk.tsx @@ -1,4 +1,4 @@ -import react, { useEffect, useState } from 'react'; +import react, { startTransition, useEffect, useState } from 'react'; import dispatch from '../../workers/dispatcher-main'; import { TileKeyObject, Rectangle } from './types'; import getUri from '../../lib/ids'; @@ -22,7 +22,7 @@ export const Trk: react.FC = (props: TrkProperties) => { }, }); console.log(`, gpx: ${JSON.stringify(trk)}`); - setTrk(trk); + startTransition(() => setTrk(trk)); }; getTrk(); }, [props.id]); diff --git a/src/components/map/Trkseg.tsx b/src/components/map/Trkseg.tsx index 9b4e3f2..7f70b6f 100644 --- a/src/components/map/Trkseg.tsx +++ b/src/components/map/Trkseg.tsx @@ -1,4 +1,4 @@ -import react, { useEffect, useState } from 'react'; +import react, { startTransition, useEffect, useState } from 'react'; import { lon2tile, lat2tile } from '../../lib/geo'; import dispatch from '../../workers/dispatcher-main'; import { TileKeyObject, Rectangle, Point, geoPoint } from './types'; @@ -26,7 +26,7 @@ export const Trkseg: react.FC = (props: TrksegProperties) => { }, }); console.log(`, gpx: ${JSON.stringify(trk)}`); - setTrkseg(trk); + startTransition(() => setTrkseg(trk)); }; getTrkseg(); }, [props.id]);