Message Components
Setting the InteractionHandlerTypes
option MessageComponent
will have
this InteractionHandler
trigger for both SelectMenus
and
Buttons
.
Here's a simple example:
- JavaScript
- ESM
- TypeScript
const { InteractionHandler, InteractionHandlerTypes } = require('@sapphire/framework');class MessageComponentHandler extends InteractionHandler { constructor(ctx, options) { super(ctx, { ...options, interactionHandlerType: InteractionHandlerTypes.MessageComponent }); } parse(interaction) { if (interaction.customId !== 'my-echo-button-or-select') return this.none(); return this.some(); } async run(interaction) { if (interaction.isButton()) { await interaction.reply({ content: `You clicked a button` }); } else { await interaction.reply({ // Remember how we can have multiple values? Let's get the first one! content: `You selected: ${interaction.values[0]}` }); } }}module.exports = { MessageComponentHandler};
import { InteractionHandler, InteractionHandlerTypes } from '@sapphire/framework';export class MessageComponentHandler extends InteractionHandler { constructor(ctx, options) { super(ctx, { ...options, interactionHandlerType: InteractionHandlerTypes.MessageComponent }); } parse(interaction) { if (interaction.customId !== 'my-echo-button-or-select') return this.none(); return this.some(); } async run(interaction) { if (interaction.isButton()) { await interaction.reply({ content: `You clicked a button` }); } else { await interaction.reply({ // Remember how we can have multiple values? Let's get the first one! content: `You selected: ${interaction.values[0]}` }); } }}
import { InteractionHandler, InteractionHandlerTypes, PieceContext } from '@sapphire/framework';import type { SelectMenuInteraction, ButtonInteraction } from 'discord.js';export class MessageComponentHandler extends InteractionHandler { public constructor(ctx: PieceContext, options: InteractionHandler.Options) { super(ctx, { ...options, interactionHandlerType: InteractionHandlerTypes.MessageComponent }); } public override parse(interaction: ButtonInteraction | SelectMenuInteraction) { if (interaction.customId !== 'my-echo-button-or-select') return this.none(); return this.some(); } public async run(interaction: ButtonInteraction | SelectMenuInteraction) { if (interaction.isButton()) { await interaction.reply({ content: `You clicked a button` }); } else { await interaction.reply({ // Remember how we can have multiple values? Let's get the first one! content: `You selected: ${interaction.values[0]}` }); } }}