tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Glitch] Performance regression fixes

Browse Source 
Port 570c9d16be2f2e0e95da6723aa5281f600424fba to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Echo 2025-08-04 19:16:12 +02:00 committed by Claire
parent b8f66e1d33
commit 3fc07508ee
2 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
app/javascript/flavours/glitch/features/emoji/emoji_html.tsx
View File

@ -1,5 +1,7 @@
import type { ComponentPropsWithoutRef, ElementType } from 'react'; import type { ComponentPropsWithoutRef, ElementType } from 'react';
import { isModernEmojiEnabled } from '@/flavours/glitch/utils/environment';
import { useEmojify } from './hooks'; import { useEmojify } from './hooks';
import type { CustomEmojiMapArg } from './types'; import type { CustomEmojiMapArg } from './types';
@ -12,7 +14,7 @@ type EmojiHTMLProps<Element extends ElementType = 'div'> = Omit<
as?: Element; as?: Element;
}; };
export const EmojiHTML = <Element extends ElementType>({ export const ModernEmojiHTML = <Element extends ElementType>({
extraEmojis, extraEmojis,
htmlString, htmlString,
as: asElement, // Rename for syntax highlighting as: asElement, // Rename for syntax highlighting
@ -29,3 +31,18 @@ export const EmojiHTML = <Element extends ElementType>({
<Wrapper {...props} dangerouslySetInnerHTML={{ __html: emojifiedHtml }} /> <Wrapper {...props} dangerouslySetInnerHTML={{ __html: emojifiedHtml }} />
); );
}; };
export const EmojiHTML = <Element extends ElementType>(
props: EmojiHTMLProps<Element>,
) => {
if (isModernEmojiEnabled()) {
return <ModernEmojiHTML {...props} />;
}
const Wrapper = props.as ?? 'div';
return (
<Wrapper
{...props}
dangerouslySetInnerHTML={{ __html: props.htmlString }}
/>
);
};

2
app/javascript/flavours/glitch/features/emoji/hooks.ts
View File

@ -8,7 +8,6 @@ import { isModernEmojiEnabled } from '@/flavours/glitch/utils/environment';
import { toSupportedLocale } from './locale'; import { toSupportedLocale } from './locale';
import { determineEmojiMode } from './mode'; import { determineEmojiMode } from './mode';
import { emojifyElement } from './render';
import type { import type {
CustomEmojiMapArg, CustomEmojiMapArg,
EmojiAppState, EmojiAppState,
@ -39,6 +38,7 @@ export function useEmojify(text: string, extraEmojis?: CustomEmojiMapArg) {
async (input: string) => { async (input: string) => {
const wrapper = document.createElement('div'); const wrapper = document.createElement('div');
wrapper.innerHTML = input; wrapper.innerHTML = input;
const { emojifyElement } = await import('./render');
const result = await emojifyElement(wrapper, appState, extra); const result = await emojifyElement(wrapper, appState, extra);
if (result) { if (result) {
setEmojifiedText(result.innerHTML); setEmojifiedText(result.innerHTML);