feat: add missing v13 component methods (#7466)

Co-authored-by: Vlad Frangu <kingdgrizzle@gmail.com>
Co-authored-by: Rodry <38259440+ImRodry@users.noreply.github.com>
Co-authored-by: Antonio Román <kyradiscord@gmail.com>

packages/builders/src/components/ActionRow.ts

@@ -2,6 +2,7 @@ import { type APIActionRowComponent, ComponentType, APIMessageComponent } from '
 import type { ButtonComponent, SelectMenuComponent } from '..';
 import { Component } from './Component';
 import { createComponent } from './Components';
+import isEqual from 'fast-deep-equal';
 
 export type MessageComponent = ActionRowComponent | ActionRow;
 
@@ -46,4 +47,14 @@ export class ActionRow<T extends ActionRowComponent = ActionRowComponent> extend
 			components: this.components.map((component) => component.toJSON()),
 		};
 	}
+
+	public equals(other: APIActionRowComponent<APIMessageComponent> | ActionRow) {
+		if (other instanceof ActionRow) {
+			return isEqual(other.data, this.data) && isEqual(other.components, this.components);
+		}
+		return isEqual(other, {
+			...this.data,
+			components: this.components.map((component) => component.toJSON()),
+		});
+	}
 }

packages/builders/src/components/Component.ts

@@ -1,5 +1,11 @@
 import type { JSONEncodable } from '../util/jsonEncodable';
-import type { APIBaseComponent, APIMessageComponent, ComponentType } from 'discord-api-types/v9';
+import type {
+	APIActionRowComponentTypes,
+	APIBaseComponent,
+	APIMessageComponent,
+	ComponentType,
+} from 'discord-api-types/v9';
+import type { Equatable } from '../util/equatable';
 
 /**
  * Represents a discord component
@@ -8,18 +14,17 @@ export abstract class Component<
 	DataType extends Partial<APIBaseComponent<ComponentType>> & {
 		type: ComponentType;
 	} = APIBaseComponent<ComponentType>,
-> implements JSONEncodable<APIMessageComponent>
+> implements JSONEncodable<APIMessageComponent>, Equatable<Component | APIActionRowComponentTypes>
 {
 	/**
 	 * The API data associated with this component
 	 */
 	protected readonly data: DataType;
 
-	/**
-	 * Converts this component to an API-compatible JSON object
-	 */
 	public abstract toJSON(): APIMessageComponent;
 
+	public abstract equals(other: Component | APIActionRowComponentTypes): boolean;
+
 	public constructor(data: DataType) {
 		this.data = data;
 	}

packages/builders/src/components/button/UnsafeButton.ts

@@ -7,6 +7,7 @@ import {
 	type APIButtonComponentWithCustomId,
 } from 'discord-api-types/v9';
 import { Component } from '../Component';
+import isEqual from 'fast-deep-equal';
 
 /**
  * Represents a non-validated button component
@@ -118,4 +119,11 @@ export class UnsafeButtonComponent extends Component<Partial<APIButtonComponent>
 			...this.data,
 		} as APIButtonComponent;
 	}
+
+	public equals(other: APIButtonComponent | UnsafeButtonComponent) {
+		if (other instanceof UnsafeButtonComponent) {
+			return isEqual(other.data, this.data);
+		}
+		return isEqual(other, this.data);
+	}
 }

packages/builders/src/components/selectMenu/UnsafeSelectMenu.ts

@@ -1,6 +1,7 @@
-import { ComponentType, type APISelectMenuComponent } from 'discord-api-types/v9';
+import { APISelectMenuOption, ComponentType, type APISelectMenuComponent } from 'discord-api-types/v9';
 import { Component } from '../Component';
 import { UnsafeSelectMenuOption } from './UnsafeSelectMenuOption';
+import isEqual from 'fast-deep-equal';
 
 /**
  * Represents a non-validated select menu component
@@ -101,8 +102,12 @@ export class UnsafeSelectMenuComponent extends Component<
 	 * @param options The options to add to this select menu
 	 * @returns
 	 */
-	public addOptions(...options: UnsafeSelectMenuOption[]) {
-		this.options.push(...options);
+	public addOptions(...options: (UnsafeSelectMenuOption | APISelectMenuOption)[]) {
+		this.options.push(
+			...options.map((option) =>
+				option instanceof UnsafeSelectMenuOption ? option : new UnsafeSelectMenuOption(option),
+			),
+		);
 		return this;
 	}
 
@@ -110,8 +115,14 @@ export class UnsafeSelectMenuComponent extends Component<
 	 * Sets the options on this select menu
 	 * @param options The options to set on this select menu
 	 */
-	public setOptions(...options: UnsafeSelectMenuOption[]) {
-		this.options.splice(0, this.options.length, ...options);
+	public setOptions(...options: (UnsafeSelectMenuOption | APISelectMenuOption)[]) {
+		this.options.splice(
+			0,
+			this.options.length,
+			...options.map((option) =>
+				option instanceof UnsafeSelectMenuOption ? option : new UnsafeSelectMenuOption(option),
+			),
+		);
 		return this;
 	}
 
@@ -122,4 +133,14 @@ export class UnsafeSelectMenuComponent extends Component<
 			options: this.options.map((o) => o.toJSON()),
 		} as APISelectMenuComponent;
 	}
+
+	public equals(other: APISelectMenuComponent | UnsafeSelectMenuComponent): boolean {
+		if (other instanceof UnsafeSelectMenuComponent) {
+			return isEqual(other.data, this.data) && isEqual(other.options, this.options);
+		}
+		return isEqual(other, {
+			...this.data,
+			options: this.options.map((o) => o.toJSON()),
+		});
+	}
 }