mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-01-18 11:46:00 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Emoji ordering in emoji board (#2057)
Some checks failed
Deploy to Netlify (dev) / Deploy to Netlify (push) Has been cancelled
Details

Browse source 
* feat: sort emojis inside emoji picker

* feat: sort autocomplete emojis

Fixes #1632

* fix: sort function after concat

* fix: sort result instead of searchList
This commit is contained in:
Marek Vospel 2024-12-22 11:41:02 +01:00 • committed by GitHub
parent 35f0e400ad
commit b8d9c4bdd6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/app/components/editor/autocomplete/EmoticonAutocomplete.tsx
View file

@ -57,14 +57,16 @@ export function EmoticonAutocomplete({
const searchList = useMemo(() => { const searchList = useMemo(() => {
const list: Array<EmoticonSearchItem> = []; const list: Array<EmoticonSearchItem> = [];
return list.concat( return list
imagePacks.flatMap((pack) => pack.getImagesFor(PackUsage.Emoticon)), .concat(
emojis imagePacks.flatMap((pack) => pack.getImagesFor(PackUsage.Emoticon)),
); emojis
)
}, [imagePacks]); }, [imagePacks]);
const [result, search, resetSearch] = useAsyncSearch(searchList, getEmoticonStr, SEARCH_OPTIONS); const [result, search, resetSearch] = useAsyncSearch(searchList, getEmoticonStr, SEARCH_OPTIONS);
const autoCompleteEmoticon = result ? result.items : recentEmoji; const autoCompleteEmoticon = (result ? result.items : recentEmoji)
.sort((a, b) => a.shortcode.localeCompare(b.shortcode));
useEffect(() => { useEffect(() => {
if (query.text) search(query.text); if (query.text) search(query.text);

6
src/app/components/emoji-board/EmojiBoard.tsx
View file

@ -468,7 +468,7 @@ export function SearchEmojiGroup({
return ( return (
<EmojiGroup key={id} id={id} label={label}> <EmojiGroup key={id} id={id} label={label}>
{tab === EmojiBoardTab.Emoji {tab === EmojiBoardTab.Emoji
? searchResult.map((emoji) => ? searchResult.sort((a, b) => a.shortcode.localeCompare(b.shortcode)).map((emoji) =>
'unicode' in emoji ? ( 'unicode' in emoji ? (
<EmojiItem <EmojiItem
key={emoji.unicode} key={emoji.unicode}
@ -523,7 +523,7 @@ export const CustomEmojiGroups = memo(
<> <>
{groups.map((pack) => ( {groups.map((pack) => (
<EmojiGroup key={pack.id} id={pack.id} label={pack.displayName || 'Unknown'}> <EmojiGroup key={pack.id} id={pack.id} label={pack.displayName || 'Unknown'}>
{pack.getEmojis().map((image) => ( {pack.getEmojis().sort((a, b) => a.shortcode.localeCompare(b.shortcode)).map((image) => (
<EmojiItem <EmojiItem
key={image.shortcode} key={image.shortcode}
label={image.body || image.shortcode} label={image.body || image.shortcode}
@ -566,7 +566,7 @@ export const StickerGroups = memo(({ mx, groups, useAuthentication }: { mx: Matr
)} )}
{groups.map((pack) => ( {groups.map((pack) => (
<EmojiGroup key={pack.id} id={pack.id} label={pack.displayName || 'Unknown'}> <EmojiGroup key={pack.id} id={pack.id} label={pack.displayName || 'Unknown'}>
{pack.getStickers().map((image) => ( {pack.getStickers().sort((a, b) => a.shortcode.localeCompare(b.shortcode)).map((image) => (
<StickerItem <StickerItem
key={image.shortcode} key={image.shortcode}
label={image.body || image.shortcode} label={image.body || image.shortcode}