Lesson 8 — Modals

Create commands/feedback.js

const { SlashCommandBuilder } = require("@discordjs/builders");
const { ModalBuilder, TextInputBuilder, TextInputStyle, ActionRowBuilder } = require("discord.js");

module.exports = {
  dev: true,
  data: new SlashCommandBuilder().setName("feedback").setDescription("Open a feedback form"),
  async execute(interaction) {
    const modal = new ModalBuilder().setCustomId("feedback_modal").setTitle("Feedback");

    const input = new TextInputBuilder()
      .setCustomId("feedback_text")
      .setLabel("What should we improve?")
      .setStyle(TextInputStyle.Paragraph)
      .setRequired(true);

    modal.addComponents(new ActionRowBuilder().addComponents(input));
    await interaction.showModal(modal);
  },
};

Create modals/feedback_modal.js

module.exports = {
  customID: "feedback_modal",
  async execute(interaction) {
    const text = interaction.fields.getTextInputValue("feedback_text");
    await interaction.reply({ content: `Thanks! You said: ${text}`, ephemeral: true });
  }
};

node index.js

Run /feedback, fill the form, submit.