Migrating to v14 (Typescript)

Hi there I'm having trouble porting this v13 code over to v14

1 const msg = interaction.targetMessage as Message;
2 
3 const components = msg?.components;
4 
5 let row = components.find(
6   (x) => x.components.length < 5
7 );
8 
9 if (!row) {
10   components.push(new MessageActionRow());
11   row = components[components.length - 1];
12 }
13 
14 row.addComponents(button);

1 const msg = interaction.targetMessage as Message;
2 
3 const components = msg?.components;
4 
5 let row = components.find(
6   (x) => x.components.length < 5
7 );
8 
9 if (!row) {
10   components.push(new MessageActionRow());
11   row = components[components.length - 1];
12 }
13 
14 row.addComponents(button);

More specifically, in v14, ActionRow is private and components won't accept ActionRowBuilder because

Type 'ActionRowBuilder<AnyComponentBuilder>' is missing the following properties from type 'ActionRow<MessageActionRowComponent>': type, equals

Type 'ActionRowBuilder<AnyComponentBuilder>' is missing the following properties from type 'ActionRow<MessageActionRowComponent>': type, equals

4 Replies

d.js toolkit•2y ago

- What's your exact discord.js npm list discord.js and node node -v version? - Not a discord.js issue? Check out #other-js-ts. - Consider reading #how-to-get-help to improve your question! - Explain what exactly your issue is. - Post the full error stack trace, not just the top part! - Show your code! - Issue solved? Press the button!

d.js docs•2y ago

In TypeScript the ActionRowBuilder class has a generic type parameter that specifies the type of component the action row holds:

const row = new ActionRowBuilder<ButtonBuilder>().addComponents(button)
const row = new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(selectMenu)
const row = new ActionRowBuilder<TextInputBuilder>().addComponents(textInput)

const row = new ActionRowBuilder<ButtonBuilder>().addComponents(button)
const row = new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(selectMenu)
const row = new ActionRowBuilder<TextInputBuilder>().addComponents(textInput)

net-tech-OP•2y ago

@dghfryuhigrdhuigrehuigre Not related, this is about components on a Message only accepting ActionRow and not allowing ActionRowBuilder

d.js docs•2y ago

Tag suggestion for @nettech: Structures from the API cannot be edited directly. To do so, you can create a new structure (a builder) using the .from() method

const newEmbed = EmbedBuilder.from(embed).setTitle("title")
const newRow = ActionRowBuilder.from(row).addComponents(component)

const newEmbed = EmbedBuilder.from(embed).setTitle("title")
const newRow = ActionRowBuilder.from(row).addComponents(component)

Gaming

Programming

Migrating to v14 (Typescript)