gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-28 18:18:55 +01:00
Code Issues Actions 16 Packages Projects Releases Wiki Activity

fix(react/collections/geomap): drag not always working

Browse Source
This commit is contained in:
Elian Doran 2025-09-05 10:32:26 +03:00
parent d3c66714c2
commit 3d88b3c74b
No known key found for this signature in database
2 changed files with 19 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/widgets/collections/geomap/index.tsx
View File

@ -1,4 +1,4 @@
import Map from "./map";
import Map, { MapApi } from "./map";
import "./index.css";
import { ViewModeProps } from "../interface";
import { useNoteBlob, useNoteLabel, useNoteLabelBoolean, useNoteProperty, useNoteTreeDrag, useSpacedUpdate, useTriliumEvent } from "../../react/hooks";
@ -90,7 +90,7 @@ export default function GeoView({ note, noteIds, viewConfig, saveConfig }: ViewM
// Dragging
const containerRef = useRef<HTMLDivElement>(null);
const apiRef = useRef<L.Map>(null);
const apiRef = useRef<MapApi>(null);
useNoteTreeDrag(containerRef, async (treeData, e) => {
const api = apiRef.current;
if (!note || !api) return;

21
apps/client/src/widgets/collections/geomap/map.tsx
View File

@ -1,4 +1,4 @@
import { useEffect, useRef, useState } from "preact/hooks";
import { useEffect, useImperativeHandle, useRef, useState } from "preact/hooks";
import L, { control, LatLng, Layer, LeafletMouseEvent } from "leaflet";
import "leaflet/dist/leaflet.css";
import { MAP_LAYERS } from "./map_layer";
@ -8,7 +8,7 @@ import { useSyncedRef } from "../../react/hooks";
export const ParentMap = createContext<L.Map | null>(null);
interface MapProps {
apiRef?: RefObject<L.Map>;
apiRef?: RefObject<MapApi | null>;
containerRef?: RefObject<HTMLDivElement>;
coordinates: LatLng | [number, number];
zoom: number;
@ -20,10 +20,23 @@ interface MapProps {
scale: boolean;
}
export default function Map({ coordinates, zoom, layerName, viewportChanged, children, onClick, onContextMenu, scale, apiRef: _apiRef, containerRef: _containerRef }: MapProps) {
const mapRef = useSyncedRef<L.Map>(_apiRef);
export interface MapApi {
containerPointToLatLng: L.Map["containerPointToLatLng"];
}
export default function Map({ coordinates, zoom, layerName, viewportChanged, children, onClick, onContextMenu, scale, apiRef, containerRef: _containerRef }: MapProps) {
const mapRef = useRef<L.Map>(null);
const containerRef = useSyncedRef<HTMLDivElement>(_containerRef);
useImperativeHandle(apiRef ?? null, () => {
const map = mapRef.current;
if (!map) return null;
return {
containerPointToLatLng: (point) => map.containerPointToLatLng(point)
} satisfies MapApi;
});
useEffect(() => {
if (!containerRef.current) return;
const mapInstance = L.map(containerRef.current, {