diff --git a/package-lock.json b/package-lock.json index 7806219..45d62e6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,8 +12,8 @@ "@solidjs/meta": "^0.28.5", "@solidjs/router": "^0.8.2", "@tailwindcss/forms": "^0.5.3", + "@tanstack/query-async-storage-persister": "^4.29.19", "@tanstack/query-persist-client-core": "^4.29.19", - "@tanstack/query-sync-storage-persister": "^4.29.19", "@tanstack/solid-query": "^4.29.19", "@tanstack/solid-virtual": "^3.0.0-beta.6", "@textcomplete/core": "^0.1.12", @@ -24,6 +24,7 @@ "heroicons": "^2.0.18", "i18next": "^23.2.6", "i18next-browser-languagedetector": "^7.1.0", + "idb-keyval": "^6.2.1", "lodash": "^4.17.21", "nostr-tools": "^1.12.1", "solid-js": "^1.7.7", @@ -1247,6 +1248,18 @@ "tailwindcss": ">=3.0.0 || >= 3.0.0-alpha.1" } }, + "node_modules/@tanstack/query-async-storage-persister": { + "version": "4.29.19", + "resolved": "https://registry.npmjs.org/@tanstack/query-async-storage-persister/-/query-async-storage-persister-4.29.19.tgz", + "integrity": "sha512-9Kv0+gQoZp8wLf0uA+edhUZQb7ahd6lLmwRQwbca1uYVYmhVlu1IPdkhWlaIy6aGep8ogiApf3N2baOxYVwIJQ==", + "dependencies": { + "@tanstack/query-persist-client-core": "4.29.19" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + } + }, "node_modules/@tanstack/query-core": { "version": "4.29.19", "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.29.19.tgz", @@ -1268,18 +1281,6 @@ "url": "https://github.com/sponsors/tannerlinsley" } }, - "node_modules/@tanstack/query-sync-storage-persister": { - "version": "4.29.19", - "resolved": "https://registry.npmjs.org/@tanstack/query-sync-storage-persister/-/query-sync-storage-persister-4.29.19.tgz", - "integrity": "sha512-B3wDl3D3YBFTlY2yeXecEh4NEG/8Hr8pqsxnWJijRwBqvOKlqD4bUgk5kl5nbn1mShD2vnQ+yvH900/11X29Zw==", - "dependencies": { - "@tanstack/query-persist-client-core": "4.29.19" - }, - "funding": { - "type": "github", - "url": "https://github.com/sponsors/tannerlinsley" - } - }, "node_modules/@tanstack/solid-query": { "version": "4.29.19", "resolved": "https://registry.npmjs.org/@tanstack/solid-query/-/solid-query-4.29.19.tgz", @@ -4081,6 +4082,11 @@ "@babel/runtime": "^7.19.4" } }, + "node_modules/idb-keyval": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/idb-keyval/-/idb-keyval-6.2.1.tgz", + "integrity": "sha512-8Sb3veuYCyrZL+VBt9LJfZjLUPWVvqn8tG28VqYNFCo43KHcKuq+b4EiXGeuaLAQWL2YmyDgMp2aSpH9JHsEQg==" + }, "node_modules/ignore": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz", @@ -8234,6 +8240,14 @@ "mini-svg-data-uri": "^1.2.3" } }, + "@tanstack/query-async-storage-persister": { + "version": "4.29.19", + "resolved": "https://registry.npmjs.org/@tanstack/query-async-storage-persister/-/query-async-storage-persister-4.29.19.tgz", + "integrity": "sha512-9Kv0+gQoZp8wLf0uA+edhUZQb7ahd6lLmwRQwbca1uYVYmhVlu1IPdkhWlaIy6aGep8ogiApf3N2baOxYVwIJQ==", + "requires": { + "@tanstack/query-persist-client-core": "4.29.19" + } + }, "@tanstack/query-core": { "version": "4.29.19", "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.29.19.tgz", @@ -8247,14 +8261,6 @@ "@tanstack/query-core": "4.29.19" } }, - "@tanstack/query-sync-storage-persister": { - "version": "4.29.19", - "resolved": "https://registry.npmjs.org/@tanstack/query-sync-storage-persister/-/query-sync-storage-persister-4.29.19.tgz", - "integrity": "sha512-B3wDl3D3YBFTlY2yeXecEh4NEG/8Hr8pqsxnWJijRwBqvOKlqD4bUgk5kl5nbn1mShD2vnQ+yvH900/11X29Zw==", - "requires": { - "@tanstack/query-persist-client-core": "4.29.19" - } - }, "@tanstack/solid-query": { "version": "4.29.19", "resolved": "https://registry.npmjs.org/@tanstack/solid-query/-/solid-query-4.29.19.tgz", @@ -10277,6 +10283,11 @@ "@babel/runtime": "^7.19.4" } }, + "idb-keyval": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/idb-keyval/-/idb-keyval-6.2.1.tgz", + "integrity": "sha512-8Sb3veuYCyrZL+VBt9LJfZjLUPWVvqn8tG28VqYNFCo43KHcKuq+b4EiXGeuaLAQWL2YmyDgMp2aSpH9JHsEQg==" + }, "ignore": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz", diff --git a/package.json b/package.json index 95c7ef8..422110f 100644 --- a/package.json +++ b/package.json @@ -49,8 +49,8 @@ "@solidjs/meta": "^0.28.5", "@solidjs/router": "^0.8.2", "@tailwindcss/forms": "^0.5.3", + "@tanstack/query-async-storage-persister": "^4.29.19", "@tanstack/query-persist-client-core": "^4.29.19", - "@tanstack/query-sync-storage-persister": "^4.29.19", "@tanstack/solid-query": "^4.29.19", "@tanstack/solid-virtual": "^3.0.0-beta.6", "@textcomplete/core": "^0.1.12", @@ -61,6 +61,7 @@ "heroicons": "^2.0.18", "i18next": "^23.2.6", "i18next-browser-languagedetector": "^7.1.0", + "idb-keyval": "^6.2.1", "lodash": "^4.17.21", "nostr-tools": "^1.12.1", "solid-js": "^1.7.7", diff --git a/src/App.tsx b/src/App.tsx index 47ce437..cb97aa1 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,9 +1,10 @@ import { createEffect, onCleanup, lazy, type Component } from 'solid-js'; import { Routes, Route } from '@solidjs/router'; +import { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister'; import { persistQueryClient } from '@tanstack/query-persist-client-core'; -import { createSyncStoragePersister } from '@tanstack/query-sync-storage-persister'; import { QueryClient, QueryClientProvider } from '@tanstack/solid-query'; +import { get as getItem, set as setItem, del as removeItem } from 'idb-keyval'; import i18nextInstance from '@/i18n/i18n'; import { I18NextProvider } from '@/i18n/useTranslation'; @@ -16,16 +17,32 @@ const queryClient = new QueryClient({}); const i18next = i18nextInstance(); -const localStoragePersister = createSyncStoragePersister({ - storage: window.localStorage, +const indexedDBPersister = createAsyncStoragePersister({ + storage: { + getItem(key: string) { + return getItem(key).then((e) => e ?? null); + }, + setItem(key: string, value: string) { + return setItem(key, value); + }, + removeItem(key: string) { + return removeItem(key); + }, + }, }); const App: Component = () => { createEffect(() => { const [unsubscribe] = persistQueryClient({ queryClient, - persister: localStoragePersister, + persister: indexedDBPersister, }); + + // TODO remove this in the future + if (window.localStorage != null) { + window.localStorage.removeItem('REACT_QUERY_OFFLINE_CACHE'); + } + onCleanup(() => unsubscribe()); });