yarn add discord-jsx

This is the most fundamental part of any discord-jsx application. It is the internal Provider for the discord.js Client under the hood, as well as prefix among other things.

This component will run client.login() under the hood, and is the starting point for any discord-jsx client.

The Command component is very versatile when not using a handler function prop. It supports three main types of children. Text (string or number), a Shortcut (we'll come on to that later), or a custom function that takes 0-2 arguments.

For instance, we can pass regular text as a simple reply. E.g.

<Command name={"example"} description={"This is an example command"}>
  This would be the example reply.
</Command>

However, we can do much more with Shortcuts. As the name implies, these are shorter ways to template a message. discord-jsx has a few built in. Currently, they are author and channelName. You can use shortcuts in a handlebars-style syntax. E.g.

<Command
  name={"example"}
  description={"This is an example command using shortcuts"}
>
  Hello, {{ author }}. You sent a message in {{ channelName }}.
</Command>

Under the hood, these are actually valid JavaScript objects, and we just call the first property. A shortcut is simply a function that takes a Message as the first argument and always returns a string. Because of this, it's easy to build your own and reuse them as you please.

Secondly, Command also accepts a function that takes 0-2 argument. Similar to a Shortcut however this time, they can be async. This allows for database calls etc to be executed. E.g.

// An example function
async function getFavouriteFood(discordId: string): Promise<string> {
  const user = await database.getUserByDiscord(discordId);
  return user.favouriteFood;
}

<Command
  name={"food"}
  description={"This is an example command using inline functions"}
>
  Hello {{ author }}. Your favourite food is{" "}
  {(msg) => getFavouriteFood(msg.author.id)}.
</Command>;

And an example using the second argument (message args)

<Command name={"say"} description={"Repeats what you say"}>
  {(msg, ...args) => arg.join(" ")}
</Command>

This is a component for listening to custom Discord.js Client events. It's fairly self-explanatory. Here's a couple examples:

<Event event={"message"} handler={message => console.log(message.content)} />
<Event event={"guildCreate"} handler={guild => console.log(`Client joined ${guild.name}`)} />

If you want to use the client in your own hook, you can use useClientContext which returns ClientContext – an object containing the Client and prefix.

For example:

// Custom hook to check if a string starts with the current prefix
function useIsCommand(content: string): boolean {
  const context = useClientContext();
  return content.startsWith(context.prefix);
}

Stolen from cookiecord, inhibitors are a way of preventing a command from executing when a specific condition isn't met.

They are very easy to make, and we provide a couple from the constant CommonInhibitors. You use them in a <Command /> component, documented above.

For example:

// A command that will only run in a guild
<Command inhibitors={[CommonInhibitors.guildsOnly]} name={"guildsonly"} description={"A command that will run in a guild only"} handler={/*...*/} />
<Command inhibitors={[CommonInhibitors.noBots]} name={"nobots"} description={"A command that cannot be triggered by bots"} handler={/*...*/} />

To build an inhibitor, you can import the Inhibitor type. Inhibitors stop execution just by throwing a regular error. The error gets caught, and the message is echoed to the channel where the inhibition rose.