store map position in history

[alttp.git] / resources / js / components / map / Item.js

diff --git a/resources/js/components/map/Item.js b/resources/js/components/map/Item.js
index 4bd209acbcb8e617605040d65e0a5dcb3589c060..a29443bac3bb8f2eda5bd391407ddc4505e10937 100644 (file)
--- a/resources/js/components/map/Item.js
+++ b/resources/js/components/map/Item.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { Button } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
+import { Link, useSearchParams } from 'react-router-dom';
 
 import { useOpenSeadragon } from './OpenSeadragon';
 import Icon from '../common/Icon';
@@ -19,12 +19,12 @@ import i18n from '../../i18n';
 
 const Item = ({ pin }) => {
        const { viewer } = useOpenSeadragon();
+       const [, setSearchParams] = useSearchParams();
        const { t } = useTranslation();
 
        const goToLocation = React.useCallback(pin => {
-               if (viewer && viewer.viewport) {
-                       viewer.viewport.panTo(new OpenSeadragon.Point(pin.x, pin.y));
-                       viewer.viewport.zoomTo(4);
+               setSearchParams({ x: pin.x, y: pin.y, z: 4 });
+               if (viewer && viewer.element) {
                        viewer.element.scrollIntoView();
                }
        }, [viewer]);