main-menu.ts (relevant part):
import {
ContainerBuilder,
SectionBuilder,
TextDisplayBuilder,
ActionRowBuilder,
ButtonBuilder,
MessageFlags,
} from 'discord.js';
export const MainMenu: MessageBuilder = {
async build(client, state, options) {
const container = new ContainerBuilder().setAccentColor(0x00BFFF);
const titleComponent = new TextDisplayBuilder().setContent('Some title');
const textSection = new SectionBuilder().addTextDisplayComponents(titleComponent);
const createBtn = await new ConfigMainMenuCreateButton().build(client, undefined);
const editBtn = await new ConfigMainMenuEditButton().build(client, undefined);
const buttonRow = new ActionRowBuilder<ButtonBuilder>();
buttonRow.addComponents(createBtn, editBtn);
container.addSectionComponents(textSection);
return {
flags: MessageFlags.IsComponentsV2,
components: [container],
};
}
};
ButtonComponent base class:
export abstract class ButtonComponentHandler<TData = unknown> {
async build(client: Client, data?: TData): Promise<ButtonBuilder> {
const builder = new ButtonBuilder()
.setStyle(this.style ?? ButtonStyle.Primary)
.setLabel(this.label ?? '');
builder.setCustomId('some:custom:id');
return builder;
}
}