From 39c3995c74380a5b9b473583594966c26c008777 Mon Sep 17 00:00:00 2001 From: syuilo <Syuilotan@yahoo.co.jp> Date: Mon, 9 Jan 2023 16:45:05 +0900 Subject: [PATCH] refactor --- .../src/components/MkAutocomplete.vue | 4 +--- .../frontend/src/components/MkEmojiPicker.vue | 14 +++---------- packages/frontend/src/custom-emojis.ts | 21 +++++++++---------- packages/frontend/src/pages/about.emojis.vue | 7 +++---- .../src/pages/admin/emoji-edit-dialog.vue | 2 +- .../src/pages/admin/overview.stats.vue | 4 +--- .../frontend/src/pages/mfm-cheat-sheet.vue | 4 +--- 7 files changed, 20 insertions(+), 36 deletions(-) diff --git a/packages/frontend/src/components/MkAutocomplete.vue b/packages/frontend/src/components/MkAutocomplete.vue index 0d0c5edbae..b184e4489e 100644 --- a/packages/frontend/src/components/MkAutocomplete.vue +++ b/packages/frontend/src/components/MkAutocomplete.vue @@ -47,9 +47,7 @@ import { emojilist } from '@/scripts/emojilist'; import { instance } from '@/instance'; import { i18n } from '@/i18n'; import { miLocalStorage } from '@/local-storage'; -import { getCustomEmojis } from '@/custom-emojis'; - -const customEmojis = await getCustomEmojis(); +import { customEmojis } from '@/custom-emojis'; type EmojiDef = { emoji: string; diff --git a/packages/frontend/src/components/MkEmojiPicker.vue b/packages/frontend/src/components/MkEmojiPicker.vue index 18950b18d3..a34326822f 100644 --- a/packages/frontend/src/components/MkEmojiPicker.vue +++ b/packages/frontend/src/components/MkEmojiPicker.vue @@ -1,7 +1,7 @@ <template> <div class="omfetrab" :class="['s' + size, 'w' + width, 'h' + height, { asDrawer, asWindow }]" :style="{ maxHeight: maxHeight ? maxHeight + 'px' : undefined }"> <input ref="search" :value="q" class="search" data-prevent-emoji-insert :class="{ filled: q != null && q != '' }" :placeholder="i18n.ts.search" type="search" @input="input()" @paste.stop="paste" @keyup.enter="done()"> - <div v-if="customEmojis != null && customEmojiCategories != null" ref="emojisEl" class="emojis"> + <div ref="emojisEl" class="emojis"> <section class="result"> <div v-if="searchResultCustom.length > 0" class="body"> <button @@ -88,7 +88,7 @@ import { deviceKind } from '@/scripts/device-kind'; import { instance } from '@/instance'; import { i18n } from '@/i18n'; import { defaultStore } from '@/store'; -import { getCustomEmojiCategories, getCustomEmojis } from '@/custom-emojis'; +import { getCustomEmojiCategories, customEmojis } from '@/custom-emojis'; const props = withDefaults(defineProps<{ showPinned?: boolean; @@ -104,15 +104,7 @@ const emit = defineEmits<{ (ev: 'chosen', v: string): void; }>(); -let customEmojis = $ref(null); -getCustomEmojis().then((x) => { - customEmojis = x; -}); -let customEmojiCategories = $ref(null); -getCustomEmojiCategories().then((x) => { - customEmojiCategories = x; -}); - +const customEmojiCategories = getCustomEmojiCategories(); const search = shallowRef<HTMLInputElement>(); const emojisEl = shallowRef<HTMLDivElement>(); diff --git a/packages/frontend/src/custom-emojis.ts b/packages/frontend/src/custom-emojis.ts index 2a52753f84..19469999b6 100644 --- a/packages/frontend/src/custom-emojis.ts +++ b/packages/frontend/src/custom-emojis.ts @@ -2,25 +2,26 @@ import { api } from './os'; import { miLocalStorage } from './local-storage'; const storageCache = miLocalStorage.getItem('emojis'); -let cached = storageCache ? JSON.parse(storageCache) : null; -export async function getCustomEmojis() { +export let customEmojis = storageCache ? JSON.parse(storageCache) : []; + +fetchCustomEmojis(); + +export async function fetchCustomEmojis() { const now = Date.now(); const lastFetchedAt = miLocalStorage.getItem('lastEmojisFetchedAt'); - if (cached && lastFetchedAt && (now - parseInt(lastFetchedAt)) < 1000 * 60 * 60) return cached; + if (lastFetchedAt && (now - parseInt(lastFetchedAt)) < 1000 * 60 * 60) return; const res = await api('emojis', {}); - cached = res.emojis; - miLocalStorage.setItem('emojis', JSON.stringify(cached)); + customEmojis = res.emojis; + miLocalStorage.setItem('emojis', JSON.stringify(customEmojis)); miLocalStorage.setItem('lastEmojisFetchedAt', now.toString()); } let cachedCategories; -export async function getCustomEmojiCategories() { +export function getCustomEmojiCategories() { if (cachedCategories) return cachedCategories; - const customEmojis = await getCustomEmojis(); - const categories = new Set(); for (const emoji of customEmojis) { categories.add(emoji.category); @@ -31,11 +32,9 @@ export async function getCustomEmojiCategories() { } let cachedTags; -export async function getCustomEmojiTags() { +export function getCustomEmojiTags() { if (cachedTags) return cachedTags; - const customEmojis = await getCustomEmojis(); - const tags = new Set(); for (const emoji of customEmojis) { for (const tag of emoji.aliases) { diff --git a/packages/frontend/src/pages/about.emojis.vue b/packages/frontend/src/pages/about.emojis.vue index acf6237c87..2c56b111c6 100644 --- a/packages/frontend/src/pages/about.emojis.vue +++ b/packages/frontend/src/pages/about.emojis.vue @@ -37,11 +37,10 @@ import MkSelect from '@/components/MkSelect.vue'; import MkFoldableSection from '@/components/MkFoldableSection.vue'; import MkTab from '@/components/MkTab.vue'; import * as os from '@/os'; -import { getCustomEmojis, getCustomEmojiCategories, getCustomEmojiTags } from '@/custom-emojis'; +import { customEmojis, getCustomEmojiCategories, getCustomEmojiTags } from '@/custom-emojis'; -const customEmojis = await getCustomEmojis(); -const customEmojiCategories = await getCustomEmojiCategories(); -const customEmojiTags = await getCustomEmojiTags(); +const customEmojiCategories = getCustomEmojiCategories(); +const customEmojiTags = getCustomEmojiTags(); let q = $ref(''); let searchEmojis = $ref(null); let selectedTags = $ref(new Set()); diff --git a/packages/frontend/src/pages/admin/emoji-edit-dialog.vue b/packages/frontend/src/pages/admin/emoji-edit-dialog.vue index 0b6a5e1557..b2880b60b1 100644 --- a/packages/frontend/src/pages/admin/emoji-edit-dialog.vue +++ b/packages/frontend/src/pages/admin/emoji-edit-dialog.vue @@ -46,7 +46,7 @@ let dialog = $ref(null); let name: string = $ref(props.emoji.name); let category: string = $ref(props.emoji.category); let aliases: string = $ref(props.emoji.aliases.join(' ')); -const categories = await getCustomEmojiCategories(); +const categories = getCustomEmojiCategories(); const emit = defineEmits<{ (ev: 'done', v: { deleted?: boolean, updated?: any }): void, diff --git a/packages/frontend/src/pages/admin/overview.stats.vue b/packages/frontend/src/pages/admin/overview.stats.vue index 08f31676f3..ce68222fbb 100644 --- a/packages/frontend/src/pages/admin/overview.stats.vue +++ b/packages/frontend/src/pages/admin/overview.stats.vue @@ -63,9 +63,7 @@ import number from '@/filters/number'; import MkNumberDiff from '@/components/MkNumberDiff.vue'; import MkNumber from '@/components/MkNumber.vue'; import { i18n } from '@/i18n'; -import { getCustomEmojis } from '@/custom-emojis'; - -const customEmojis = await getCustomEmojis(); +import { customEmojis } from '@/custom-emojis'; let stats: any = $ref(null); let usersComparedToThePrevDay = $ref<number>(); diff --git a/packages/frontend/src/pages/mfm-cheat-sheet.vue b/packages/frontend/src/pages/mfm-cheat-sheet.vue index f49b6959c8..4dde3f2666 100644 --- a/packages/frontend/src/pages/mfm-cheat-sheet.vue +++ b/packages/frontend/src/pages/mfm-cheat-sheet.vue @@ -317,9 +317,7 @@ import MkTextarea from '@/components/MkTextarea.vue'; import { definePageMetadata } from '@/scripts/page-metadata'; import { i18n } from '@/i18n'; import { instance } from '@/instance'; -import { getCustomEmojis } from '@/custom-emojis'; - -const customEmojis = await getCustomEmojis(); +import { customEmojis } from '@/custom-emojis'; let preview_mention = $ref('@example'); let preview_hashtag = $ref('#test');