[nextgen/cardstack] use component listener to handle timeout (avoids desync issues)

commands/message/dev/test.js

@@ -29,6 +29,7 @@ module.exports = {
         pageNumberGenerator: (pg)=>{
           return `Test ${pg.index}`
         },
+        expires: 10000,
         interactive: {
           always_active_button: {
             type: InteractiveComponentTypes.BUTTON,

labscore/cardstack/stack.js

@@ -63,6 +63,7 @@ class DynamicCardStack {
     this.ephemeral = options.ephemeral || false;
 
     this.rootIndex = this.index;
+    this.killed = false;
 
     this.stackCache = {};
     this.pageState = [];
@@ -70,11 +71,6 @@ class DynamicCardStack {
 
     this.currentComponentsBatch = {};
 
-    /*
-    this.lastInteraction = Date.now();
-    this.spawned = 0;
-    */
-
     return this._spawn();
   }
 
@@ -82,10 +78,10 @@ class DynamicCardStack {
    * Kills the dynamic card stack.
    */
   async kill(clearComponents) {
-    clearTimeout(this.timeout);
-
     this.listener.clear();
-    if (clearComponents) await this._edit(this.getCurrentCard(), [])
+    if (clearComponents && !this.killed) await this._edit(this.getCurrentCard(), [])
+
+    this.killed = true;
 
     // Remove reference to free the cardstack for GC
     activeStacks.delete(this.context.message || this.context.interaction);
@@ -115,29 +111,6 @@ class DynamicCardStack {
     activeStacks.set(this.context.message || this.context.interaction, this);
   }
 
-  /**
-   * Creates a timeout for the paginator.
-   * TODO: make this work properly
-   * @returns {number} Timeout
-   * @private
-   */
-  _createTimeout() {
-    return setTimeout(async () => {
-      /*
-      // This currently isn't doable with our Components listener.
-      if(this.spawned - this.lastInteraction <= this.expires){
-        clearTimeout(this.timeout)
-        this.spawned = Date.now();
-        // New expiry time is 30 seconds
-        this.expires = 30*1000;
-        this.timeout = this._createTimeout();
-      } else {
-        this.kill(true);
-      }*/
-      await this.kill(true);
-    }, this.expires)
-  }
-
   /**
    * Creates a new cardstack in the given channel
    * @private
@@ -156,13 +129,12 @@ class DynamicCardStack {
       onError: (e) => {
         console.error("Component Handler Exception:")
         console.error(e)
+      },
+      onTimeout: (e)=> {
+        this.kill(true);
       }
     })
 
-    this.timeout = this._createTimeout()
-
-    //this.spawned = Date.now()
-
     if (createMessage) return this._edit({
       ...this.getCurrentCard(),
       components: this.listener