React-zoom-pan-pinch не сохраняет положение контейнера при постраничном перемещении

Коллеги, кто работал с библиотекой react-zoom-pan-pinch? Использую с компонентами draggable внутри. Проблема вот какая: если мы переместили весь контейнер с таблицами, перешли на другую страницу, а потом вернулись на главную, контейнер смещается в начальное положение. Попробовала решить проблему так: через onTransformed получить обновленные координаты области и записать их объекту, а затем отрисовать через initialPositionX и initialPositionУ. Все равно область сдвигается. Как можно обойти проблему?

export const Daigram = () => {
const [diagram, setDiagram] = useState({});
const [isMoveable, setIsMoveable] = useState(false);

const onChangeDiagramHandler = (newDiagram) => {
        setDiagram(newDiagram);
    };

    const onChangeDiagramPositionHandler = (positionX, positionY) => {
        const changedDiagram = {
            diagramId: diagram.diagramId,
            name: diagram.name,
            isShared: diagram.isShared,
            areas: diagram.areas,
            position: {
                x: positionX,
                y: positionY
            }
        };
        onChangeDiagramHandler(changedDiagram);
    };
const getTables = () => {
        let components = [];

        diagram.areas?.map((area) => {
                components.push(
                    <Table                        
                        table={table}                        
                        onDrag={onDrag}
                        onStop={onStop}
                    />
                );
            });
        });

        return components;
    };
let initialX;
    let initialY;
    if (!diagram.name) {
        initialX = null;
        initialY = null;
    } else {
        initialX = diagram.position.x;
        initialY = diagram.position.y;
    }
    return (
<TransformWrapper
                            initialScale={scale}
                            initialPositionX={initialX}
                            initialPositionY={initialY}
                            onTransformed={(elem, state) =>
                                onChangeDiagramPositionHandler(
                                    state.positionX,
                                    state.positionY
                                )
                            }                                                
                            disabled={isMoveable}
                            minScale={0.4}
                            maxScale={1.1}
                            limitToBounds={false}
                            onPanning={updateXarrow}
                            pinch={{ step: 5 }}
                            doubleClick={{ disabled: true }}
                            zoomIn={{ step: 50 }}
                            zoomOut={{ step: 50 }}
                            onZoomStop={(e) => {
                                setScale(e.state.scale);
                            }}
                            onZoom={(e) => {
                                setScale(e.state.scale);
                                updateXarrow();
                            }}
                        >
{({ zoomIn, zoomOut, ...rest }) => (
<TransformComponent
                                                    contentClass="main"
                                                    wrapperStyle={{
                                                        height: "250vh",
                                                        width: "200vw"
                                                    }}
                                                    // contentStyle={{
                                                    //     marginLeft: `${initialX}px`,
                                                    //     marginTop: `${initialY}px`
                                                    // }}
                                                >
                                                    <div
                                                        id="my-diag-tables"
                                                        className={
                                                            styles.TableContainer
                                                        }
                                                    >
                                                        {getTables()}
                                                    </div>
                                                </TransformComponent>
)}
</TransformWrapper>
);
}

Пыталась даже через contentStyle проп поставить отступы по полученным координатам, но они некорректные, сдвиг происходит.

Может, посоветуете, как обойти еще можно проблему?