Create a discord bot with TypeScript and Decorators!

📖 Introduction

This module is an extension of discord.js, so the internal behavior (methods, properties, ...) is the same.

This library allows you to use TypeScript decorators on discord.js, it simplifies your code and improves the readability!

This repository is a ~~fork~~ of OwenCalvin/discord.ts from @OwenCalvin, which is no longer actively maintained.

💻 Installation

Version 16.6.0 or newer of Node.js is required

npm install discordx
yarn add discordx

installation guide

one-click installation

📜 Documentation

discord-ts.js.org

Tutorials (dev.to)

🤖 Bot Examples

discordx-templates (starter repo)

music bot (ytdl)

lavalink bot

Shana from @VictoriqueMoe

💡 Why discordx?

With discordx, we intend to provide the latest up-to-date package to easily build feature-rich bots with multi-bot compatibility, simple commands, pagination, music, and much more. Updated daily with discord.js changes.

Try discordx now with CodeSandbox

If you have any issues or feature requests, Please open an issue at Github or join discord server

🆕 Features

Support multiple bots in a single nodejs instance (@Bot)
@SimpleCommand to use old fashioned command, such as !hello world
@SimpleCommandOption parse and define command options like @SlashOption
client.initApplicationCommands to create/update/remove discord application commands
client.initApplicationPermissions to update discord application commands permissions
Handler for all discord interactions (slash/button/menu/context)
Support TSyringe and TypeDI
Support ECMAScript

🧮 Packages

Here are more packages from us to extend the functionality of your Discord bot.

Package	Description
`create-discordx`	Create discordx (discord.ts) apps with one command
`discordx`	Create a discord bot with TypeScript and Decorators!
`@discordx/changelog`	Changelog generator, written in TypeScript with Node.js
`@discordx/di`	Dependency injection service with TSyringe support
`@discordx/importer`	Import solution for ESM and CJS
`@discordx/internal`	discord.ts internal methods, can be used for external projects
`@discordx/koa`	Create rest api server with Typescript and Decorators
`@discordx/lava-player`	Create lavalink player
`@discordx/lava-queue`	Create queue system for lavalink player
`@discordx/music`	Create discord music player easily
`@discordx/pagination`	Add pagination to your discord bot
`@discordx/socket.io`	Create socket.io server with Typescript and Decorators
`@discordx/utilities`	Create own group with `@Category` and guards
`discord-spams`	Tiny but powerful discord spam protection library

📔 Decorators

There is a whole system that allows you to implement complex slash/simple commands and handle interactions like button, select-menu, context-menu etc.

General

Commands

GUI Interactions

📟 @Slash

Discord has it's own command system now, you can simply declare commands and use Slash commands this way

import { Discord, Slash } from "discordx";
import { CommandInteraction } from "discord.js";

@Discord()
class Example {
  @Slash("hello")
  private hello(
    @SlashOption("text")
    text: string,
    interaction: CommandInteraction
  ) {
    // ...
  }
}

📟 @ButtonComponent

Create discord button handler with ease!

@Discord()
class Example {
  @Slash("hello")
  hello(interaction: CommandInteraction) {
    const helloBtn = new MessageButton()
      .setLabel("Hello")
      .setEmoji("👋")
      .setStyle("PRIMARY")
      .setCustomId("hello-btn");

    const row = new MessageActionRow().addComponents(helloBtn);

    interaction.reply({
      content: "Say hello to bot",
      components: [row],
    });
  }

  @ButtonComponent("hello-btn")
  myBtn(interaction: ButtonInteraction) {
    interaction.reply(`👋 ${interaction.member}`);
  }
}

📟 @SelectMenuComponent

Create discord select menu handler with ease!

const roles = [
  { label: "Principal", value: "principal" },
  { label: "Teacher", value: "teacher" },
  { label: "Student", value: "student" },
];

@Discord()
class Example {
  @SelectMenuComponent("role-menu")
  async handle(interaction: SelectMenuInteraction) {
    await interaction.deferReply();

    // extract selected value by member
    const roleValue = interaction.values?.[0];

    // if value not found
    if (!roleValue)
      return await interaction.followUp("invalid role id, select again");
    await interaction.followUp(
      `you have selected role: ${
        roles.find((r) => r.value === roleValue).label
      }`
    );
    return;
  }

  @Slash("roles", { description: "role selector menu" })
  async myRoles(interaction: CommandInteraction): Promise<unknown> {
    await interaction.deferReply();

    // create menu for roles
    const menu = new MessageSelectMenu()
      .addOptions(roles)
      .setCustomId("role-menu");

    // create a row for message actions
    const buttonRow = new MessageActionRow().addComponents(menu);

    // send it
    interaction.editReply({
      content: "select your role!",
      components: [buttonRow],
    });
    return;
  }
}

📟 @ContextMenu

Create discord context menu options with ease!

@Discord()
class Example {
  @ContextMenu("MESSAGE", "message context")
  messageHandler(interaction: MessageContextMenuInteraction) {
    console.log("I am message");
  }

  @ContextMenu("USER", "user context")
  userHandler(interaction: UserContextMenuInteraction) {
    console.log("I am user");
  }
}

📟 @ModalComponent

Create discord modal with ease!

@Discord()
class Example {
  @ModalComponent("AwesomeForm")
  async handle(interaction: ModalSubmitInteraction): Promise<void> {
    const name = interaction.fields.getTextInputValue("name");
    await interaction.reply(`name: ${name}`);
    return;
  }

  @Slash()
  modal(interaction: CommandInteraction): void {
    // Create the modal
    const modal = new Modal()
      .setTitle("My Awesome Form")
      .setCustomId("AwesomeForm");

    // Create text input fields
    const nameInputComponent = new TextInputComponent()
      .setCustomId("name")
      .setLabel("Name")
      .setStyle("SHORT");

    const row = new MessageActionRow<ModalActionRowComponent>().addComponents(
      nameInputComponent
    );

    // Add action rows to form
    modal.addComponents(row);

    // Present the modal to the user
    interaction.showModal(modal);
  }
}

📟 @SimpleCommand

Create a simple command handler for messages using @SimpleCommand. Example !hello world

@Discord()
class Example {
  @SimpleCommand("perm-check", { aliases: ["p-test"] })
  @Permission(false)
  @Permission({
    id: "462341082919731200",
    type: "USER",
    permission: true,
  })
  permFunc(command: SimpleCommandMessage) {
    command.message.reply("access granted");
  }
}

💡@On / @Once

We can declare methods that will be executed whenever a Discord event is triggered.

Our methods must be decorated with the @On(event: string) or @Once(event: string) decorator.

That's simple, when the event is triggered, the method is called:

import { Discord, On, Once } from "discordx";

@Discord()
class Example {
  @On("messageCreate")
  private onMessage() {
    // ...
  }

  @Once("messageDelete")
  private onMessageDelete() {
    // ...
  }
}

💡@Reaction

Create a reaction handler for messages using @Reaction.

@Discord()
class Example {
  @Reaction("📌")
  async pin(reaction: MessageReaction): Promise<void> {
    await reaction.message.pin();
  }
}

⚔️ Guards

We implemented a guard system that functions like the Koa middleware system

You can use functions that are executed before your event to determine if it's executed. For example, if you want to apply a prefix to the messages, you can simply use the @Guard decorator.

The order of execution of the guards is done according to their position in the list, so they will be executed in order (from top to bottom).

Guards can be set for @Slash, @On, @Once, @Discord and globally.

import { Discord, On, Client, Guard } from "discordx";
import { NotBot } from "./NotBot";
import { Prefix } from "./Prefix";

@Discord()
class Example {
  @On("messageCreate")
  @Guard(
    NotBot // You can use multiple guard functions, they are executed in the same order!
  )
  onMessage([message]: ArgsOf<"messageCreate">) {
    switch (message.content.toLowerCase()) {
      case "hello":
        message.reply("Hello!");
        break;
      default:
        message.reply("Command not found");
        break;
    }
  }
}

☎️ Need help?

Thank you

Show your support for discordx by giving us a star on github.

dgarc359 / discord.ts Goto Github PK

discord.ts's Introduction