46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import type { LocationBase, ScrollPosition } from 'scroll-behavior';
|
|
|
|
const STATE_KEY_PREFIX = '@@scroll|';
|
|
|
|
interface LocationBaseWithKey extends LocationBase {
|
|
key?: string;
|
|
}
|
|
|
|
/**
|
|
* This module is part of our port of https://github.com/ytase/react-router-scroll/
|
|
* and handles storing scroll positions in SessionStorage.
|
|
* Stored positions (`[x, y]`) are keyed by the location key and an optional
|
|
* `scrollKey` that's used for to track separately scrollable elements other
|
|
* than the document body.
|
|
*/
|
|
|
|
export class SessionStorage {
|
|
read(
|
|
location: LocationBaseWithKey,
|
|
key: string | null,
|
|
): ScrollPosition | null {
|
|
const stateKey = this.getStateKey(location, key);
|
|
|
|
try {
|
|
const value = sessionStorage.getItem(stateKey);
|
|
return value ? (JSON.parse(value) as ScrollPosition) : null;
|
|
} catch {
|
|
return null;
|
|
}
|
|
}
|
|
|
|
save(location: LocationBaseWithKey, key: string | null, value: unknown) {
|
|
const stateKey = this.getStateKey(location, key);
|
|
const storedValue = JSON.stringify(value);
|
|
|
|
try {
|
|
sessionStorage.setItem(stateKey, storedValue);
|
|
} catch {}
|
|
}
|
|
|
|
getStateKey(location: LocationBaseWithKey, key: string | null) {
|
|
const locationKey = location.key;
|
|
const stateKeyBase = `${STATE_KEY_PREFIX}${locationKey}`;
|
|
return key == null ? stateKeyBase : `${stateKeyBase}|${key}`;
|
|
}
|
|
}
|