How can I add buttons to the right side of the component?

[keen grove]

How can I add buttons to the right side of the component?

    const c = new ContainerBuilder();
    c.addSectionComponents((section) => section
      .addTextDisplayComponents((textDisplay) =>
        textDisplay.setContent(
          `## ${emoji.settings} Server Settings\n\n${emoji.prefix}**Prefix:** \`${prefix}\`\n${emoji.staff}**Staff Roles:** \`${staffRoles.length}\`\n${emoji.lock}**Blacklisted Users:** \`${blacklisted.length}\``,
        ),
      )
      .setThumbnailAccessory((thumbnail) => thumbnail.setURL(botAvatarURL)),
    )

    c.addSeparatorComponents(new SeparatorBuilder()
        .setSpacing(SeparatorSpacingSize.Small)
        .setDivider(true),
    );

    c.addTextDisplayComponents(
      new TextDisplayBuilder().setContent("Prefix")
    )

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_prefix")
          .setEmoji(`${emoji.edit}`)
          .setStyle(ButtonStyle.Secondary),
      ),
    );

    c.addTextDisplayComponents(
      new TextDisplayBuilder().setContent("Staff Roles")
    )

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_staff")
          .setEmoji(`${emoji.edit}`)
          .setStyle(ButtonStyle.Primary),
      ),
    );

    c.addTextDisplayComponents(
      new TextDisplayBuilder().setContent("Blacklist")
    )

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_blacklist")
          .setEmoji(`${emoji.edit}`)
          .setStyle(ButtonStyle.Danger),
      ),
    );

    c.addSeparatorComponents(
      new SeparatorBuilder()
        .setSpacing(SeparatorSpacingSize.Small)
        .setDivider(true),
    );

    return c;

[rugged turtle]

just addd a text display then add button just it

[keen grove]

?

    c.addSectionComponents((section) =>
      section
        .addTextDisplayComponents(
          (textDisplay) => textDisplay
          .setContent( 'test', ),
        )
        .setButtonAccessory((button) => button
          .setCustomId('Button')
          .setEmoji(`✨`)
          .setLabel('Button')
          .setStyle(ButtonStyle.Primary),
        ),
    )

[rugged turtle]

hm

run it

[keen grove]

When I try to add .setEmoji(), everything breaks.

    c.addSectionComponents((section) => section
        .addTextDisplayComponents(
          (textDisplay) => textDisplay
          .setContent( 'test', ),
        )
        .setButtonAccessory((button) => button
          .setCustomId('Button')
          .setLabel('Button')
          .setStyle(ButtonStyle.Primary),
        ),
    )

How do I add custom emoji to a button? Like the example in the attachment.

[rugged turtle]

import { TextDisplayBuilder, ButtonBuilder, ButtonStyle, SectionBuilder, ContainerBuilder } from 'discord.js';

const components = [
        new ContainerBuilder()
            .addSectionComponents(
                new SectionBuilder()
                    .setButtonAccessory(
                        new ButtonBuilder()
                            .setStyle(ButtonStyle.Secondary)
                            .setLabel("Agile Antelope")
                            .setEmoji({
                                name: "😍",
                            })
                            .setCustomId("c60e5f63a30246b9980d6e53741c059c")
                    )
                    .addTextDisplayComponents(
                        new TextDisplayBuilder().setContent("If life gives you toaster, make toaster soup."),
                    ),
            ),
];

[keen grove]

🙁

    const c = new ContainerBuilder();
    c.addTextDisplayComponents(
      new TextDisplayBuilder().setContent(`## ${emoji.settings} Server Settings`)
    )

    c.addSectionComponents((section) => section
      .addTextDisplayComponents((textDisplay) =>
        textDisplay.setContent(
          `${emoji.prefix}**Prefix:** \`${prefix}\`\n${emoji.staff}**Staff Roles:** \`${staffRoles.length}\`\n${emoji.lock}**Blacklisted Users:** \`${blacklisted.length}\``,
        ),
      )
      .setThumbnailAccessory((thumbnail) => thumbnail.setURL(botAvatarURL)),
    )

    c.addSeparatorComponents(new SeparatorBuilder().setSpacing(SeparatorSpacingSize.Small).setDivider(true),);

    c.addSectionComponents(
      new TextDisplayBuilder().setContent("Prefix"),
      new SectionBuilder()
        .setButtonAccessory(
          new ButtonBuilder()
          .setCustomId("settings_prefix")
          .setEmoji(`${emoji.edit}`)
          .setStyle(ButtonStyle.Secondary),
        ),
    )

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_prefix")
          .setEmoji(`${emoji.edit}`)
          .setStyle(ButtonStyle.Secondary),
      ),
    );

    c.addSeparatorComponents(new SeparatorBuilder().setSpacing(SeparatorSpacingSize.Small).setDivider(true),);

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_staff")
          .setEmoji(`${emoji.edit}`)
          .setLabel("Staff Roles")
          .setStyle(ButtonStyle.Primary),
      ),
    );

    c.addSeparatorComponents(new SeparatorBuilder().setSpacing(SeparatorSpacingSize.Small).setDivider(true),);

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_blacklist")
          .setEmoji(`${emoji.edit}`)
          .setLabel("Blacklist")
          .setStyle(ButtonStyle.Danger),
      ),
    );

    c.addSeparatorComponents(new SeparatorBuilder().setSpacing(SeparatorSpacingSize.Small).setDivider(true),);

    c.addActionRowComponents(
      new ActionRowBuilder().addComponents(
        new ButtonBuilder()
          .setCustomId("settings_guide")
          .setLabel("View Guide")
          .setStyle(ButtonStyle.Success),
      ),
    );

    return c;

Oh, I'm so stupid..
I didn't notice it.

[rugged turtle]

oh

[fossil atlas]

🌱 | Fleq spent 5 and caught an uncommon :rabbit2:!
| You found a lootbox! [1/3] RESETS IN: 2H 27 M 22S

[rugged turtle]

fixed

@keen grove

?

[keen grove]

no