feat(Sticker): add support for gif stickers (#9038)

* feat(Sticker): add support for gif stickers

* chore: upgrade discord-api-types

* refactor: requested changes

packages/discord.js/package.json

@@ -56,7 +56,7 @@
     "@discordjs/util": "workspace:^",
     "@sapphire/snowflake": "^3.4.0",
     "@types/ws": "^8.5.4",
-    "discord-api-types": "^0.37.27",
+    "discord-api-types": "^0.37.28",
     "fast-deep-equal": "^3.1.3",
     "lodash.snakecase": "^4.1.1",
     "tslib": "^2.4.1",

packages/discord.js/src/structures/Sticker.js

@@ -1,9 +1,10 @@
 'use strict';
 
 const { DiscordSnowflake } = require('@sapphire/snowflake');
-const { Routes, StickerFormatType } = require('discord-api-types/v10');
+const { Routes } = require('discord-api-types/v10');
 const Base = require('./Base');
 const { DiscordjsError, ErrorCodes } = require('../errors');
+const { StickerFormatExtensionMap } = require('../util/Constants');
 
 /**
  * Represents a Sticker.
@@ -164,7 +165,7 @@ class Sticker extends Base {
    * @readonly
    */
   get url() {
-    return this.client.rest.cdn.sticker(this.id, this.format === StickerFormatType.Lottie ? 'json' : 'png');
+    return this.client.rest.cdn.sticker(this.id, StickerFormatExtensionMap[this.format]);
   }
 
   /**

packages/discord.js/src/util/Constants.js

@@ -1,6 +1,6 @@
 'use strict';
 
-const { ChannelType, MessageType, ComponentType } = require('discord-api-types/v10');
+const { ChannelType, MessageType, ComponentType, ImageFormat, StickerFormatType } = require('discord-api-types/v10');
 
 /**
  * Max bulk deletable message age
@@ -138,6 +138,21 @@ exports.SelectMenuTypes = [
   ComponentType.ChannelSelect,
 ];
 
+/**
+ * A mapping between sticker formats and their respective image formats.
+ * * {@link StickerFormatType.PNG} -> {@link ImageFormat.PNG}
+ * * {@link StickerFormatType.APNG} -> {@link ImageFormat.PNG}
+ * * {@link StickerFormatType.Lottie} -> {@link ImageFormat.Lottie}
+ * * {@link StickerFormatType.GIF} -> {@link ImageFormat.GIF}
+ * @typedef {Object} StickerFormatExtensionMap
+ */
+exports.StickerFormatExtensionMap = {
+  [StickerFormatType.PNG]: ImageFormat.PNG,
+  [StickerFormatType.APNG]: ImageFormat.PNG,
+  [StickerFormatType.Lottie]: ImageFormat.Lottie,
+  [StickerFormatType.GIF]: ImageFormat.GIF,
+};
+
 /**
  * @typedef {Object} Constants Constants that can be used in an enum or object-like way.
  * @property {number} MaxBulkDeletableMessageAge Max bulk deletable message age
@@ -147,4 +162,5 @@ exports.SelectMenuTypes = [
  * @property {ThreadChannelTypes} ThreadChannelTypes The types of channels that are threads
  * @property {VoiceBasedChannelTypes} VoiceBasedChannelTypes The types of channels that are voice-based
  * @property {SelectMenuTypes} SelectMenuTypes The types of components that are select menus.
+ * @property {Object} StickerFormatExtensionMap A mapping between sticker formats and their respective image formats.
  */

packages/discord.js/typings/index.d.ts

@@ -153,6 +153,7 @@ import {
   ForumLayoutType,
   ApplicationRoleConnectionMetadataType,
   APIApplicationRoleConnectionMetadata,
+  ImageFormat,
 } from 'discord-api-types/v10';
 import { ChildProcess } from 'node:child_process';
 import { EventEmitter } from 'node:events';
@@ -3445,6 +3446,7 @@ export const Constants: {
   ThreadChannelTypes: ThreadChannelType[];
   VoiceBasedChannelTypes: VoiceBasedChannelTypes[];
   SelectMenuTypes: SelectMenuType[];
+  StickerFormatExtensionMap: Record<StickerFormatType, ImageFormat>;
 };
 
 export const version: string;

packages/rest/src/lib/CDN.ts

@@ -219,12 +219,11 @@ export class CDN {
 	 *
 	 * @param stickerId - The sticker id
 	 * @param extension - The extension of the sticker
+	 * @privateRemarks
+	 * Stickers cannot have a `.webp` extension, so we default to a `.png`
 	 */
-	public sticker(stickerId: string, extension?: StickerExtension): string {
+	public sticker(stickerId: string, extension: StickerExtension = 'png'): string {
-		return this.makeURL(`/stickers/${stickerId}`, {
+		return this.makeURL(`/stickers/${stickerId}`, { allowedExtensions: ALLOWED_STICKER_EXTENSIONS, extension });
-			allowedExtensions: ALLOWED_STICKER_EXTENSIONS,
-			extension: extension ?? 'png', // Stickers cannot have a `.webp` extension, so we default to a `.png`
-		});
 	}
 
 	/**

packages/rest/src/lib/utils/constants.ts

@@ -43,7 +43,7 @@ export const enum RESTEvents {
 }
 
 export const ALLOWED_EXTENSIONS = ['webp', 'png', 'jpg', 'jpeg', 'gif'] as const satisfies readonly string[];
-export const ALLOWED_STICKER_EXTENSIONS = ['png', 'json'] as const satisfies readonly string[];
+export const ALLOWED_STICKER_EXTENSIONS = ['png', 'json', 'gif'] as const satisfies readonly string[];
 export const ALLOWED_SIZES = [16, 32, 64, 128, 256, 512, 1_024, 2_048, 4_096] as const satisfies readonly number[];
 
 export type ImageExtension = (typeof ALLOWED_EXTENSIONS)[number];

yarn.lock

@@ -8436,10 +8436,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"discord-api-types@npm:^0.37.27":
+"discord-api-types@npm:^0.37.27, discord-api-types@npm:^0.37.28":
-  version: 0.37.27
+  version: 0.37.28
-  resolution: "discord-api-types@npm:0.37.27"
+  resolution: "discord-api-types@npm:0.37.28"
-  checksum: f3c404db151862871686008a1e7902f22e2147b391840f9184568d5bc54593babac567fed90bd4831a6b793bd84c424172b081af36badbf950ea0e6fcd5d2e8a
+  checksum: c033b9c82d5ecb3f273d563db578e21e982a35d106cc66e7ea42d7ef0a79817ca43badd3aade8a5ddb491bc8679ed08b1bcccc105e64ecd1ea5a53a11c2b1f8b
   languageName: node
   linkType: hard
 
@@ -8457,7 +8457,7 @@ __metadata:
     "@sapphire/snowflake": ^3.4.0
     "@types/node": 16.18.11
     "@types/ws": ^8.5.4
-    discord-api-types: ^0.37.27
+    discord-api-types: ^0.37.28
     dtslint: ^4.2.1
     eslint: ^8.31.0
     eslint-formatter-pretty: ^4.1.0