discord-html-transcripts-fix 1.7.1 → 1.8.2

package/dist/generator/index.js

@@ -150,7 +150,13 @@ async function render(_a) {
             // Non-blocking inline JSON: type="application/json" so the parser doesn't pause
             (0, jsx_runtime_1.jsx)("script", { id: "dht-data", type: "application/json", dangerouslySetInnerHTML: { __html: (0, utils_1.safeJsonForScript)(globalData) } }),
             (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: 'try{globalThis.$discordMessage=JSON.parse(document.getElementById("dht-data").textContent);}catch(e){globalThis.$discordMessage={};}' } }),
-            !options.hydrate && (0, jsx_runtime_1.jsx)("script", { type: "module", src: `https://cdn.jsdelivr.net/npm/@skyra/discord-components-core@${discordComponentsVersion}/+esm`, crossOrigin: "anonymous" }),
+            // Always load the @skyra/discord-components-core ES module, even
+            // when `hydrate: true` is requested. Lit SSR does not reliably
+            // expand every <discord-*> custom element to plain HTML, and the
+            // browser-side definitions are also needed to hydrate the SSR'd
+            // markup (re-render with state, click handlers, etc.). Without
+            // this tag the page is just static unstyled custom elements.
+            (0, jsx_runtime_1.jsx)("script", { type: "module", src: `https://cdn.jsdelivr.net/npm/@skyra/discord-components-core@${discordComponentsVersion}/+esm`, crossOrigin: "anonymous" }),
         ] }),
         (0, jsx_runtime_1.jsxs)("body", { style: { margin: 0, minHeight: '100vh' }, children: [
             (0, jsx_runtime_1.jsx)(transcript_1.default, Object.assign({ messages, channel, callbacks }, options, renderContext)),

package/dist/generator/renderers/message.js

@@ -138,9 +138,17 @@ async function DiscordMessage({ message, context }) {
         // no longer render a separate "/cmd opt:val by user" line.
         const slashData = buildSlashCommandData(message);
 
+        // FIX: pass timestamp as ISO string. React would otherwise stringify a
+        // Date via toString() (locale-dependent like "Tue May 26 2026 …"),
+        // which skyra's <discord-message> often fails to parse — falling back
+        // to new Date() == transcript creation time. ISO is round-trip safe.
+        const createdAtIso = message.createdAt instanceof Date
+            ? message.createdAt.toISOString()
+            : (typeof message.createdAt === 'string' ? message.createdAt : undefined);
+
         return ((0, jsx_runtime_1.jsxs)("discord-message", {
             id: `m-${message.id}`,
-            timestamp: message.createdAt,
+            timestamp: createdAtIso,
             edited: message.editedAt !== null,
             server: (isCrossGuildReply || isCrosspost || isCrossposted) ? true : undefined,
             highlight: message.mentions.everyone || pinned,

package/dist/generator/renderers/systemMessage.js

@@ -18,11 +18,16 @@ async function SystemMessage({ message, context }) {
     const color = message.member?.roles?.color?.hexColor;
     const authorId = author?.id;
     const ctx = context || {};
+    // FIX: pass message.createdAt as ISO string so skyra renders the original
+    // timestamp instead of falling back to "now" (= transcript creation time).
+    const ts = message.createdAt instanceof Date
+        ? message.createdAt.toISOString()
+        : (typeof message.createdAt === 'string' ? message.createdAt : undefined);
 
     switch (message.type) {
         case discord_js_1.MessageType.RecipientAdd:
         case discord_js_1.MessageType.UserJoin:
-            return ((0, jsx_runtime_1.jsx)("discord-system-message", { id: `m-${message.id}`, type: "join", children: (0, jsx_runtime_1.jsx)(JoinMessage, { member: message.member, fallbackUser: author, seed: message.id, context: ctx }) }, message.id));
+            return ((0, jsx_runtime_1.jsx)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "join", children: (0, jsx_runtime_1.jsx)(JoinMessage, { member: message.member, fallbackUser: author, seed: message.id, context: ctx }) }, message.id));
 
         case discord_js_1.MessageType.ChannelPinnedMessage: {
             const refId = message.reference?.messageId;
@@ -36,7 +41,7 @@ async function SystemMessage({ message, context }) {
                 ? (0, jsx_runtime_1.jsx)("i", { "data-goto": refId, className: "dht-jump", role: "button", tabIndex: 0, children: linkLabel })
                 : (0, jsx_runtime_1.jsx)("strong", { children: linkLabel });
             const parts = template.includes('{message}') ? template.split('{message}') : null;
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "pin", children: parts
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "pin", children: parts
                 ? [
                     (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                     ' ',
@@ -57,7 +62,7 @@ async function SystemMessage({ message, context }) {
         case discord_js_1.MessageType.GuildBoostTier1:
         case discord_js_1.MessageType.GuildBoostTier2:
         case discord_js_1.MessageType.GuildBoostTier3:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "boost", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "boost", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "boosted", children: t(ctx, 'boosted', 'boosted the server!') }),
@@ -67,7 +72,7 @@ async function SystemMessage({ message, context }) {
         case discord_js_1.MessageType.ThreadCreated: {
             const refId = message.reference?.messageId;
             const label = message.content || 'New thread';
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "thread", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "thread", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "threadStarted", children: t(ctx, 'threadStarted', 'started a thread:') }),
@@ -79,7 +84,7 @@ async function SystemMessage({ message, context }) {
         }
 
         case discord_js_1.MessageType.ChannelNameChange:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "edit", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "edit", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "changedChannelName", children: t(ctx, 'changedChannelName', 'changed the channel name:') }),
@@ -88,7 +93,7 @@ async function SystemMessage({ message, context }) {
             ] }, message.id));
 
         case discord_js_1.MessageType.ChannelIconChange:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "edit", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "edit", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "changedChannelIcon", children: t(ctx, 'changedChannelIcon', 'changed the channel icon.') }),
@@ -97,7 +102,7 @@ async function SystemMessage({ message, context }) {
         case discord_js_1.MessageType.ChatInputCommand:
         case discord_js_1.MessageType.ContextMenuCommand: {
             const cmd = message.interaction?.commandName ? '/' + message.interaction.commandName : 'a command';
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "call", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "call", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "usedCommand", children: t(ctx, 'usedCommand', 'used') }),
@@ -107,7 +112,7 @@ async function SystemMessage({ message, context }) {
         }
 
         case discord_js_1.MessageType.Call:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "call", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "call", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "startedCall", children: t(ctx, 'startedCall', 'started a call.') }),
@@ -116,7 +121,7 @@ async function SystemMessage({ message, context }) {
         case discord_js_1.MessageType.ChannelFollowAdd: {
             const followText = t(ctx, 'addedFollow', 'added {target} to follow this channel.');
             const parts = followText.split('{target}');
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "edit", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "edit", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 parts[0],
@@ -126,7 +131,7 @@ async function SystemMessage({ message, context }) {
         }
 
         case discord_js_1.MessageType.RecipientRemove:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "leave", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "leave", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "left", children: t(ctx, 'left', 'left.') }),
@@ -141,7 +146,7 @@ async function SystemMessage({ message, context }) {
             const action = fields.find((f) => /action_type|action/i.test(f.name))?.value || '';
             const blocked = e?.description || '';
             const channelId = fields.find((f) => /channel/i.test(f.name))?.value;
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "boost", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "boost", children: [
                 (0, jsx_runtime_1.jsx)("span", { "data-i18n": "autoModBlocked", children: t(ctx, 'autoModBlocked', 'AutoMod blocked a message.') }),
                 ruleName && (0, jsx_runtime_1.jsxs)("span", { className: "dht-automod-rule", children: [' · Rule: ', (0, jsx_runtime_1.jsx)("strong", { children: ruleName })] }),
                 action && (0, jsx_runtime_1.jsxs)("span", { className: "dht-automod-rule", children: [' · Action: ', action] }),
@@ -151,34 +156,34 @@ async function SystemMessage({ message, context }) {
             ] }, message.id));
         }
         case discord_js_1.MessageType.StageStart:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "call", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "call", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' started a stage: ',
                 (0, jsx_runtime_1.jsx)("strong", { children: message.content || '' })
             ] }, message.id));
         case discord_js_1.MessageType.StageEnd:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "leave", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "leave", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ended the stage.'
             ] }, message.id));
         case discord_js_1.MessageType.StageSpeaker:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "call", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "call", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' is now a speaker.'
             ] }, message.id));
         case discord_js_1.MessageType.StageRaiseHand:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "call", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "call", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' requested to speak.'
             ] }, message.id));
         case discord_js_1.MessageType.StageTopic:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "edit", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "edit", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' changed the stage topic: ',
                 (0, jsx_runtime_1.jsx)("strong", { children: message.content || '' })
             ] }, message.id));
         case discord_js_1.MessageType.GuildApplicationPremiumSubscription:
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "boost", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "boost", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' subscribed ',
                 (0, jsx_runtime_1.jsx)("strong", { children: message.applicationId ? `app ${message.applicationId}` : 'an app' }),
@@ -187,7 +192,7 @@ async function SystemMessage({ message, context }) {
 
         case discord_js_1.MessageType.RoleSubscriptionPurchase: {
             const roleName = message.roleSubscriptionData?.tierName || message.content || 'a role';
-            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, type: "boost", children: [
+            return ((0, jsx_runtime_1.jsxs)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "boost", children: [
                 (0, jsx_runtime_1.jsx)(Highlight, { color, userId: authorId, children: authorName }),
                 ' ',
                 t(ctx, 'roleSubPurchased', 'subscribed to {role}!').replace('{role}', roleName),
@@ -198,10 +203,10 @@ async function SystemMessage({ message, context }) {
         case discord_js_1.MessageType.GuildIncidentReportFalseAlarm:
         case discord_js_1.MessageType.GuildIncidentAlertModeEnabled:
         case discord_js_1.MessageType.GuildIncidentAlertModeDisabled:
-            return ((0, jsx_runtime_1.jsx)("discord-system-message", { id: `m-${message.id}`, type: "boost", children: (0, jsx_runtime_1.jsx)("span", { "data-i18n": "serverAlert", children: t(ctx, 'serverAlert', 'Server safety alert.') }) }, message.id));
+            return ((0, jsx_runtime_1.jsx)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "boost", children: (0, jsx_runtime_1.jsx)("span", { "data-i18n": "serverAlert", children: t(ctx, 'serverAlert', 'Server safety alert.') }) }, message.id));
 
         case discord_js_1.MessageType.PollResult:
-            return ((0, jsx_runtime_1.jsx)("discord-system-message", { id: `m-${message.id}`, type: "edit", children: (0, jsx_runtime_1.jsx)("span", { "data-i18n": "pollEnded", children: t(ctx, 'pollEnded', 'A poll ended.') }) }, message.id));
+            return ((0, jsx_runtime_1.jsx)("discord-system-message", { id: `m-${message.id}`, timestamp: ts, type: "edit", children: (0, jsx_runtime_1.jsx)("span", { "data-i18n": "pollEnded", children: t(ctx, 'pollEnded', 'A poll ended.') }) }, message.id));
 
         // These render through the normal pipeline
         case discord_js_1.MessageType.Default:

package/dist/generator/transcript.js

@@ -52,21 +52,24 @@ async function DiscordMessages(_a) {
     ] }));
 }
 
-// Legacy "Exported X message(s). Powered by …" line. The new stats footer
-// (see renderStatsFooter in generator/index.js) already shows the message
-// count, so this line is suppressed by default and only renders when:
-//   - options.statsFooter === false (caller opted out of the new footer), or
-//   - options.footerText is explicitly set to a string, or
-//   - options.poweredBy === true (caller wants the credit link).
+// Legacy "Exported X message(s). Powered by …" footer line.
+//
+// The new stats footer (see renderStatsFooter in generator/index.js) already
+// shows the message count and more. To prevent two footers stacking on the
+// same transcript, the legacy footer is now mutually exclusive with the
+// stats footer: it ONLY renders when the caller has explicitly disabled the
+// stats footer via `statsFooter: false` (or `{ enabled: false }`). Setting
+// `footerText` or `poweredBy` alone is no longer enough — that used to
+// produce a duplicate footer because the stats footer kept rendering.
 function renderLegacyFooter(messages, options) {
     const statsDisabled = options.statsFooter === false ||
         (options.statsFooter && options.statsFooter.enabled === false);
+    if (!statsDisabled) return null;
     const customText = (typeof options.footerText === 'string' && options.footerText.length > 0)
         ? options.footerText.replaceAll('{number}', messages.length.toString()).replaceAll('{s}', messages.length > 1 ? 's' : '')
         : null;
     const wantsPowered = !!options.poweredBy;
-    // Default render only if stats footer is off AND no custom text was set.
-    const defaultText = statsDisabled && !customText
+    const defaultText = !customText
         ? `Exported ${messages.length} message${messages.length > 1 ? 's' : ''}.`
         : null;
     const shown = customText || defaultText;

package/dist/utils/buildProfiles.js

@@ -97,9 +97,15 @@ async function buildAllContext(messages, channel) {
             : (displayHex && displayHex !== '#000000' ? displayHex : null);
 
         // legacy profile (used by <discord-mention>)
+        //
+        // forceStatic: Discord CDN returns HTTP 415 for `.gif` on some animated
+        // avatar hashes (commonly bot avatars whose animation was removed but
+        // whose hash still carries the `a_` prefix). The static variant (.webp
+        // or .png) always works, so render avatars as static in transcripts.
+        // Avatars in a historical archive don't gain much from being animated.
         profiles[id] = {
             author: member?.nickname ?? author.displayName ?? author.username,
-            avatar: member?.displayAvatarURL?.({ size: 64 }) ?? author.displayAvatarURL?.({ size: 64 }),
+            avatar: member?.displayAvatarURL?.({ size: 64, forceStatic: true }) ?? author.displayAvatarURL?.({ size: 64, forceStatic: true }),
             roleColor: effectiveColor,
             roleIcon: member?.roles?.icon?.iconURL?.() ?? undefined,
             roleName: member?.roles?.hoist?.name ?? undefined,
@@ -124,7 +130,7 @@ async function buildAllContext(messages, channel) {
             username: author.username,
             displayName: member?.nickname || author.displayName || author.username,
             globalName: author.globalName || null,
-            avatar: member?.displayAvatarURL?.({ size: 128 }) || author.displayAvatarURL?.({ size: 128 }) || null,
+            avatar: member?.displayAvatarURL?.({ size: 128, forceStatic: true }) || author.displayAvatarURL?.({ size: 128, forceStatic: true }) || null,
             bannerColor: effectiveColor,
             bot: !!author.bot,
             system: !!author.system,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "discord-html-transcripts-fix",
-  "version": "1.7.1",
+  "version": "1.8.2",
   "description": "A nicely formatted html transcript generator for discord.js. Bugfix fork with support for the latest discord.js and Components v2.",
   "main": "dist/index.js",
   "types": "./dist/index.d.ts",