Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
at main 75 lines 1.8 kB view raw
1import { STATIC_ASSETS_URL } from "@hey/data/constants"; 2import type { Emoji } from "@hey/types/misc"; 3import { useQuery } from "@tanstack/react-query"; 4import { useMemo } from "react"; 5 6const GET_EMOJIS_QUERY_KEY = "getEmojis"; 7const DEFAULT_MAX_EMOJI_COUNT = 5; 8 9interface UseEmojisOptions { 10 limit?: number; 11 query?: string; 12 minQueryLength?: number; 13} 14 15interface UseEmojisResult { 16 emojis: Emoji[]; 17 error: Error | null; 18 isLoading: boolean; 19 allEmojis: Emoji[] | undefined; 20} 21 22const useEmojis = ({ 23 limit = DEFAULT_MAX_EMOJI_COUNT, 24 query = "", 25 minQueryLength = 0 26}: UseEmojisOptions = {}): UseEmojisResult => { 27 const { 28 data: allEmojis, 29 error, 30 isLoading 31 } = useQuery<Emoji[]>({ 32 queryFn: async () => { 33 const response = await fetch(`${STATIC_ASSETS_URL}/emoji.json`); 34 if (!response.ok) { 35 throw new Error(`HTTP error! Status: ${response.status}`); 36 } 37 return response.json(); 38 }, 39 queryKey: [GET_EMOJIS_QUERY_KEY] 40 }); 41 42 const emojis = useMemo(() => { 43 if (!allEmojis) { 44 return []; 45 } 46 47 if (!query || query.length < minQueryLength) { 48 return allEmojis.slice(0, limit); 49 } 50 51 return allEmojis 52 .filter((emoji) => { 53 const lowercaseQuery = query.toLowerCase(); 54 return ( 55 emoji.aliases.some((alias) => 56 alias.toLowerCase().includes(lowercaseQuery) 57 ) || 58 emoji.tags.some((tag) => 59 tag.toLowerCase().includes(lowercaseQuery) 60 ) || 61 emoji.description.toLowerCase().includes(lowercaseQuery) 62 ); 63 }) 64 .slice(0, limit); 65 }, [query, allEmojis, limit, minQueryLength]); 66 67 return { 68 allEmojis, 69 emojis, 70 error: error as Error | null, 71 isLoading 72 }; 73}; 74 75export default useEmojis;