discord.js - Imagine an app•10mo ago

Dynamically adding buttons component to interaction

Good day were trying to add buttons to a interaction reply Create buttons dynamically - then add the array to the "new ActionRowBuilder().addComponents()" command, fails and gives this error "DiscordAPIError[50035]: Invalid Form Body components[0].components[BASE_TYPE_BAD_LENGTH]: Must be between 1 and 5 in length."

10 Replies

d.js toolkit•10mo ago

- What's your exact discord.js npm list discord.js and node node -v version? - Not a discord.js issue? Check out #other-js-ts. - Consider reading #how-to-get-help to improve your question! - Explain what exactly your issue is. - Post the full error stack trace, not just the top part! - Show your code! - Issue solved? Press the button!

MountwolfOP•10mo ago

npm list discord.js version = 14.13.0 node version = 21.6.0

const lines = body.split("\n");
    buttons = new Array();

    console.log("ButtonPrimary ", body);
    for (let index = 0; index < lines.length; index++) {
        
        const element = lines[index].trim();
        if (element == "") continue;

        this["ViewButton"+index] = new ButtonBuilder()
            .setLabel(element)
            .setStyle(ButtonStyle.Primary)
            .setCustomId(element);

        buttons.push(this["ViewButton"+index]);
    }

    const buttonRow = new ActionRowBuilder().addComponents(buttons);

    const reply = await interaction.editReply({content: "View summary", components: [buttonRow]});
    const filter = (i) => i.user.id === interaction.author.id;

const lines = body.split("\n");
    buttons = new Array();

    console.log("ButtonPrimary ", body);
    for (let index = 0; index < lines.length; index++) {
        
        const element = lines[index].trim();
        if (element == "") continue;

        this["ViewButton"+index] = new ButtonBuilder()
            .setLabel(element)
            .setStyle(ButtonStyle.Primary)
            .setCustomId(element);

        buttons.push(this["ViewButton"+index]);
    }

    const buttonRow = new ActionRowBuilder().addComponents(buttons);

    const reply = await interaction.editReply({content: "View summary", components: [buttonRow]});
    const filter = (i) => i.user.id === interaction.author.id;

This is my code

AlexCdDg•10mo ago

You probably have more than 5 buttons in that row, which exceeds the maximum

MountwolfOP•10mo ago

Oh so is not possible to have more than 5 buttons

AlexCdDg•10mo ago

Not in one row, but you can have have more rows with more buttons

MountwolfOP•10mo ago

How would I add a second row

AlexCdDg•10mo ago

You'd have to initialize another ActionRowBuilder (for example "buttonRow2"), add the new buttons in that row, and then send both rows in the components: parameter,

...editReply({content: ..., components: [buttonRow, buttonRow2]})

...editReply({content: ..., components: [buttonRow, buttonRow2]})

MountwolfOP•10mo ago

Thank alot i tried it now with 5 buttons and it works now, will a a second row now

AlexCdDg•10mo ago

Alright, good luck

MountwolfOP•10mo ago

Gaming

Programming

Dynamically adding buttons component to interaction