chore(react/collections/geomap): save state

This commit is contained in:
Elian Doran
2025-09-04 14:26:29 +03:00
parent 620e6012da
commit 2346230d36
3 changed files with 41 additions and 8 deletions

View File

@@ -1,9 +1,10 @@
import Map from "./map";
import "./index.css";
import { ViewModeProps } from "../interface";
import { useNoteLabel } from "../../react/hooks";
import { useNoteLabel, useSpacedUpdate } from "../../react/hooks";
import { DEFAULT_MAP_LAYER_NAME } from "./map_layer";
import { LatLng } from "leaflet";
import { useEffect, useRef } from "preact/hooks";
const DEFAULT_COORDINATES: [number, number] = [3.878638227135724, 446.6630455551659];
const DEFAULT_ZOOM = 2;
@@ -17,6 +18,19 @@ interface MapData {
export default function GeoView({ note, viewStorage }: ViewModeProps<MapData>) {
const [ layerName ] = useNoteLabel(note, "map:style");
const viewOptions = useRef<MapData["view"]>();
const spacedUpdate = useSpacedUpdate(() => {
viewStorage.store({
view: viewOptions.current
});
}, 5000);
// Clean up on note change.
useEffect(() => {
viewStorage.restore().then(data => {
viewOptions.current = data?.view;
});
}, [ note ]);
return (
<div className="geo-view">
@@ -24,6 +38,12 @@ export default function GeoView({ note, viewStorage }: ViewModeProps<MapData>) {
coordinates={DEFAULT_COORDINATES}
zoom={DEFAULT_ZOOM}
layerName={layerName ?? DEFAULT_MAP_LAYER_NAME}
viewportChanged={(coordinates, zoom) => {
if (!viewOptions.current) return;
viewOptions.current.center = coordinates;
viewOptions.current.zoom = zoom;
spacedUpdate.scheduleUpdate();
}}
/>
</div>
);