component events

library/internal/interaction.ts

@@ -1,32 +1,35 @@
+import type { ComponentEvent } from "../core/component-event"
+import type { ButtonClickEvent, SelectChangeEvent } from "../main"
 import type { Message, MessageOptions } from "./message"
 
 export type Interaction = CommandInteraction | ComponentInteraction
+export type ComponentInteraction = ButtonInteraction | SelectInteraction
 
-export type CommandInteraction = {
-  type: "command"
+export type CommandInteraction = BaseInteraction<"command">
+
+export type ButtonInteraction = BaseComponentInteraction<
+  "button",
+  ButtonClickEvent
+>
+
+export type SelectInteraction = BaseComponentInteraction<
+  "select",
+  SelectChangeEvent
+>
+
+export type BaseInteraction<Type extends string> = {
+  type: Type
   id: string
-  channelId: string
   reply(messageOptions: MessageOptions): Promise<Message>
   followUp(messageOptions: MessageOptions): Promise<Message>
 }
 
-export type ComponentInteraction = ButtonInteraction | SelectInteraction
-
-export type ButtonInteraction = {
-  type: "button"
-  id: string
-  channelId: string
+export type BaseComponentInteraction<
+  Type extends string,
+  Event extends ComponentEvent,
+> = BaseInteraction<Type> & {
+  event: Event
   customId: string
   update(options: MessageOptions): Promise<void>
   deferUpdate(): Promise<void>
 }
-
-export type SelectInteraction = {
-  type: "select"
-  id: string
-  channelId: string
-  customId: string
-  values: string[]
-  update(options: MessageOptions): Promise<void>
-  deferUpdate(): Promise<void>
-}

library/internal/limited-collection.ts

@@ -0,0 +1,24 @@
+export class LimitedCollection<T> {
+  private items: T[] = []
+
+  constructor(private readonly size: number) {}
+
+  add(item: T) {
+    if (this.items.length >= this.size) {
+      this.items.shift()
+    }
+    this.items.push(item)
+  }
+
+  has(item: T) {
+    return this.items.includes(item)
+  }
+
+  values(): readonly T[] {
+    return this.items
+  }
+
+  [Symbol.iterator]() {
+    return this.items[Symbol.iterator]()
+  }
+}

library/internal/renderers/interaction-reply-renderer.ts

@@ -1,4 +1,4 @@
-import type { CommandInteraction } from "../interaction"
+import type { Interaction } from "../interaction"
 import type { Message, MessageOptions } from "../message"
 import { Renderer } from "./renderer"
 
@@ -6,8 +6,8 @@ import { Renderer } from "./renderer"
 // so we know whether to call reply() or followUp()
 const repliedInteractionIds = new Set<string>()
 
-export class CommandReplyRenderer extends Renderer {
-  constructor(private interaction: CommandInteraction) {
+export class InteractionReplyRenderer extends Renderer {
+  constructor(private interaction: Interaction) {
     super()
   }
 

library/internal/renderers/renderer.ts

@@ -4,10 +4,10 @@ import { Container } from "../container.js"
 import type { ComponentInteraction } from "../interaction"
 import type { Message, MessageOptions } from "../message"
 import type { Node } from "../node.js"
-import { Timeout } from "../timeout"
 
 type UpdatePayload =
   | { action: "update" | "deactivate"; options: MessageOptions }
+  | { action: "deferUpdate"; interaction: ComponentInteraction }
   | { action: "destroy" }
 
 export abstract class Renderer {
@@ -21,10 +21,6 @@ export abstract class Renderer {
     .pipe(concatMap((payload) => this.updateMessage(payload)))
     .subscribe({ error: console.error })
 
-  private deferUpdateTimeout = new Timeout(500, () => {
-    this.componentInteraction?.deferUpdate().catch(console.error)
-  })
-
   render() {
     if (!this.active) {
       console.warn("Attempted to update a deactivated message")
@@ -52,7 +48,11 @@ export abstract class Renderer {
 
   handleComponentInteraction(interaction: ComponentInteraction) {
     this.componentInteraction = interaction
-    this.deferUpdateTimeout.run()
+
+    setTimeout(() => {
+      this.updates.next({ action: "deferUpdate", interaction })
+    }, 500)
+
     for (const node of this.nodes) {
       if (node.handleComponentInteraction(interaction)) {
         return true
@@ -87,10 +87,14 @@ export abstract class Renderer {
       return
     }
 
+    if (payload.action === "deferUpdate") {
+      await payload.interaction.deferUpdate()
+      return
+    }
+
     if (this.componentInteraction) {
       const promise = this.componentInteraction.update(payload.options)
       this.componentInteraction = undefined
-      this.deferUpdateTimeout.cancel()
       await promise
       return
     }