From f11c074adec983b6bc12ea7e81f5da44accc9c8d Mon Sep 17 00:00:00 2001 From: Jeroen Claassens Date: Sat, 20 Apr 2024 15:11:22 +0200 Subject: [PATCH] fix: fixed custom emojis mapping support for Nuxt 3 --- .../discord-custom-emoji/DiscordCustomEmoji.ts | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/packages/core/src/components/discord-custom-emoji/DiscordCustomEmoji.ts b/packages/core/src/components/discord-custom-emoji/DiscordCustomEmoji.ts index 4890e2356..669fe8812 100644 --- a/packages/core/src/components/discord-custom-emoji/DiscordCustomEmoji.ts +++ b/packages/core/src/components/discord-custom-emoji/DiscordCustomEmoji.ts @@ -1,6 +1,7 @@ import { css, html, LitElement } from 'lit'; import { customElement, property } from 'lit/decorators.js'; import { getGlobalEmojiUrl } from '../../util.js'; +import type { Emoji } from '../../types.js'; @customElement('discord-custom-emoji') export class DiscordCustomEmoji extends LitElement { @@ -40,6 +41,19 @@ export class DiscordCustomEmoji extends LitElement { @property() public accessor url: string; + /** + * A map of emoji names and their data {@link DiscordCustomEmoji.name name}. + * + * This should be keyed as `{ key: { emojiData } }` wherein `key` + * should occur in the {@link DiscordCustomEmoji.name name}. + * + * By default this component will use the global emojis from + * {@link getGlobalEmojiUrl}, however on SSR frameworks like Nuxt 3 global config doesn't + * work so we provide this as an alternative method. + */ + @property({ attribute: false }) + public accessor customEmojisMap: { [key: string]: Emoji } = {}; + /** * Determines whether or not the emoji is used in an embed, or a message. * If it is used in an embed, the sizing is adjusted accordingly. @@ -49,7 +63,7 @@ export class DiscordCustomEmoji extends LitElement { public override willUpdate() { if (!this.url && Boolean(this.name)) { - const emojiFromGlobal = getGlobalEmojiUrl(this.name); + const emojiFromGlobal = getGlobalEmojiUrl(this.name) ?? this.customEmojisMap[this.name]; if (emojiFromGlobal) { this.url ??= emojiFromGlobal.url ?? '';