Discord.js Button on Embed

Question

I would like to make this send an embed instead of it saying "If you want to apply, click the button below.", and have the apply button underneath the embed I have read up about some Component array and embed array stuff but I can't seem to get anything working with that If anyone could help me out id appreciate it 🙂

Two very helpful people have helped me

@Skulaurun Mrusal and @PerplexingParadox

Thank you! 🙂

client.on("message", async (message) => {
      // Don't reply to bots
  if (message.author.bot) return;

  if (message.content == "#req") {
         if(!message.member.hasPermission("MANAGE_MESSAGES"))
     {
        message.reply("You do not have permission to do that!");
        return;
     }
    // Perform raw API request and send a message with a button,
    // since it isn't supported natively in discord.js v12
    client.api.channels(message.channel.id).messages.post({
      data: {
        embeds: [reqEmbed],
        components: [
          {
            type: 1,
            components: [
              {
                type: 2,
                style:  4,
                label: "Apply",
                // Our button id, we can use that later to identify,
                // that the user has clicked this specific button
                custom_id: "send_application"
              }
            ]
          }
        ]
      }
    });
  }
});

Answer 1

You only need to modify your code with one line. You just have to send your exampleEmbed through the Discord API post instead of using the discord.js method.

To do that, all you have to do is add an embeds field, which takes in an array of embed objects, which you have conveniently labeled as exampleEmbed, and put it there.

Like this:

client.api.channels(message.channel.id).messages.post({
    data: {
        //adds the embed here, so the button and embed will be sent together
        embeds: [exampleEmbed],
        components: [
            {
                type: 1,
                components: [
                    {
                        type: 2,
                        style: 1,
                        label: "Apply",
                        // Our button id, we can use that later to identify,
                        // that the user has clicked this specific button
                        custom_id: "send_application"
                    }
                ]
            }
        ],
    }
});

Here's the Discord API documentation for reference.

---

In addition, it seems like discord.js v13 also supports buttons as well, but since it's been released pretty recently, I haven't had time to check it out.

Discord.js Guide

Answer 2

with discord.js v14 it is possible. I think you are allowed up to 5 actionrow's in a single message 5 buttons per actionrow

interaction.reply({ content: 'message(optional)', embed: [embed] components: [ActionRowComponent, ActionRowComponent2] });

interaction.reply is for slash commands but I think this also works with message.reply as well if you used the ActionRowBuilder or EmbedBuilder built into discord.js v14 you will need to add .toJSON() to convert the actionrows and embeds into a format that is compatable with the .reply() method