revert: support for nested arrays of components, fix error handling (#6081)

src/structures/BaseMessageComponent.js

@@ -53,11 +53,10 @@ class BaseMessageComponent {
    * Constructs a MessageComponent based on the type of the incoming data
    * @param {MessageComponentOptions} data Data for a MessageComponent
    * @param {Client|WebhookClient} [client] Client constructing this component
-   * @param {boolean} [skipValidation=false] Whether or not to validate the component type
    * @returns {?MessageComponent}
    * @private
    */
-  static create(data, client, skipValidation = false) {
+  static create(data, client) {
     let component;
     let type = data.type;
 
@@ -66,7 +65,7 @@ class BaseMessageComponent {
     switch (type) {
       case MessageComponentTypes.ACTION_ROW: {
         const MessageActionRow = require('./MessageActionRow');
-        component = new MessageActionRow(data);
+        component = new MessageActionRow(data, client);
         break;
       }
       case MessageComponentTypes.BUTTON: {
@@ -82,7 +81,7 @@ class BaseMessageComponent {
       default:
         if (client) {
           client.emit(Events.DEBUG, `[BaseMessageComponent] Received component with unknown type: ${data.type}`);
-        } else if (!skipValidation) {
+        } else {
           throw new TypeError('INVALID_TYPE', 'data.type', 'valid MessageComponentType');
         }
     }

src/structures/Message.js

@@ -572,7 +572,7 @@ class Message extends Base {
    * @property {MessageAttachment[]} [attachments] An array of attachments to keep,
    * all attachments will be kept if omitted
    * @property {FileOptions[]|BufferResolvable[]|MessageAttachment[]} [files] Files to add to the message
-   * @property {MessageActionRow[]|MessageActionRowOptions[]|MessageActionRowComponentResolvable[][]} [components]
+   * @property {MessageActionRow[]|MessageActionRowOptions[]} [components]
    * Action rows containing interactive components for the message (buttons, select menus)
    */
 

src/structures/MessageActionRow.js

@@ -37,15 +37,16 @@ class MessageActionRow extends BaseMessageComponent {
 
   /**
    * @param {MessageActionRow|MessageActionRowOptions} [data={}] MessageActionRow to clone or raw data
+   * @param {Client} [client] The client constructing this MessageActionRow, if provided
    */
-  constructor(data = {}) {
+  constructor(data = {}, client = null) {
     super({ type: 'ACTION_ROW' });
 
     /**
      * The components in this action row
      * @type {MessageActionRowComponent[]}
      */
-    this.components = data.components?.map(c => BaseMessageComponent.create(c, null, true)) ?? [];
+    this.components = data.components?.map(c => BaseMessageComponent.create(c, client)) ?? [];
   }
 
   /**
@@ -54,7 +55,7 @@ class MessageActionRow extends BaseMessageComponent {
    * @returns {MessageActionRow}
    */
   addComponents(...components) {
-    this.components.push(...components.flat(Infinity).map(c => BaseMessageComponent.create(c, null, true)));
+    this.components.push(...components.flat(Infinity).map(c => BaseMessageComponent.create(c)));
     return this;
   }
 
@@ -66,11 +67,7 @@ class MessageActionRow extends BaseMessageComponent {
    * @returns {MessageActionRow}
    */
   spliceComponents(index, deleteCount, ...components) {
-    this.components.splice(
+    this.components.splice(index, deleteCount, ...components.flat(Infinity).map(c => BaseMessageComponent.create(c)));
-      index,
-      deleteCount,
-      ...components.flat(Infinity).map(c => BaseMessageComponent.create(c, null, true)),
-    );
     return this;
   }
 

src/structures/MessagePayload.js

@@ -3,7 +3,6 @@
 const BaseMessageComponent = require('./BaseMessageComponent');
 const MessageEmbed = require('./MessageEmbed');
 const { RangeError } = require('../errors');
-const { MessageComponentTypes } = require('../util/Constants');
 const DataResolver = require('../util/DataResolver');
 const MessageFlags = require('../util/MessageFlags');
 const Util = require('../util/Util');
@@ -138,11 +137,7 @@ class MessagePayload {
       }
     }
 
-    const components = this.options.components?.map(c =>
+    const components = this.options.components?.map(c => BaseMessageComponent.create(c).toJSON());
-      BaseMessageComponent.create(
-        Array.isArray(c) ? { type: MessageComponentTypes.ACTION_ROW, components: c } : c,
-      ).toJSON(),
-    );
 
     let username;
     let avatarURL;

src/structures/Webhook.js

@@ -103,7 +103,7 @@ class Webhook {
    * @property {string} [content] See {@link BaseMessageOptions#content}
    * @property {FileOptions[]|BufferResolvable[]|MessageAttachment[]} [files] See {@link BaseMessageOptions#files}
    * @property {MessageMentionOptions} [allowedMentions] See {@link BaseMessageOptions#allowedMentions}
-   * @property {MessageActionRow[]|MessageActionRowOptions[]|MessageActionRowComponentResolvable[][]} [components]
+   * @property {MessageActionRow[]|MessageActionRowOptions[]} [components]
    * Action rows containing interactive components for the message (buttons, select menus)
    */
 

src/structures/interfaces/TextBasedChannel.js

@@ -63,7 +63,7 @@ class TextBasedChannel {
    * @property {MessageMentionOptions} [allowedMentions] Which mentions should be parsed from the message content
    * (see [here](https://discord.com/developers/docs/resources/channel#allowed-mentions-object) for more details)
    * @property {FileOptions[]|BufferResolvable[]|MessageAttachment[]} [files] Files to send with the message
-   * @property {MessageActionRow[]|MessageActionRowOptions[]|MessageActionRowComponentResolvable[][]} [components]
+   * @property {MessageActionRow[]|MessageActionRowOptions[]} [components]
    * Action rows containing interactive components for the message (buttons, select menus)
    */
 

typings/index.d.ts

@@ -3519,7 +3519,7 @@ export interface MessageEditOptions {
   files?: (FileOptions | BufferResolvable | Stream | MessageAttachment)[];
   flags?: BitFieldResolvable<MessageFlagsString, number>;
   allowedMentions?: MessageMentionOptions;
-  components?: (MessageActionRow | MessageActionRowOptions | MessageActionRowComponentResolvable[])[];
+  components?: (MessageActionRow | MessageActionRowOptions)[];
 }
 
 export interface MessageEmbedAuthor {
@@ -3618,7 +3618,7 @@ export interface MessageOptions {
   nonce?: string | number;
   content?: string | null;
   embeds?: (MessageEmbed | MessageEmbedOptions)[];
-  components?: (MessageActionRow | MessageActionRowOptions | MessageActionRowComponentResolvable[])[];
+  components?: (MessageActionRow | MessageActionRowOptions)[];
   allowedMentions?: MessageMentionOptions;
   files?: (FileOptions | BufferResolvable | Stream | MessageAttachment)[];
   reply?: ReplyOptions;

typings/index.ts

@@ -434,6 +434,7 @@ client.on('interaction', async interaction => {
 
   await interaction.reply({ content: 'Hi!', components: [actionRow] });
 
+  // @ts-expect-error
   await interaction.reply({ content: 'Hi!', components: [[button]] });
 
   // @ts-expect-error