feat: improve custom emojis (#8855)

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/8855
Reviewed-by: Beowulf <beowulf@beocode.eu>
This commit is contained in:
Earl Warren 2025-08-24 16:16:46 +02:00
commit 0a8d7826a4
13 changed files with 123 additions and 30 deletions

View file

@ -1,5 +1,6 @@
import {matchEmoji, matchMention} from '../../utils/match.js';
import {emojiString} from '../emoji.js';
import {emojiHTML, emojiString} from '../emoji.js';
const {customEmojis} = window.config;
export function initTextExpander(expander) {
expander?.addEventListener('text-expander-change', ({detail: {key, provide, text}}) => {
@ -10,11 +11,16 @@ export function initTextExpander(expander) {
const ul = document.createElement('ul');
ul.classList.add('suggestions');
for (const name of matches) {
const emoji = emojiString(name);
const li = document.createElement('li');
li.setAttribute('role', 'option');
li.setAttribute('data-value', emoji);
li.textContent = `${emoji} ${name}`;
li.setAttribute('data-value', emojiString(name));
if (customEmojis.has(name)) {
li.style.gap = '0.25rem';
li.innerHTML = emojiHTML(name);
li.append(name);
} else {
li.textContent = `${emojiString(name)} ${name}`;
}
ul.append(li);
}

View file

@ -2,7 +2,7 @@ import emojis from '../../../assets/emoji.json';
const {assetUrlPrefix, customEmojis} = window.config;
const tempMap = {...customEmojis};
const tempMap = Object.assign(...Array.from(customEmojis, (v) => ({[v]: `:${v}:`})));
for (const {emoji, aliases} of emojis) {
for (const alias of aliases || []) {
tempMap[alias] = emoji;
@ -10,6 +10,7 @@ for (const {emoji, aliases} of emojis) {
}
export const emojiKeys = Object.keys(tempMap).sort((a, b) => {
if (b === '+1' && a === '-1') return 1;
if (a === '+1' || a === '-1') return -1;
if (b === '+1' || b === '-1') return 1;
return a.localeCompare(b);
@ -23,7 +24,7 @@ for (const key of emojiKeys) {
// retrieve HTML for given emoji name
export function emojiHTML(name) {
let inner;
if (Object.hasOwn(customEmojis, name)) {
if (customEmojis.has(name)) {
inner = `<img alt=":${name}:" src="${assetUrlPrefix}/img/emoji/${name}.png">`;
} else {
inner = emojiString(name);