diff --git a/public/sw.js b/public/sw.js index b44db070..44af1ed5 100644 --- a/public/sw.js +++ b/public/sw.js @@ -29,7 +29,7 @@ registerRoute(imageRoute); // Cache /instance because masto.js has to keep calling it while initializing const apiExtendedRoute = new RegExpRoute( - /^https?:\/\/[^\/]+\/api\/v\d+\/instance/, + /^https?:\/\/[^\/]+\/api\/v\d+\/(instance|custom_emojis)/, new StaleWhileRevalidate({ cacheName: 'api-extended', plugins: [ diff --git a/src/components/compose.jsx b/src/components/compose.jsx index 120b79e5..b14ba6ae 100644 --- a/src/components/compose.jsx +++ b/src/components/compose.jsx @@ -36,6 +36,10 @@ const expiresInFromExpiresAt = (expiresAt) => { return expirySeconds.find((s) => s >= delta) || oneDay; }; +const menu = document.createElement('ul'); +menu.role = 'listbox'; +menu.className = 'text-expander-menu'; + function Compose({ onClose, replyToStatus, @@ -82,6 +86,15 @@ function Compose({ const [mediaAttachments, setMediaAttachments] = useState([]); const [poll, setPoll] = useState(null); + const customEmojis = useRef(); + useEffect(() => { + (async () => { + const emojis = await masto.customEmojis.fetchAll(); + console.log({ emojis }); + customEmojis.current = emojis; + })(); + }, []); + useEffect(() => { if (replyToStatus) { const { spoilerText, visibility, sensitive } = replyToStatus; @@ -167,6 +180,7 @@ function Compose({ // console.log('text-expander-change', e); const { key, provide, text } = e.detail; textExpanderTextRef.current = text; + if (text === '') { provide( Promise.resolve({ @@ -175,6 +189,34 @@ function Compose({ ); return; } + + if (key === ':') { + // const emojis = customEmojis.current.filter((emoji) => + // emoji.shortcode.startsWith(text), + // ); + const emojis = filterShortcodes(customEmojis.current, text); + let html = ''; + emojis.forEach((emoji) => { + const { shortcode, url } = emoji; + html += ` +