diff --git a/packages/app/package.json b/packages/app/package.json index 9ed65fdfd..4bc5efe4b 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -10,7 +10,7 @@ "@noble/hashes": "^1.2.0", "@protobufjs/base64": "^1.1.2", "@reduxjs/toolkit": "^1.9.1", - "@scure/bip32": "^1.1.5", + "@scure/bip32": "^1.3.0", "@scure/bip39": "^1.1.1", "@snort/nostr": "^1.0.0", "@szhsin/react-menu": "^3.3.1", diff --git a/packages/app/src/Element/Textarea.tsx b/packages/app/src/Element/Textarea.tsx index edd8d7e5e..fff173bb6 100644 --- a/packages/app/src/Element/Textarea.tsx +++ b/packages/app/src/Element/Textarea.tsx @@ -3,7 +3,6 @@ import "./Textarea.css"; import { useIntl } from "react-intl"; import ReactTextareaAutocomplete from "@webscopeio/react-textarea-autocomplete"; -import emoji from "@jukben/emoji-search"; import TextareaAutosize from "react-textarea-autosize"; import { NostrPrefix } from "@snort/nostr"; @@ -61,8 +60,10 @@ const Textarea = (props: TextareaProps) => { return await UserCache.search(token); }; - const emojiDataProvider = (token: string) => { - return emoji(token) + const emojiDataProvider = async (token: string) => { + const emoji = await import("@jukben/emoji-search"); + return emoji + .default(token) .slice(0, 5) .map(({ name, char }) => ({ name, char })); }; diff --git a/packages/app/src/IntlProvider.tsx b/packages/app/src/IntlProvider.tsx index a3889c570..52edda61c 100644 --- a/packages/app/src/IntlProvider.tsx +++ b/packages/app/src/IntlProvider.tsx @@ -1,22 +1,7 @@ -import { type ReactNode } from "react"; +import { useEffect, useState, type ReactNode } from "react"; import { IntlProvider as ReactIntlProvider } from "react-intl"; import enMessages from "translations/en.json"; -import esMessages from "translations/es_ES.json"; -import zhMessages from "translations/zh_CN.json"; -import twMessages from "translations/zh_TW.json"; -import jaMessages from "translations/ja_JP.json"; -import frMessages from "translations/fr_FR.json"; -import huMessages from "translations/hu_HU.json"; -import idMessages from "translations/id_ID.json"; -import arMessages from "translations/ar_SA.json"; -import itMessages from "translations/it_IT.json"; -import deMessages from "translations/de_DE.json"; -import ruMessages from "translations/ru_RU.json"; -import svMessages from "translations/sv_SE.json"; -import hrMessages from "translations/hr_HR.json"; -import taINMessages from "translations/ta_IN.json"; - import useLogin from "Hooks/useLogin"; const DefaultLocale = "en-US"; @@ -24,65 +9,76 @@ const DefaultLocale = "en-US"; const getMessages = (locale: string) => { const truncatedLocale = locale.toLowerCase().split(/[_-]+/)[0]; - const matchLang = (lng: string) => { + const matchLang = async (lng: string) => { switch (lng) { case "es-ES": case "es": - return esMessages; + return (await import("translations/es_ES.json")).default; case "zh-CN": case "zh-Hans-CN": case "zh": - return zhMessages; + return (await import("translations/zh_CN.json")).default; case "zh-TW": - return twMessages; + return (await import("translations/zh_TW.json")).default; case "ja-JP": case "ja": - return jaMessages; + return (await import("translations/ja_JP.json")).default; case "fr-FR": case "fr": - return frMessages; + return (await import("translations/fr_FR.json")).default; case "hu-HU": case "hu": - return huMessages; + return (await import("translations/hu_HU.json")).default; case "id-ID": case "id": - return idMessages; + return (await import("translations/id_ID.json")).default; case "ar-SA": case "ar": - return arMessages; + return (await import("translations/ar_SA.json")).default; case "it-IT": case "it": - return itMessages; + return (await import("translations/it_IT.json")).default; case "de-DE": case "de": - return deMessages; + return (await import("translations/de_DE.json")).default; case "ru-RU": case "ru": - return ruMessages; + return (await import("translations/ru_RU.json")).default; case "sv-SE": case "sv": - return svMessages; + return (await import("translations/sv_SE.json")).default; case "hr-HR": case "hr": - return hrMessages; + return (await import("translations/hr_HR.json")).default; case "ta-IN": case "ta": - return taINMessages; + return (await import("translations/ta_IN.json")).default; case DefaultLocale: case "en": return enMessages; } }; - return matchLang(locale) ?? matchLang(truncatedLocale) ?? enMessages; + return matchLang(locale) ?? matchLang(truncatedLocale) ?? Promise.resolve(enMessages); }; export const IntlProvider = ({ children }: { children: ReactNode }) => { const { language } = useLogin().preferences; const locale = language ?? getLocale(); + const [messages, setMessages] = useState>(enMessages); + + useEffect(() => { + getMessages(locale) + .then(x => { + if (x) { + setMessages(x); + } + }) + .catch(console.error); + }, [language]); return ( - + {children} ); diff --git a/packages/app/src/Pages/settings/Preferences.tsx b/packages/app/src/Pages/settings/Preferences.tsx index 478770230..9c255de05 100644 --- a/packages/app/src/Pages/settings/Preferences.tsx +++ b/packages/app/src/Pages/settings/Preferences.tsx @@ -1,8 +1,7 @@ import "./Preferences.css"; import { FormattedMessage, useIntl } from "react-intl"; -import emoji from "@jukben/emoji-search"; - +import { useEffect, useState } from "react"; import useLogin from "Hooks/useLogin"; import { DefaultPreferences, updatePreferences, UserPreferences } from "Login"; import { DefaultImgProxy } from "Const"; @@ -32,6 +31,14 @@ const PreferencesPage = () => { const { formatMessage } = useIntl(); const login = useLogin(); const perf = login.preferences; + const [emoji, setEmoji] = useState>([]); + + useEffect(() => { + (async () => { + const emoji = await import("@jukben/emoji-search"); + setEmoji(emoji.default("").map(a => ({ name: a.name, char: a.char }))); + })(); + }, []); return (
@@ -319,7 +326,7 @@ const PreferencesPage = () => { - {emoji("").map(({ name, char }) => { + {emoji.map(({ name, char }) => { return (