ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Emoji Tooltip: Always support English keywords (#1197)

Browse Source
This commit is contained in:
Alexander Zinchuk 2021-06-21 16:39:55 +03:00
parent bab7640ac0
commit 839a6107ba
3 changed files with 26 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/middle/composer/Composer.tsx
View File

@ -121,6 +121,7 @@ type StateProps = {
contentToBeScheduled?: GlobalState['messages']['contentToBeScheduled']; contentToBeScheduled?: GlobalState['messages']['contentToBeScheduled'];
shouldSuggestStickers?: boolean; shouldSuggestStickers?: boolean;
language: LangCode; language: LangCode;
baseEmojiKeywords?: Record<string, string[]>;
emojiKeywords?: Record<string, string[]>; emojiKeywords?: Record<string, string[]>;
serverTimeOffset: number; serverTimeOffset: number;
} & Pick<GlobalState, 'connectionState'>; } & Pick<GlobalState, 'connectionState'>;
@ -180,6 +181,7 @@ const Composer: FC<OwnProps & StateProps & DispatchProps> = ({
contentToBeScheduled, contentToBeScheduled,
shouldSuggestStickers, shouldSuggestStickers,
language, language,
baseEmojiKeywords,
emojiKeywords, emojiKeywords,
serverTimeOffset, serverTimeOffset,
recentEmojis, recentEmojis,
@ -308,6 +310,7 @@ const Composer: FC<OwnProps & StateProps & DispatchProps> = ({
recentEmojis, recentEmojis,
undefined, undefined,
setHtml, setHtml,
baseEmojiKeywords,
emojiKeywords, emojiKeywords,
); );
@ -927,7 +930,8 @@ export default memo(withGlobal<OwnProps>(
const messageWithActualBotKeyboard = isChatWithBot && selectNewestMessageWithBotKeyboardButtons(global, chatId); const messageWithActualBotKeyboard = isChatWithBot && selectNewestMessageWithBotKeyboardButtons(global, chatId);
const scheduledIds = selectScheduledIds(global, chatId); const scheduledIds = selectScheduledIds(global, chatId);
const { language } = global.settings.byKey; const { language } = global.settings.byKey;
const emojiKeywords = selectEmojiKeywords(global, language); const baseEmojiKeywords = selectEmojiKeywords(global, 'en');
const emojiKeywords = language !== 'en' ? selectEmojiKeywords(global, language) : undefined;
return { return {
editingMessage: selectEditingMessage(global, chatId, threadId, messageListType), editingMessage: selectEditingMessage(global, chatId, threadId, messageListType),
@ -963,6 +967,7 @@ export default memo(withGlobal<OwnProps>(
shouldSuggestStickers: global.settings.byKey.shouldSuggestStickers, shouldSuggestStickers: global.settings.byKey.shouldSuggestStickers,
recentEmojis: global.recentEmojis, recentEmojis: global.recentEmojis,
language, language,
baseEmojiKeywords: baseEmojiKeywords ? baseEmojiKeywords.keywords : undefined,
emojiKeywords: emojiKeywords ? emojiKeywords.keywords : undefined, emojiKeywords: emojiKeywords ? emojiKeywords.keywords : undefined,
serverTimeOffset: global.serverTimeOffset, serverTimeOffset: global.serverTimeOffset,
}; };

5
src/components/middle/composer/EmojiTooltip.tsx
View File

@ -79,7 +79,10 @@ const EmojiTooltip: FC<OwnProps> = ({
const [selectedIndex, setSelectedIndex] = useState(NO_EMOJI_SELECTED_INDEX); const [selectedIndex, setSelectedIndex] = useState(NO_EMOJI_SELECTED_INDEX);
useEffect(() => { useEffect(() => {
loadEmojiKeywords({ language }); loadEmojiKeywords({ language: 'en' });
if (language !== 'en') {
loadEmojiKeywords({ language });
}
}, [loadEmojiKeywords, language]); }, [loadEmojiKeywords, language]);
useEffect(() => { useEffect(() => {

25
src/components/middle/composer/hooks/useEmojiTooltip.ts
View File

@ -34,6 +34,7 @@ export default function useEmojiTooltip(
recentEmojiIds: string[], recentEmojiIds: string[],
inputId = EDITABLE_INPUT_ID, inputId = EDITABLE_INPUT_ID,
onUpdateHtml: (html: string) => void, onUpdateHtml: (html: string) => void,
baseEmojiKeywords?: Record<string, string[]>,
emojiKeywords?: Record<string, string[]>, emojiKeywords?: Record<string, string[]>,
) { ) {
const [isOpen, markIsOpen, unmarkIsOpen] = useFlag(); const [isOpen, markIsOpen, unmarkIsOpen] = useFlag();
@ -78,14 +79,20 @@ export default function useEmojiTooltip(
const emojis = Object.values(byId); const emojis = Object.values(byId);
if (emojiKeywords) { const byNative = buildCollectionByKey(emojis, 'native');
const byNative = buildCollectionByKey(emojis, 'native'); const baseEmojisByKeyword = baseEmojiKeywords
const emojisByKeyword = mapValues(emojiKeywords, (natives) => { ? mapValues(baseEmojiKeywords, (natives) => {
return Object.values(pickTruthy(byNative, natives)); return Object.values(pickTruthy(byNative, natives));
}); })
setByKeyword(emojisByKeyword); : {};
setKeywords(Object.keys(emojisByKeyword)); const emojisByKeyword = emojiKeywords
} ? mapValues(emojiKeywords, (natives) => {
return Object.values(pickTruthy(byNative, natives));
})
: {};
setByKeyword({ ...baseEmojisByKeyword, ...emojisByKeyword });
setKeywords([...Object.keys(baseEmojisByKeyword), ...Object.keys(emojisByKeyword)]);
const emojisByName = emojis.reduce((result, emoji) => { const emojisByName = emojis.reduce((result, emoji) => {
emoji.names.forEach((name) => { emoji.names.forEach((name) => {
@ -100,10 +107,10 @@ export default function useEmojiTooltip(
}, {} as Record<string, Emoji[]>); }, {} as Record<string, Emoji[]>);
setByName(emojisByName); setByName(emojisByName);
setNames(Object.keys(emojisByName)); setNames(Object.keys(emojisByName));
}, [byId, emojiKeywords]); }, [baseEmojiKeywords, byId, emojiKeywords]);
useEffect(() => { useEffect(() => {
if (!isAllowed || !html || !byId) { if (!isAllowed || !html || !byId || !keywords || !keywords.length) {
unmarkIsOpen(); unmarkIsOpen();
return; return;
} }