rebased/app/soapbox/components/ui/emoji/emoji.tsx
marcin mikołajczak 8b81838f2f Support custom emoji reacts
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
2023-03-18 00:07:18 +01:00

30 lines
727 B
TypeScript

import React from 'react';
import { removeVS16s, toCodePoints } from 'soapbox/utils/emoji';
import { joinPublicPath } from 'soapbox/utils/static';
interface IEmoji extends React.ImgHTMLAttributes<HTMLImageElement> {
/** Unicode emoji character. */
emoji: string
}
/** A single emoji image. */
const Emoji: React.FC<IEmoji> = (props): JSX.Element | null => {
const { emoji, alt, src, ...rest } = props;
const codepoints = toCodePoints(removeVS16s(emoji));
const filename = codepoints.join('-');
if (!filename) return null;
return (
<img
draggable='false'
alt={alt || emoji}
src={src || joinPublicPath(`packs/emoji/${filename}.svg`)}
{...rest}
/>
);
};
export default Emoji;