Search code examples
new-operator

Creating an Embed with a button that will send 2 different messages to 2 different Channels once the button is clicked

TypeError: embed.addComponents is not a constructor
    at Object.execute (C:\Users\hecto\Desktop\Davey Jones\commands\Onboarding\clockify-request.js:85:5)
    at Object.execute (C:\Users\hecto\Desktop\Davey Jones\events\interactionCreate.js:18:21)
    at Client.<anonymous> (C:\Users\hecto\Desktop\Davey Jones\index.js:67:46)
    at Client.emit (node:events:514:28)
    at InteractionCreateAction.handle (C:\Users\hecto\Desktop\Davey Jones\node_modules\discord.js\src\client\actions\InteractionCreate.js:97:12)
    at module.exports [as INTERACTION_CREATE] (C:\Users\hecto\Desktop\Davey Jones\node_modules\discord.js\src\client\websocket\handlers\INTERACTION_CREATE.js:4:36)
    at WebSocketManager.handlePacket (C:\Users\hecto\Desktop\Davey Jones\node_modules\discord.js\src\client\websocket\WebSocketManager.js:355:31)
    at WebSocketManager.<anonymous> (C:\Users\hecto\Desktop\Davey Jones\node_modules\discord.js\src\client\websocket\WebSocketManager.js:239:12)
    at WebSocketManager.emit (C:\Users\hecto\Desktop\Davey Jones\node_modules\@vladfrangu\async_event_emitter\dist\index.cjs:282:31)
    at WebSocketShard.<anonymous> (C:\Users\hecto\Desktop\Davey Jones\node_modules\@discordjs\ws\dist\index.js:1173:51)

I havent tried much as I am still a novice in the Discord Bot Coding Field. But I have tried changing the inputs, but im not sure I understand what the problem is.

This is the Code for it:

[The Block of Code throwing these errors]

Solution

  • I think you forgot to replace new embed.addComponents() with new ButtonBuilder():

    const row = new ActionRowBuilder().addComponents(
    new ButtonBuilder()
        .setCustomId('requestButton')
        .setLabel('Complete')
        .setStyle('PRIMARY')
);

    To make life easier, here's a function to abstract away the ActionRow and quickly add buttons to your message:

    import { ButtonStyle, ComponentType } from 'discord.js';

// Parameter type hint for VSCode
/** @param {...import('discord.js').APIButtonComponent} buttons */
const buttonRow = (...buttons) => ({
    type: ComponentType.ActionRow,
    components: buttons
});

    Now you can do this:

    const row = buttonRow(
    { custom_id: 'requestButton', label: 'Complete', style: ButtonStyle.Primary },
    // Add more button objects here
);