# Button

## Create a Button

To create a button in your project, it is recommended to use the provided CLI tool. This will ensure that your button is correctly generated and ready to implement.

### CLI Pattern

```bash
bot add button
```

### Example

For a "buy" button, you can obtain the following file at `src/buttons/buy.ts`, ready for implementation.

## Define Button Parameters

Once the button is created, you can define any parameters the button will receive. Here’s an example of a "buy" button that takes an `article` and a `quantity` as parameters:

```typescript
import { Button } from "#core/button"

export type BuyButtonParams = {
  article: string
  quantity: number
}

export default new Button<BuyButtonParams>({
  key: "buy",
  description: "The buy button",
  builder: (builder) => builder.setLabel("Buy"),
  async run(interaction, article, quantity) {
    await interaction.deferUpdate()
    await interaction.followUp({
      content: `You clicked the buy button for ${quantity}x ${article}!`,
      ephemeral: true,
    })
  },
})
```

***

## Using the Button

After creating the button handler, you can instantiate and use the button in your bot’s interactions. Here is an example of how to send a button within a message:

```typescript
import discord from "discord.js"
import buyButton from "#buttons/buy"

await channel.send({
  components: [
    new discord.ActionRowBuilder<discord.MessageActionRowComponentBuilder>().addComponents(
      buyButton.create({ article: "article 1", quantity: 3 }),
    ),
  ],
})
```

You can also use the button from an external function:

```typescript
import discord from "discord.js"
import { createButton } from "#core/button"
import buyButton from "#buttons/buy"

await channel.send({
  components: [
    new discord.ActionRowBuilder<discord.MessageActionRowComponentBuilder>().addComponents(
      createButton(buyButton, {
        article: "article 1",
        quantity: 3,
      }),
    ),
  ],
})
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ghom.gitbook.io/bot.ts/usage/create-a-button.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.