Creating a button handler

Hey! I would like to know if there is a way to create a button handler using Sapphire. I would like to read all files from a folder called "buttons" and store the data inside my container. I'd then check if there is an existing button with the given interaction id inside my container and if there is, I'd run the execute function. I came up with some code but can't manage to get it working. I'll attach it down below. Thanks in advance for all the help 🙂
4 Replies
yibuh
yibuh•2y ago
buttonHandler.ts
import { InteractionHandler, InteractionHandlerTypes, container, type PieceContext } from '@sapphire/framework';
import type { ButtonInteraction } from 'discord.js';
import type { ButtonExport } from '../../lib/interactions';

export class ButtonHandler extends InteractionHandler {
public constructor(ctx: PieceContext, options: InteractionHandler.Options) {
super(ctx, {
...options,
interactionHandlerType: InteractionHandlerTypes.Button
});
}

public override async parse(interaction: ButtonInteraction) {
const button = container.buttons.get(interaction.customId);
if (!button) return this.none();
return this.some(button);
}

public async run(interaction: ButtonInteraction) {
const button: ButtonExport | undefined = container.buttons.get(interaction.customId as string);
await button?.execute(interaction);
}
}
import { InteractionHandler, InteractionHandlerTypes, container, type PieceContext } from '@sapphire/framework';
import type { ButtonInteraction } from 'discord.js';
import type { ButtonExport } from '../../lib/interactions';

export class ButtonHandler extends InteractionHandler {
public constructor(ctx: PieceContext, options: InteractionHandler.Options) {
super(ctx, {
...options,
interactionHandlerType: InteractionHandlerTypes.Button
});
}

public override async parse(interaction: ButtonInteraction) {
const button = container.buttons.get(interaction.customId);
if (!button) return this.none();
return this.some(button);
}

public async run(interaction: ButtonInteraction) {
const button: ButtonExport | undefined = container.buttons.get(interaction.customId as string);
await button?.execute(interaction);
}
}
My buttons are loaded in my container but for some reason nothing is happening once I clic the button. Any hints on why this is happening?
Favna
Favna•2y ago
Sapphire Framework
Buttons | Sapphire
Buttons are components that are clickable. You will recieve an interaction for every click of a button! Here's an
Favna
Favna•2y ago
And they should be in a directory called interaction-handlers (subdirectories are okay) Then as shown in the guide each should have a parse function to match to the command ID or name or whatever you want to check on I'm not sure where it's going from your code. Is parse called? Do you maybe always end in this.none()? Something else? Also you can read the data from this.some(..) in run (second parameter if i remember correctly) so that saves another Map lookup
Want results from more Discord servers?
Add your server