diff --git a/packages/frontend/src/custom-emojis.ts b/packages/frontend/src/custom-emojis.ts index 9ce370e7e..a89a420d7 100644 --- a/packages/frontend/src/custom-emojis.ts +++ b/packages/frontend/src/custom-emojis.ts @@ -3,9 +3,10 @@ import * as Misskey from 'misskey-js'; import { api, apiGet } from './os'; import { miLocalStorage } from './local-storage'; import { stream } from '@/stream'; +import { get, set } from '@/scripts/idb-proxy'; -const storageCache = miLocalStorage.getItem('emojis'); -export const customEmojis = shallowRef(storageCache ? JSON.parse(storageCache) : []); +const storageCache = await get('emojis'); +export const customEmojis = shallowRef(Array.isArray(storageCache) ? storageCache : []); export const customEmojiCategories = computed<[ ...string[], null ]>(() => { const categories = new Set(); for (const emoji of customEmojis.value) { @@ -18,31 +19,39 @@ export const customEmojiCategories = computed<[ ...string[], null ]>(() => { stream.on('emojiAdded', emojiData => { customEmojis.value = [emojiData.emoji, ...customEmojis.value]; + set('emojis', customEmojis.value); }); stream.on('emojiUpdated', emojiData => { customEmojis.value = customEmojis.value.map(item => emojiData.emojis.find(search => search.name === item.name) as Misskey.entities.CustomEmoji ?? item); + set('emojis', customEmojis.value); }); stream.on('emojiDeleted', emojiData => { customEmojis.value = customEmojis.value.filter(item => !emojiData.emojis.some(search => search.name === item.name)); + set('emojis', customEmojis.value); }); export async function fetchCustomEmojis(force = false) { const now = Date.now(); + const needsMigration = miLocalStorage.getItem('emojis') != null; let res; - if (force) { + if (force || needsMigration) { res = await api('emojis', {}); } else { - const lastFetchedAt = miLocalStorage.getItem('lastEmojisFetchedAt'); - if (lastFetchedAt && (now - parseInt(lastFetchedAt)) < 1000 * 60 * 60) return; + const lastFetchedAt = await get('lastEmojisFetchedAt'); + if (lastFetchedAt && (now - lastFetchedAt) < 1000 * 60 * 60) return; res = await apiGet('emojis', {}); } customEmojis.value = res.emojis; - miLocalStorage.setItem('emojis', JSON.stringify(res.emojis)); - miLocalStorage.setItem('lastEmojisFetchedAt', now.toString()); + set('emojis', res.emojis); + set('lastEmojisFetchedAt', now); + if (needsMigration) { + miLocalStorage.removeItem('emojis'); + miLocalStorage.removeItem('lastEmojisFetchedAt'); + } } let cachedTags; diff --git a/packages/frontend/src/local-storage.ts b/packages/frontend/src/local-storage.ts index e6b828696..38462c8a6 100644 --- a/packages/frontend/src/local-storage.ts +++ b/packages/frontend/src/local-storage.ts @@ -2,8 +2,6 @@ type Keys = 'v' | 'lastVersion' | 'instance' | - 'emojis' | // TODO: indexed db - 'lastEmojisFetchedAt' | 'account' | 'accounts' | 'latestDonationInfoShownAt' | @@ -28,7 +26,9 @@ type Keys = `miux:${string}` | `ui:folder:${string}` | `themes:${string}` | - `aiscript:${string}`; + `aiscript:${string}` | + 'lastEmojisFetchedAt' | // DEPRECATED, stored in indexeddb (13.9.0~) + 'emojis' // DEPRECATED, stored in indexeddb (13.9.0~); export const miLocalStorage = { getItem: (key: Keys) => window.localStorage.getItem(key),