PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Protect local storage calls (#3043)

Browse source 
This PR provides some safe wrappers for local storage calls. Local
storage is not available in all environments (for example, a React
Native web view). The PR also adds an eslint rule preventing direct
calls to local / session storage.

### Change Type

- [x] `patch` — Bug fix

### Release Notes

- Fixes a bug that could cause crashes in React Native webviews.
This commit is contained in:
Steve Ruiz 2024-03-04 13:37:09 +00:00 committed by GitHub
parent 3161e5cb4f
commit 2f28d7c6f8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
18 changed files with 625 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.eslintrc.js
View file

@ -14,6 +14,7 @@ module.exports = {
'@next/next',
'react-hooks',
'deprecation',
'no-storage',
],
settings: {
next: {
@ -21,6 +22,7 @@ module.exports = {
},
},
rules: {
'no-storage/no-browser-storage': 2,
'deprecation/deprecation': 'error',
'@next/next/no-html-link-for-pages': 'off',
'react/jsx-key': 'off',

24
apps/dotcom/src/utils/scratch-persistence-key.ts
View file

@ -1,17 +1,15 @@
/**
* What is going on in this file?
*
* We had some bad early assumptions about how we would store documents.
* Which ended up with us generating random persistenceKey strings for the
* 'scratch' document for each user (i.e. each browser context), and storing it in localStorage.
*
* Many users still have that random string in their localStorage so we need to load it. But for new
* users it does not need to be unique and we can just use a constant.
*/
// What is going on in this file?
// We had some bad early assumptions about how we would store documents.
// Which ended up with us generating random persistenceKey strings for the
// 'scratch' document for each user (i.e. each browser context), and storing it in localStorage.
// Many users still have that random string in their localStorage so we need to load it. But for new
// users it does not need to be unique and we can just use a constant.
import { getFromLocalStorage, setInLocalStorage } from 'tldraw'
// DO NOT CHANGE THESE WITHOUT ADDING MIGRATION LOGIC. DOING SO WOULD WIPE ALL EXISTING LOCAL DATA.
const defaultDocumentKey = 'TLDRAW_DEFAULT_DOCUMENT_NAME_v2'
const w = typeof window === 'undefined' ? undefined : window
export const SCRATCH_PERSISTENCE_KEY =
(w?.localStorage.getItem(defaultDocumentKey) as any) ?? 'tldraw_document_v3'
w?.localStorage.setItem(defaultDocumentKey, SCRATCH_PERSISTENCE_KEY)
(getFromLocalStorage(defaultDocumentKey) as any) ?? 'tldraw_document_v3'
setInLocalStorage(defaultDocumentKey, SCRATCH_PERSISTENCE_KEY)

14
apps/dotcom/src/utils/userPreferences.ts
View file

@ -1,4 +1,4 @@
import { T, atom } from 'tldraw'
import { T, atom, getFromLocalStorage, setInLocalStorage } from 'tldraw'
const channel =
typeof BroadcastChannel !== 'undefined' ? new BroadcastChannel('tldrawUserPreferences') : null
@ -37,9 +37,7 @@ function createPreference<Type>(key: string, validator: T.Validator<Type>, defau
}
function loadItemFromStorage<Type>(key: string, validator: T.Validator<Type>): Type | null {
if (typeof localStorage === 'undefined' || !localStorage) return null
const item = localStorage.getItem(`tldrawUserPreferences.${key}`)
const item = getFromLocalStorage(`tldrawUserPreferences.${key}`, null)
if (item == null) return null
try {
return validator.validate(JSON.parse(item))
@ -49,11 +47,5 @@ function loadItemFromStorage<Type>(key: string, validator: T.Validator<Type>): T
}
function saveItemToStorage(key: string, value: unknown): void {
if (typeof localStorage === 'undefined' || !localStorage) return
try {
localStorage.setItem(`tldrawUserPreferences.${key}`, JSON.stringify(value))
} catch (e) {
// not a big deal
}
setInLocalStorage(`tldrawUserPreferences.${key}`, JSON.stringify(value))
}

13
apps/examples/src/examples/local-storage/LocalStorageExample.tsx
View file

@ -1,5 +1,12 @@
import { useLayoutEffect, useState } from 'react'
import { Tldraw, createTLStore, defaultShapeUtils, throttle } from 'tldraw'
import {
Tldraw,
createTLStore,
defaultShapeUtils,
getFromLocalStorage,
setInLocalStorage,
throttle,
} from 'tldraw'
import 'tldraw/tldraw.css'
// There's a guide at the bottom of this file!
@ -20,7 +27,7 @@ export default function PersistenceExample() {
setLoadingState({ status: 'loading' })
// Get persisted data from local storage
const persistedSnapshot = localStorage.getItem(PERSISTENCE_KEY)
const persistedSnapshot = getFromLocalStorage(PERSISTENCE_KEY)
if (persistedSnapshot) {
try {
@ -38,7 +45,7 @@ export default function PersistenceExample() {
const cleanupFn = store.listen(
throttle(() => {
const snapshot = store.getSnapshot()
localStorage.setItem(PERSISTENCE_KEY, JSON.stringify(snapshot))
setInLocalStorage(PERSISTENCE_KEY, JSON.stringify(snapshot))
}, 500)
)

1
package.json
View file

@ -112,6 +112,7 @@
"@sentry/cli": "^2.25.0",
"@yarnpkg/types": "^4.0.0",
"cross-env": "^7.0.3",
"eslint-plugin-no-storage": "^1.0.2",
"purgecss": "^5.0.0",
"svgo": "^3.0.2"
}

17
packages/editor/src/lib/config/TLSessionStateSnapshot.ts
View file

@ -17,7 +17,12 @@ import {
pageIdValidator,
shapeIdValidator,
} from '@tldraw/tlschema'
import { objectMapFromEntries } from '@tldraw/utils'
import {
deleteFromSessionStorage,
getFromSessionStorage,
objectMapFromEntries,
setInSessionStorage,
} from '@tldraw/utils'
import { T } from '@tldraw/validate'
import { uniqueId } from '../utils/uniqueId'
@ -26,7 +31,9 @@ const tabIdKey = 'TLDRAW_TAB_ID_v2' as const
const window = globalThis.window as
| {
navigator: Window['navigator']
// eslint-disable-next-line no-storage/no-browser-storage
localStorage: Window['localStorage']
// eslint-disable-next-line no-storage/no-browser-storage
sessionStorage: Window['sessionStorage']
addEventListener: Window['addEventListener']
TLDRAW_TAB_ID_v2?: string
@ -51,7 +58,7 @@ function iOS() {
* @public
*/
export const TAB_ID: string = window
? window[tabIdKey] ?? window.sessionStorage[tabIdKey] ?? `TLDRAW_INSTANCE_STATE_V1_` + uniqueId()
? window[tabIdKey] ?? getFromSessionStorage(tabIdKey) ?? `TLDRAW_INSTANCE_STATE_V1_` + uniqueId()
: '<error>'
if (window) {
window[tabIdKey] = TAB_ID
@ -62,14 +69,14 @@ if (window) {
// in which case they'll have two tabs with the same UI state.
// It's not a big deal, but it's not ideal.
// And anyway I can't see a way to duplicate a tab in iOS Safari.
window.sessionStorage[tabIdKey] = TAB_ID
setInSessionStorage(tabIdKey, TAB_ID)
} else {
delete window.sessionStorage[tabIdKey]
deleteFromSessionStorage(tabIdKey)
}
}
window?.addEventListener('beforeunload', () => {
window.sessionStorage[tabIdKey] = TAB_ID
setInSessionStorage(tabIdKey, TAB_ID)
})
const Versions = {

19
packages/editor/src/lib/config/TLUserPreferences.ts
View file

@ -1,6 +1,7 @@
import { atom } from '@tldraw/state'
import { defineMigrations, migrate } from '@tldraw/store'
import { getDefaultTranslationLocale } from '@tldraw/tlschema'
import { getFromLocalStorage, setInLocalStorage } from '@tldraw/utils'
import { T } from '@tldraw/validate'
import { uniqueId } from '../utils/uniqueId'
@ -203,7 +204,7 @@ function loadUserPreferences(): TLUserPreferences {
const userData =
typeof window === 'undefined'
? null
: ((JSON.parse(window?.localStorage?.getItem(USER_DATA_KEY) || 'null') ??
: ((JSON.parse(getFromLocalStorage(USER_DATA_KEY) || 'null') ??
null) as null | UserDataSnapshot)
return migrateUserPreferences(userData)
@ -212,15 +213,13 @@ function loadUserPreferences(): TLUserPreferences {
const globalUserPreferences = atom<TLUserPreferences | null>('globalUserData', null)
function storeUserPreferences() {
if (typeof window !== 'undefined' && window.localStorage) {
window.localStorage.setItem(
USER_DATA_KEY,
JSON.stringify({
version: userMigrations.currentVersion,
user: globalUserPreferences.get(),
})
)
}
setInLocalStorage(
USER_DATA_KEY,
JSON.stringify({
version: userMigrations.currentVersion,
user: globalUserPreferences.get(),
})
)
}
/** @public */

7
packages/editor/src/lib/utils/debug-flags.ts
View file

@ -1,4 +1,5 @@
import { Atom, atom, react } from '@tldraw/state'
import { deleteFromSessionStorage, getFromSessionStorage, setInSessionStorage } from '@tldraw/utils'
// --- 1. DEFINE ---
//
@ -128,9 +129,9 @@ function createDebugValueBase<T>(def: DebugFlagDef<T>): DebugFlag<T> {
const currentValue = valueAtom.get()
try {
if (currentValue === defaultValue) {
window.sessionStorage.removeItem(`tldraw_debug:${def.name}`)
deleteFromSessionStorage(`tldraw_debug:${def.name}`)
} else {
window.sessionStorage.setItem(`tldraw_debug:${def.name}`, JSON.stringify(currentValue))
setInSessionStorage(`tldraw_debug:${def.name}`, JSON.stringify(currentValue))
}
} catch {
// not a big deal
@ -154,7 +155,7 @@ function createDebugValueBase<T>(def: DebugFlagDef<T>): DebugFlag<T> {
function getStoredInitialValue(name: string) {
try {
return JSON.parse(window?.sessionStorage.getItem(`tldraw_debug:${name}`) ?? 'null')
return JSON.parse(getFromSessionStorage(`tldraw_debug:${name}`) ?? 'null')
} catch (err) {
return null
}

9
packages/editor/src/lib/utils/sync/hardReset.ts
View file

@ -1,3 +1,4 @@
import { clearLocalStorage } from '@tldraw/utils'
import { deleteDB } from 'idb'
import { getAllIndexDbNames } from './indexedDb'
@ -6,13 +7,15 @@ import { getAllIndexDbNames } from './indexedDb'
*
* @public */
export async function hardReset({ shouldReload = true } = {}) {
sessionStorage.clear()
clearLocalStorage()
await Promise.all(getAllIndexDbNames().map((db) => deleteDB(db)))
localStorage.clear()
clearLocalStorage()
if (shouldReload) {
window.location.reload()
if (typeof window !== 'undefined') {
window.location.reload()
}
}
}

1
packages/editor/src/lib/utils/sync/indexedDb.test.ts
View file

@ -9,6 +9,7 @@ import {
const clearAll = async () => {
const dbs = (indexedDB as any)._databases as Map<any, any>
dbs.clear()
// eslint-disable-next-line no-storage/no-browser-storage
localStorage.clear()
}

5
packages/editor/src/lib/utils/sync/indexedDb.ts
View file

@ -1,5 +1,6 @@
import { RecordsDiff, SerializedSchema, SerializedStore } from '@tldraw/store'
import { TLRecord, TLStoreSchema } from '@tldraw/tlschema'
import { getFromLocalStorage, setInLocalStorage } from '@tldraw/utils'
import { IDBPDatabase, openDB } from 'idb'
import { TLSessionStateSnapshot } from '../../config/TLSessionStateSnapshot'
@ -221,7 +222,7 @@ async function pruneSessionState({
/** @internal */
export function getAllIndexDbNames(): string[] {
const result = JSON.parse(window?.localStorage.getItem(dbNameIndexKey) || '[]') ?? []
const result = JSON.parse(getFromLocalStorage(dbNameIndexKey) || '[]') ?? []
if (!Array.isArray(result)) {
return []
}
@ -231,5 +232,5 @@ export function getAllIndexDbNames(): string[] {
function addDbName(name: string) {
const all = new Set(getAllIndexDbNames())
all.add(name)
window?.localStorage.setItem(dbNameIndexKey, JSON.stringify([...all]))
setInLocalStorage(dbNameIndexKey, JSON.stringify([...all]))
}

5
packages/tldraw/src/lib/ui/hooks/useLocalStorageState.ts
View file

@ -1,3 +1,4 @@
import { getFromLocalStorage, setInLocalStorage } from '@tldraw/editor'
import React from 'react'
/** @public */
@ -5,7 +6,7 @@ export function useLocalStorageState<T = any>(key: string, defaultValue: T) {
const [state, setState] = React.useState(defaultValue)
React.useLayoutEffect(() => {
const value = localStorage.getItem(key)
const value = getFromLocalStorage(key)
if (value) {
try {
setState(JSON.parse(value))
@ -19,7 +20,7 @@ export function useLocalStorageState<T = any>(key: string, defaultValue: T) {
(setter: T | ((value: T) => T)) => {
setState((s) => {
const value = typeof setter === 'function' ? (setter as any)(s) : setter
localStorage.setItem(key, JSON.stringify(value))
setInLocalStorage(key, JSON.stringify(value))
return value
})
},

24
packages/utils/api-report.md
View file

@ -19,6 +19,12 @@ export const assert: (value: unknown, message?: string) => asserts value;
// @internal (undocumented)
export const assertExists: <T>(value: T, message?: string | undefined) => NonNullable<T>;
// @public
export function clearLocalStorage(): void;
// @public
export function clearSessionStorage(): void;
// @internal (undocumented)
export function compact<T>(arr: T[]): NonNullable<T>[];
@ -34,6 +40,12 @@ export function dedupe<T>(input: T[], equals?: (a: any, b: any) => boolean): T[]
// @public
export function deepCopy<T = unknown>(obj: T): T;
// @public
export function deleteFromLocalStorage(key: string): void;
// @public
export function deleteFromSessionStorage(key: string): void;
// @public (undocumented)
export type ErrorResult<E> = {
readonly ok: false;
@ -68,6 +80,12 @@ export function getErrorAnnotations(error: Error): ErrorAnnotations;
// @public
export function getFirstFromIterable<T = unknown>(set: Map<any, T> | Set<T>): T;
// @public
export function getFromLocalStorage(key: string, defaultValue?: null): any;
// @public
export function getFromSessionStorage(key: string, defaultValue?: null): any;
// @public
export function getHashForBuffer(buffer: ArrayBuffer): string;
@ -273,6 +291,12 @@ export function rng(seed?: string): () => number;
// @public
export function rotateArray<T>(arr: T[], offset: number): T[];
// @public
export function setInLocalStorage(key: string, value: any): void;
// @public
export function setInSessionStorage(key: string, value: any): void;
// @public (undocumented)
export function sortById<T extends {
id: any;

390
packages/utils/api/api.json
View file

@ -172,6 +172,62 @@
"name": "",
"preserveMemberOrder": false,
"members": [
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!clearLocalStorage:function(1)",
"docComment": "/**\n * Clear all values from local storage. Will not throw an error if localStorage is not available.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function clearLocalStorage(): "
},
{
"kind": "Content",
"text": "void"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/local-storage.ts",
"returnTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [],
"name": "clearLocalStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!clearSessionStorage:function(1)",
"docComment": "/**\n * Clear all values from session storage. Will not throw an error if sessionStorage is not available.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function clearSessionStorage(): "
},
{
"kind": "Content",
"text": "void"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/session-storage.ts",
"returnTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [],
"name": "clearSessionStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!debounce:function(1)",
@ -423,6 +479,96 @@
],
"name": "deepCopy"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!deleteFromLocalStorage:function(1)",
"docComment": "/**\n * Remove a value from local storage. Will not throw an error if localStorage is not available.\n *\n * @param key - The key to set.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function deleteFromLocalStorage(key: "
},
{
"kind": "Content",
"text": "string"
},
{
"kind": "Content",
"text": "): "
},
{
"kind": "Content",
"text": "void"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/local-storage.ts",
"returnTypeTokenRange": {
"startIndex": 3,
"endIndex": 4
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [
{
"parameterName": "key",
"parameterTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"isOptional": false
}
],
"name": "deleteFromLocalStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!deleteFromSessionStorage:function(1)",
"docComment": "/**\n * Remove a value from session storage. Will not throw an error if sessionStorage is not available.\n *\n * @param key - The key to set.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function deleteFromSessionStorage(key: "
},
{
"kind": "Content",
"text": "string"
},
{
"kind": "Content",
"text": "): "
},
{
"kind": "Content",
"text": "void"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/session-storage.ts",
"returnTypeTokenRange": {
"startIndex": 3,
"endIndex": 4
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [
{
"parameterName": "key",
"parameterTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"isOptional": false
}
],
"name": "deleteFromSessionStorage"
},
{
"kind": "TypeAlias",
"canonicalReference": "@tldraw/utils!ErrorResult:type",
@ -654,6 +800,128 @@
],
"name": "getFirstFromIterable"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!getFromLocalStorage:function(1)",
"docComment": "/**\n * Get a value from local storage.\n *\n * @param key - The key to get.\n *\n * @param defaultValue - The default value to return if the key is not found or if local storage is not available.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function getFromLocalStorage(key: "
},
{
"kind": "Content",
"text": "string"
},
{
"kind": "Content",
"text": ", defaultValue?: "
},
{
"kind": "Content",
"text": "null"
},
{
"kind": "Content",
"text": "): "
},
{
"kind": "Content",
"text": "any"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/local-storage.ts",
"returnTypeTokenRange": {
"startIndex": 5,
"endIndex": 6
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [
{
"parameterName": "key",
"parameterTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"isOptional": false
},
{
"parameterName": "defaultValue",
"parameterTypeTokenRange": {
"startIndex": 3,
"endIndex": 4
},
"isOptional": true
}
],
"name": "getFromLocalStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!getFromSessionStorage:function(1)",
"docComment": "/**\n * Get a value from session storage.\n *\n * @param key - The key to get.\n *\n * @param defaultValue - The default value to return if the key is not found or if session storage is not available.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function getFromSessionStorage(key: "
},
{
"kind": "Content",
"text": "string"
},
{
"kind": "Content",
"text": ", defaultValue?: "
},
{
"kind": "Content",
"text": "null"
},
{
"kind": "Content",
"text": "): "
},
{
"kind": "Content",
"text": "any"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/session-storage.ts",
"returnTypeTokenRange": {
"startIndex": 5,
"endIndex": 6
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [
{
"parameterName": "key",
"parameterTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"isOptional": false
},
{
"parameterName": "defaultValue",
"parameterTypeTokenRange": {
"startIndex": 3,
"endIndex": 4
},
"isOptional": true
}
],
"name": "getFromSessionStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!getHashForBuffer:function(1)",
@ -3061,6 +3329,128 @@
],
"name": "rotateArray"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!setInLocalStorage:function(1)",
"docComment": "/**\n * Set a value in local storage. Will not throw an error if localStorage is not available.\n *\n * @param key - The key to set.\n *\n * @param value - The value to set.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function setInLocalStorage(key: "
},
{
"kind": "Content",
"text": "string"
},
{
"kind": "Content",
"text": ", value: "
},
{
"kind": "Content",
"text": "any"
},
{
"kind": "Content",
"text": "): "
},
{
"kind": "Content",
"text": "void"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/local-storage.ts",
"returnTypeTokenRange": {
"startIndex": 5,
"endIndex": 6
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [
{
"parameterName": "key",
"parameterTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"isOptional": false
},
{
"parameterName": "value",
"parameterTypeTokenRange": {
"startIndex": 3,
"endIndex": 4
},
"isOptional": false
}
],
"name": "setInLocalStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!setInSessionStorage:function(1)",
"docComment": "/**\n * Set a value in session storage. Will not throw an error if sessionStorage is not available.\n *\n * @param key - The key to set.\n *\n * @param value - The value to set.\n *\n * @public\n */\n",
"excerptTokens": [
{
"kind": "Content",
"text": "export declare function setInSessionStorage(key: "
},
{
"kind": "Content",
"text": "string"
},
{
"kind": "Content",
"text": ", value: "
},
{
"kind": "Content",
"text": "any"
},
{
"kind": "Content",
"text": "): "
},
{
"kind": "Content",
"text": "void"
},
{
"kind": "Content",
"text": ";"
}
],
"fileUrlPath": "packages/utils/src/lib/session-storage.ts",
"returnTypeTokenRange": {
"startIndex": 5,
"endIndex": 6
},
"releaseTag": "Public",
"overloadIndex": 1,
"parameters": [
{
"parameterName": "key",
"parameterTypeTokenRange": {
"startIndex": 1,
"endIndex": 2
},
"isOptional": false
},
{
"parameterName": "value",
"parameterTypeTokenRange": {
"startIndex": 3,
"endIndex": 4
},
"isOptional": false
}
],
"name": "setInSessionStorage"
},
{
"kind": "Function",
"canonicalReference": "@tldraw/utils!sortById:function(1)",

12
packages/utils/src/index.ts
View file

@ -23,6 +23,12 @@ export { noop, omitFromStackTrace, throttle } from './lib/function'
export { getHashForBuffer, getHashForObject, getHashForString, lns } from './lib/hash'
export { getFirstFromIterable } from './lib/iterable'
export type { JsonArray, JsonObject, JsonPrimitive, JsonValue } from './lib/json-value'
export {
clearLocalStorage,
deleteFromLocalStorage,
getFromLocalStorage,
setInLocalStorage,
} from './lib/local-storage'
export { MediaHelpers } from './lib/media'
export { invLerp, lerp, modulate, rng } from './lib/number'
export {
@ -52,6 +58,12 @@ export {
sortByIndex,
validateIndexKey,
} from './lib/reordering/reordering'
export {
clearSessionStorage,
deleteFromSessionStorage,
getFromSessionStorage,
setInSessionStorage,
} from './lib/session-storage'
export { sortById } from './lib/sort'
export type { Expand, RecursivePartial, Required } from './lib/types'
export { isDefined, isNonNull, isNonNullish, structuredClone } from './lib/value'

63
packages/utils/src/lib/local-storage.ts Normal file
View file

@ -0,0 +1,63 @@
/* eslint-disable no-storage/no-browser-storage */
/**
* Get a value from local storage.
*
* @param key - The key to get.
* @param defaultValue - The default value to return if the key is not found or if local storage is not available.
*
* @public
*/
export function getFromLocalStorage(key: string, defaultValue = null) {
try {
const value = localStorage.getItem(key)
if (value === null) return defaultValue
return JSON.parse(value)
} catch {
return defaultValue
}
}
/**
* Set a value in local storage. Will not throw an error if localStorage is not available.
*
* @param key - The key to set.
* @param value - The value to set.
*
* @public
*/
export function setInLocalStorage(key: string, value: any) {
try {
localStorage.setItem(key, JSON.stringify(value))
} catch {
// noop
}
}
/**
* Remove a value from local storage. Will not throw an error if localStorage is not available.
*
* @param key - The key to set.
*
* @public
*/
export function deleteFromLocalStorage(key: string) {
try {
localStorage.removeItem(key)
} catch {
// noop
}
}
/**
* Clear all values from local storage. Will not throw an error if localStorage is not available.
*
* @public
*/
export function clearLocalStorage() {
try {
localStorage.clear()
} catch {
// noop
}
}

63
packages/utils/src/lib/session-storage.ts Normal file
View file

@ -0,0 +1,63 @@
/* eslint-disable no-storage/no-browser-storage */
/**
* Get a value from session storage.
*
* @param key - The key to get.
* @param defaultValue - The default value to return if the key is not found or if session storage is not available.
*
* @public
*/
export function getFromSessionStorage(key: string, defaultValue = null) {
try {
const value = sessionStorage.getItem(key)
if (value === null) return defaultValue
return JSON.parse(value)
} catch {
return defaultValue
}
}
/**
* Set a value in session storage. Will not throw an error if sessionStorage is not available.
*
* @param key - The key to set.
* @param value - The value to set.
*
* @public
*/
export function setInSessionStorage(key: string, value: any) {
try {
sessionStorage.setItem(key, JSON.stringify(value))
} catch {
// noop
}
}
/**
* Remove a value from session storage. Will not throw an error if sessionStorage is not available.
*
* @param key - The key to set.
*
* @public
*/
export function deleteFromSessionStorage(key: string) {
try {
sessionStorage.removeItem(key)
} catch {
// noop
}
}
/**
* Clear all values from session storage. Will not throw an error if sessionStorage is not available.
*
* @public
*/
export function clearSessionStorage() {
try {
sessionStorage.clear()
} catch {
// noop
}
}

8
yarn.lock
View file

@ -7299,6 +7299,7 @@ __metadata:
eslint-plugin-import: "npm:^2.27.5"
eslint-plugin-local: "npm:^1.0.0"
eslint-plugin-no-only-tests: "npm:^3.1.0"
eslint-plugin-no-storage: "npm:^1.0.2"
eslint-plugin-react: "npm:^7.32.2"
eslint-plugin-react-hooks: "npm:^4.6.0"
fs-extra: "npm:^11.1.0"
@ -12902,6 +12903,13 @@ __metadata:
languageName: node
linkType: hard
"eslint-plugin-no-storage@npm:^1.0.2":
version: 1.0.2
resolution: "eslint-plugin-no-storage@npm:1.0.2"
checksum: 971323b852846a3eb1558ff68aa51e36ff6671cf99f261410768a3c4c2baebc1702decee3afbc16128d12d965ea00b574adf2ee35fc4b68b58d74810e6bcb37b
languageName: node
linkType: hard
"eslint-plugin-react-hooks@npm:^4.5.0, eslint-plugin-react-hooks@npm:^4.6.0":
version: 4.6.0
resolution: "eslint-plugin-react-hooks@npm:4.6.0"