[SUPPORT]: Error from compiler - Issue with button handling

[jbasalone]

Describe Your Question or Issue When i run the compiler it errors on;

src/commands/chat/locking-prefix.ts:41:3 - error TS1005: ',' expected.

41   new ButtonBuilder()
     ~~~

however no comma is required I thought when stacking buttons. Is this a bug? Been trying a few things. But maybe im at the point where i cant see the error. Any help is super appreciated

What Have You Tried? I added row.addComponents (new ButtonBuilder) to the below row. I also tried adding a //@ts-ignore. still angry.

.addComponents(
                new ButtonBuilder()
                        .setCustomID("channel_lock")
                        .setLabel("Lock Channel")
                        .setStyle(ButtonStyle.Danger)
                        .setEmoji("🔓")

Expected Behavior For everything to be successful and money to rain down.

Screenshots/Code Snippets Full Code

import { ComponentModule, RegisterTypes, ComponentTypes} from "../../handler/types/Command";
import { Message,
        EmbedBuilder,
        ButtonBuilder,
        MessageButton,
        ButtonInteraction,
        PerrmissionFlagBits,
        ButtonStyle
} from "discord.js";
const {addedusers, getisland} = require('~/ep_bot/extras/functions');

export = {
    name: "lock",
    aliases: ["unlock"],
    type: CommandTypes.PrefixCommand,
    channelWhitelist:["1147233774938107966"],
    ownerOnly: true,
    async execute(message: Message): Promise<void> {
        let island = await getisland(msg.channel.id)
        let owner = msg.guild.members.cache.get(island.user)
        let addids = await addedusers(channel.id)
        let userlist = " "
                for (let i = 0;i < channelFavs.length; i++) {
                        userlist = await userlist.concat(`\n ${i+1}, <@!${addids[i].user}>`)
                }
       let embed = new EmbedBuilder()
                    .setTitle("Channel Locking")
                    .setDescription(`Channel Locking Feature\n
                                    \nMembers Not Affected by Lock:
                                     ${userlist}` )
                    .setColor('#097969')
        const row: any = new ActionRowBuilder()
        .addComponents(
                new ButtonBuilder()
                        .setCustomID("channel_lock")
                        .setLabel("Lock Channel")
                        .setStyle(ButtonStyle.Danger)
                        .setEmoji("🔓")
                new ButtonBuilder()
                        .setCustomID("channel_unlock")
                        .setLabel("Unlock Channel")
                        .setStyle(ButtonStyle.Success)
                        .setEmoji("🔐")
                )
        await interaction.reply({embeds:[embed], components: [row] });
    }
} as PrefixCommandModule;

Button Commands

import { ButtonInteraction, Messages } from "discord.js";
import { ComponentModule, ComponentTypes } from "../../handler/types/Component";

export = {
    id: "channel_lock",
    type: ComponentTypes.Button,
    async execute(interaction: ButtonIteraction): Promise<void>{
            await message.channel.permissionOverwrites.edit(`1143236724718317673`, {ViewChannel: true, SendMessages: false})
    }
} as ComponentModule;

import { ButtonInteraction, Messages} from "discord.js";
import { ComponentModule, ComponentTypes } from "../../handler/types/Component";

export = {
    id: "channel_unlock",
    type: ComponentTypes.Button,
    async execute(interaction: ButtonIteraction): Promise<void>{
            await message.channel.permissionOverwrites.edit(`1143236724718317673`, {ViewChannel: true, SendMessages: false})
    }
} as ComponentModule;

Environment (please complete the following information):

• OS:Ubuntu
• Discord Bot Handler Version: latest
• Node.js Version: v20.12.2
• Discord.js Version: 14.15.2

Additional Context Add any other context or details about the question or issue here.

Would you like to be contacted for further support?

• [x ] Yes
• [ ] No

[lukazbaum]

Hello, I checked your locking-prefix command and noticed a few small errors.

1. You're missing some imports:

   import { CommandTypes, PrefixCommandModule } from "../../handler/types/Command";
   import { ActionRowBuilder } from "discord.js";

2. Typo in ButtonBuilder:

   // You typed "...ID"
   .setCustomID("channel_lock")
   // But it's "...Id"
   .setCustomId("channel_lock")

3. Missing comma after each button:

   // When adding multiple buttons you need to seperate them with a comma
   // Correct version:
   new ButtonBuilder()
   .setCustomId("channel_lock")
   .setLabel("Lock Channel")
   .setStyle(ButtonStyle.Danger)
   .setEmoji("🔓"),
   new ButtonBuilder()
   .setCustomId("channel_unlock")
   .setLabel("Unlock Channel")
   .setStyle(ButtonStyle.Success)
   .setEmoji("🔐")

4. Use of wrong argument:

   // You used "interaction" which is only used in slash commands and context menus
   await interaction.reply({embeds:[embed], components: [row] });
   // Prefix commands are triggered by messages and thus use "message"
   await message.reply({embeds:[embed], components: [row] });

Version (reduced) your code was working for me:

import { CommandTypes, PrefixCommandModule } from "../../handler/types/Command";
import { Message, EmbedBuilder, ButtonBuilder, ButtonStyle, ActionRowBuilder } from "discord.js";

export = {
    name: "lock",
    aliases: ["unlock"],
    type: CommandTypes.PrefixCommand,
    ownerOnly: true,
    async execute(message: Message): Promise<void> {
        let embed = new EmbedBuilder()
            .setTitle("Channel Locking")
            .setDescription(`Channel Locking Feature\n\nMembers Not Affected by Lock:`)
            .setColor('#097969')

        const row: any = new ActionRowBuilder()
            .addComponents(
                new ButtonBuilder()
                    .setCustomId("channel_lock")
                    .setLabel("Lock Channel")
                    .setStyle(ButtonStyle.Danger)
                    .setEmoji("🔓"),
                new ButtonBuilder()
                    .setCustomId("channel_unlock")
                    .setLabel("Unlock Channel")
                    .setStyle(ButtonStyle.Success)
                    .setEmoji("🔐")
            )
        await message.reply({ embeds: [embed], components: [row] });
    }
} as PrefixCommandModule;

[lukazbaum]

I also just checked your button component code and fixed a few errors:

channel_lock:

import { ButtonInteraction, ChannelType } from "discord.js";
import { ComponentModule, ComponentTypes } from "../../handler/types/Component";

export = {
    id: "channel_lock",
    type: ComponentTypes.Button,
    async execute(interaction: ButtonInteraction): Promise<void> {
        if (!interaction.channel) return;
        if (interaction.channel.type !== ChannelType.GuildText) return;

        await interaction.channel.permissionOverwrites.edit(`1143236724718317673`, {
            ViewChannel: true,
            SendMessages: false
        });
    }
} as ComponentModule;

channel_unlock:

import { ButtonInteraction, ChannelType } from "discord.js";
import { ComponentModule, ComponentTypes } from "../../handler/types/Component";

export = {
    id: "channel_unlock",
    type: ComponentTypes.Button,
    async execute(interaction: ButtonInteraction): Promise<void> {
        if (!interaction.channel) return;
        if (interaction.channel.type !== ChannelType.GuildText) return;

        await interaction.channel.permissionOverwrites.edit(`1143236724718317673`, {
            ViewChannel: true,
            SendMessages: false
        });
    }
} as ComponentModule;

[jbasalone]

Well i feel dumb.

I’ve never worked with the interactions / buttons so definitely been working to navigate learning and the handlers. I didnt realize you had to add commas, cause i dont in the normal embeds.

I cant tell ya how much I appreciate you looking at everything. <3 thank you.

[lukazbaum]

Anytime ^^

[jbasalone]

one more quick question. Do I need to add a defer statement or set a timeout or should the handler do that? The buttons work and changes the perms, I can see in the console log but the embed throws an interaction timeout

[jbasalone]

nm I added these lines and it updates the message and the interaction doesnt fail

         await interaction.deferReply()
            await interaction.channel.permissionOverwrites.edit(`1143236724718317673`, {
                    SendMessages: false
           })
                .then(channel => console.log(channel.permissionOverwrites.cache.get('1143236724718317673')))
                .catch(console.error);
            await interaction.editReply('Channel is Locked')
                .then(console.log)
                .catch(console.error);