diff --git a/src/hooks/leaflet/useLayers.ts b/src/hooks/leaflet/useLayers.ts
new file mode 100644
index 0000000..e69a7ca
--- /dev/null
+++ b/src/hooks/leaflet/useLayers.ts
@@ -0,0 +1,24 @@
+import leaflet from 'leaflet';
+import { type Ref, useEffect } from 'preact/hooks';
+
+export const useLayers = (
+    mapRef: Readonly<Ref<leaflet.Map | undefined>>,
+    layers: leaflet.Layer[],
+) =>
+    useEffect(() => {
+        const map = mapRef.current;
+        if (!map) {
+            return;
+        }
+
+        for (const layer of layers) {
+            layer.addTo(map);
+        }
+
+        return () => {
+            for (const layer of layers) {
+                layer.removeFrom(map);
+                layer.remove();
+            }
+        };
+    }, [mapRef, layers]);
diff --git a/src/routePlanner/hooks/useMap/index.ts b/src/hooks/leaflet/useMap.ts
similarity index 100%
rename from src/routePlanner/hooks/useMap/index.ts
rename to src/hooks/leaflet/useMap.ts
diff --git a/src/routePlanner/hooks/useMapClick/index.ts b/src/hooks/leaflet/useMapClick.ts
similarity index 91%
rename from src/routePlanner/hooks/useMapClick/index.ts
rename to src/hooks/leaflet/useMapClick.ts
index f7f8a71..38e43db 100644
--- a/src/routePlanner/hooks/useMapClick/index.ts
+++ b/src/hooks/leaflet/useMapClick.ts
@@ -1,6 +1,6 @@
 import leaflet from 'leaflet';
 import { type Ref, useEffect } from 'preact/hooks';
-import type { Coordinates } from '../../../shared/types';
+import type { Coordinates } from '../../shared/types';
 
 export const useMapClick = (
     mapRef: Readonly<Ref<leaflet.Map | undefined>>,
diff --git a/src/routePlanner/hooks/usePrompt/index.ts b/src/hooks/usePrompt.ts
similarity index 89%
rename from src/routePlanner/hooks/usePrompt/index.ts
rename to src/hooks/usePrompt.ts
index 95dbe0e..02a1b1a 100644
--- a/src/routePlanner/hooks/usePrompt/index.ts
+++ b/src/hooks/usePrompt.ts
@@ -4,11 +4,10 @@ export const usePrompt = (
     message: string,
     defaultValue: string,
     onChange: (newValue: string) => void,
-) => {
-    return useCallback(() => {
+) =>
+    useCallback(() => {
         const newValue = prompt(message, defaultValue);
         if (newValue?.length) {
             onChange(newValue);
         }
     }, [message, defaultValue, onChange]);
-};
diff --git a/src/routePlanner/hooks/useSortable/index.ts b/src/hooks/useSortable.ts
similarity index 88%
rename from src/routePlanner/hooks/useSortable/index.ts
rename to src/hooks/useSortable.ts
index ff062b8..60fc354 100644
--- a/src/routePlanner/hooks/useSortable/index.ts
+++ b/src/hooks/useSortable.ts
@@ -1,10 +1,9 @@
 import { type Ref, useEffect } from 'preact/hooks';
 import Sortable from 'sortablejs';
-import type { ReorderListParams } from '../../types';
 
 export const useSortable = (
     listContainerRef: Readonly<Ref<HTMLElement>>,
-    onListReorder: (params: ReorderListParams) => void,
+    onListReorder: (params: { oldIndex: number; newIndex: number }) => void,
 ) =>
     useEffect(() => {
         if (!listContainerRef.current) {
diff --git a/src/routePlanner/hooks/useMarkersOnMap/index.ts b/src/routePlanner/hooks/useMarkersOnMap/index.ts
index 38a558f..6c607eb 100644
--- a/src/routePlanner/hooks/useMarkersOnMap/index.ts
+++ b/src/routePlanner/hooks/useMarkersOnMap/index.ts
@@ -1,28 +1,13 @@
 import leaflet from 'leaflet';
-import { type Ref, useEffect } from 'preact/hooks';
+import { type Ref, useMemo } from 'preact/hooks';
+import { useLayers } from '../../../hooks/leaflet/useLayers';
 import type { Marker } from '../../types';
 import { getLayersForMarkers } from './getLayersForMarkers';
 
 export const useMarkersOnMap = (
     mapRef: Readonly<Ref<leaflet.Map | undefined>>,
     markers: Marker[],
-) =>
-    useEffect(() => {
-        const map = mapRef.current;
-        if (!map) {
-            return;
-        }
-
-        const layers = getLayersForMarkers(markers);
-
-        for (const layer of layers) {
-            layer.addTo(map);
-        }
-
-        return () => {
-            for (const layer of layers) {
-                layer.removeFrom(map);
-                layer.remove();
-            }
-        };
-    }, [mapRef, markers]);
+) => {
+    const layers = useMemo(() => getLayersForMarkers(markers), [markers]);
+    useLayers(mapRef, layers);
+};
diff --git a/src/routePlanner/map.tsx b/src/routePlanner/map.tsx
index a9a2cda..7b87bcd 100644
--- a/src/routePlanner/map.tsx
+++ b/src/routePlanner/map.tsx
@@ -1,6 +1,6 @@
 import { useRef } from 'preact/hooks';
-import { useMap } from './hooks/useMap';
-import { useMapClick } from './hooks/useMapClick';
+import { useMap } from '../hooks/leaflet/useMap';
+import { useMapClick } from '../hooks/leaflet/useMapClick';
 import { useMarkersOnMap } from './hooks/useMarkersOnMap';
 import type { MapProps } from './types';
 
diff --git a/src/routePlanner/marker.tsx b/src/routePlanner/marker.tsx
index 5bb4649..b94ac83 100644
--- a/src/routePlanner/marker.tsx
+++ b/src/routePlanner/marker.tsx
@@ -1,4 +1,4 @@
-import { usePrompt } from './hooks/usePrompt';
+import { usePrompt } from '../hooks/usePrompt';
 import type { MarkerProps } from './types';
 
 export const MarkerComponent = ({ marker, isFirst, isLast }: MarkerProps) => {
diff --git a/src/routePlanner/markers.tsx b/src/routePlanner/markers.tsx
index 1140667..a045b35 100644
--- a/src/routePlanner/markers.tsx
+++ b/src/routePlanner/markers.tsx
@@ -1,5 +1,5 @@
 import { useRef } from 'preact/hooks';
-import { useSortable } from './hooks/useSortable';
+import { useSortable } from '../hooks/useSortable';
 import { MarkerComponent } from './marker';
 import type { MarkersProps } from './types';