discord.js - Imagine an app•12mo ago

Using Buttons Properly

Hello 👋 So I am creating a staff application Modal, I haven't actually gotten to the modal part of things yet tho ahaha You can find my current file structure attached in an image

const {
  SlashCommandBuilder,
  EmbedBuilder,
  PermissionFlagsBits,
  Interaction,
  ActionRowBuilder,
  ButtonBuilder,
  ButtonStyle,
} = require("discord.js");

module.exports = {
  data: new SlashCommandBuilder()
    .setName("staffapp")
    .setDescription("Send the staff application message")
    .setDefaultMemberPermissions(PermissionFlagsBits.Administrator),

  /**
   * @param {Interaction} interaction
   */
  async execute(interaction) {
    const applicationEmbed = new EmbedBuilder()
      .setColor("Blue")
      .setTitle("Want to apply for staff?")
      .setDescription(
        "We'll just need to grab some information from you before we begin. Don't worry, this will just take a second!"
      )
      .setFooter({ text: "Click the button below to begin!" });

    const start = new ButtonBuilder()
      .setCustomId("start-application")
      .setLabel("Apply for staff")
      .setStyle(ButtonStyle.Primary);

    const row = new ActionRowBuilder().addComponents(start);

    await interaction.channel.send({
      embeds: [applicationEmbed],
      components: [row],
    });
  },
};

const {
  SlashCommandBuilder,
  EmbedBuilder,
  PermissionFlagsBits,
  Interaction,
  ActionRowBuilder,
  ButtonBuilder,
  ButtonStyle,
} = require("discord.js");

module.exports = {
  data: new SlashCommandBuilder()
    .setName("staffapp")
    .setDescription("Send the staff application message")
    .setDefaultMemberPermissions(PermissionFlagsBits.Administrator),

  /**
   * @param {Interaction} interaction
   */
  async execute(interaction) {
    const applicationEmbed = new EmbedBuilder()
      .setColor("Blue")
      .setTitle("Want to apply for staff?")
      .setDescription(
        "We'll just need to grab some information from you before we begin. Don't worry, this will just take a second!"
      )
      .setFooter({ text: "Click the button below to begin!" });

    const start = new ButtonBuilder()
      .setCustomId("start-application")
      .setLabel("Apply for staff")
      .setStyle(ButtonStyle.Primary);

    const row = new ActionRowBuilder().addComponents(start);

    await interaction.channel.send({
      embeds: [applicationEmbed],
      components: [row],
    });
  },
};

This is the staffapp.js file ``` const { Events, Interaction } = require("discord.js");

3 Replies

d.js toolkit•12mo ago

• What's your exact discord.js npm list discord.js and node node -v version? • Post the full error stack trace, not just the top part! • Show your code! • Explain what exactly your issue is. • Not a discord.js issue? Check out #useful-servers.

Panda•12mo ago

module.exports = {
  name: Events.InteractionCreate,
  /**
   * @param {Interaction} interaction
   */
  async execute(interaction) {
    if (interaction.isChatInputCommand()) {
      const command = interaction.client.commands.get(interaction.commandName);

      if (!command) {
        console.error(
          `No command matching ${interaction.commandName} was found.`
        );
        return;
      }

      try {
        await command.execute(interaction);
      } catch (error) {
        console.error(`Error executing ${interaction.commandName}`);
        console.error(error);
      }
    }
  },
};

module.exports = {
  name: Events.InteractionCreate,
  /**
   * @param {Interaction} interaction
   */
  async execute(interaction) {
    if (interaction.isChatInputCommand()) {
      const command = interaction.client.commands.get(interaction.commandName);

      if (!command) {
        console.error(
          `No command matching ${interaction.commandName} was found.`
        );
        return;
      }

      try {
        await command.execute(interaction);
      } catch (error) {
        console.error(`Error executing ${interaction.commandName}`);
        console.error(error);
      }
    }
  },
};

interactionCreate.js I was wondering how I would add buttons into this thinKappa

    if (interaction.isButton()) {
      const button = client.buttons.get(interaction.customId);
      if (!button) return;

      try {
        await button.execute(interaction);
      } catch (error) {
        console.error(error);
        await interaction.reply({
          content: "There was an error while executing the button script !",
          ephemeral: true,
        });
      }
    } else {
      return;
    }

    if (interaction.isButton()) {
      const button = client.buttons.get(interaction.customId);
      if (!button) return;

      try {
        await button.execute(interaction);
      } catch (error) {
        console.error(error);
        await interaction.reply({
          content: "There was an error while executing the button script !",
          ephemeral: true,
        });
      }
    } else {
      return;
    }

I was thinking something like this inside the interactionCreate.js file. But how would I actually access the button calls inside a different buttons directory? Help please discord.js@14.11.0 and node v18.12.1 Im trying to find this in the documentation but im honestly failing to find where its stated

duck•12mo ago

this was semi-crossposted to #djs-help-v14 but not directly answered not sure what you intend to do after receiving the answer you were given https://discord.com/channels/222078108977594368/824411059443204127/1120858869841797200 but just to specifically answer your question here, you'd need a similar setup to the guide's command handling just as <Client>.commands is a Collection you would have to define and populate, you would also have to define <Client>.buttons and populate it yourself by iterating and reading your buttons' files

Gaming

Programming

Using Buttons Properly