From 4b077e679cf7d4dd5590592da38360aa5783255e Mon Sep 17 00:00:00 2001 From: Suneet Tipirneni <77477100+suneettipirneni@users.noreply.github.com> Date: Wed, 3 May 2023 19:58:53 -0400 Subject: [PATCH] refactor(guide): use `@type` comments for command data code (#9489) * refactor(guide): use `@type` comments for command data code * fix: typo * fix: use correct doc comment * fix: use one line * feat: add param types * fix: use command interaction instead * Update apps/guide/src/content/03-creating-your-bot/03-adding-commands.mdx Co-authored-by: Souji * chore: lint --------- Co-authored-by: Souji Co-authored-by: Jiralite <33201955+Jiralite@users.noreply.github.com> --- .../03-creating-your-bot/03-adding-commands.mdx | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/apps/guide/src/content/03-creating-your-bot/03-adding-commands.mdx b/apps/guide/src/content/03-creating-your-bot/03-adding-commands.mdx index 2f402ee10..ea1993153 100644 --- a/apps/guide/src/content/03-creating-your-bot/03-adding-commands.mdx +++ b/apps/guide/src/content/03-creating-your-bot/03-adding-commands.mdx @@ -53,6 +53,7 @@ At a minimum, the definition of a slash command must have a name and a descripti ```js +/** @type {import('discord.js').RESTPostAPIApplicationCommandsJSONBody} */ export const data = { name: 'ping', description: 'Replies with Pong!', @@ -68,6 +69,7 @@ The simplest way to acknowledge and respond to an interaction is the _`interacti ```js +/** @param {import('discord.js').CommandInteraction} interaction */ export async function execute(interaction) { await interaction.reply('Pong!'); } @@ -75,6 +77,14 @@ export async function execute(interaction) { + + [`@type`](https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html#type) and + [`@param`](https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html#param-and-returns) tags allow you + to annotate your code with type information. The tags are not required for your code to run but provide autocomplete + and type information for fields and parameters, which can majorly improve your developer experience when working with + them. + + Put these two together by creating a `commands/ping.js` file for your first command. Inside this file, you're going to define and export two items. - The `data` property, which will provide the command definition shown above for registering to Discord. @@ -85,11 +95,13 @@ The _`export`_ keyword ensures these values can be imported and read by other fi ```js commands/ping.js +/** @type {import('discord.js').RESTPostAPIApplicationCommandsJSONBody} */ export const data = { name: 'ping', description: 'Replies with Pong!', }; +/** @param {import('discord.js').CommandInteraction} interaction */ export async function execute(interaction) { await interaction.reply('Pong!'); } @@ -109,11 +121,13 @@ That's it for your basic ping command. Below are examples of two more commands w ```js commands/user.js +/** @type {import('discord.js').RESTPostAPIApplicationCommandsJSONBody} */ export const data = { name: 'user', description: 'Provides information about the user.', }; +/** @param {import('discord.js').CommandInteraction} interaction */ export async function execute(interaction) { // interaction.user is the object representing the User who ran the command // interaction.member is the GuildMember object, which represents the user in the specific guild @@ -124,11 +138,13 @@ export async function execute(interaction) { ``` ```js commands/server.js +/** @type {import('discord.js').RESTPostAPIApplicationCommandsJSONBody} */ export const data = { name: 'server', description: 'Provides information about the server.', }; +/** @param {import('discord.js').CommandInteraction} interaction */ export async function execute(interaction) { // interaction.guild is the object representing the Guild in which the command was run await interaction.reply(`This server is ${interaction.guild.name} and has