Collector buttons work but just once

Hello! I'm working on a leaderboard system that lets you swap through pages by clicking buttons as a menu of sorts. It seems to work fine enough the first time you click a button (with the slight annoyance that the three loading dots disappear way too early). By the second time something goes off, and the bot crashes with a DiscordAPIError[10062]: Unknown interaction error. Anyone got an idea of why that might be?
async createLeaderboardCollector(rankingData, interaction, channel, client, karmaData, page, pageLength) {

const filter = (i) => i.user.id === interaction.user.id;
const time = 1000 * 60 * 5;

const collector = channel.createMessageComponentCollector({ filter, time });

collector.on('collect', async (newInt) => {

if (!newInt) { return; }
await newInt.deferUpdate(); // Crashes on this line!

if (newInt.customId !== 'prev_leader' && newInt.customId !== 'next_leader') return;

if (newInt.customId === 'prev_leader' && page > 0) {
page -= 1;
} else if (newInt.customId === 'next_leader' && page < pageLength) {
page += 1;
}

await this.createLeaderboardEmbed(rankingData, newInt, channel, client, karmaData, page);
});
}

async createLeaderboardEmbed(rankingData, interaction, channel, client, karmaData, page) {

// Irrelevant stuff ommited
// Embed creation, database querying, etc

const row = await this.createButtonRow(page, pageLength);

await interaction.editReply({ embeds: [embed], components: [row]});
await this.createLeaderboardCollector(rankingData, interaction, channel, client, karmaData, page, pageLength);
}
async createLeaderboardCollector(rankingData, interaction, channel, client, karmaData, page, pageLength) {

const filter = (i) => i.user.id === interaction.user.id;
const time = 1000 * 60 * 5;

const collector = channel.createMessageComponentCollector({ filter, time });

collector.on('collect', async (newInt) => {

if (!newInt) { return; }
await newInt.deferUpdate(); // Crashes on this line!

if (newInt.customId !== 'prev_leader' && newInt.customId !== 'next_leader') return;

if (newInt.customId === 'prev_leader' && page > 0) {
page -= 1;
} else if (newInt.customId === 'next_leader' && page < pageLength) {
page += 1;
}

await this.createLeaderboardEmbed(rankingData, newInt, channel, client, karmaData, page);
});
}

async createLeaderboardEmbed(rankingData, interaction, channel, client, karmaData, page) {

// Irrelevant stuff ommited
// Embed creation, database querying, etc

const row = await this.createButtonRow(page, pageLength);

await interaction.editReply({ embeds: [embed], components: [row]});
await this.createLeaderboardCollector(rankingData, interaction, channel, client, karmaData, page, pageLength);
}
9 Replies
d.js toolkit
d.js toolkit7mo 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! - Marked as resolved by staff
Honie
Honie7mo ago
Using djs 14.14.1 and node 9.5.0. Error trace:
/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:722
throw new DiscordAPIError(data, "code" in data ? data.code : data.error, status, method, url, requestData);
^

DiscordAPIError[10062]: Unknown interaction
at handleErrors (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:722:13)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async BurstHandler.runRequest (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:826:23)
at async _REST.request (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:1266:22)
at async ButtonInteraction.deferUpdate (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/discord.js/src/structures/interfaces/InteractionResponses.js:200:5)
at async InteractionCollector.<anonymous> (/mnt/c/Users/Honie/Documents/Retool JS/classes/ranking.js:120:4) {
requestBody: { files: undefined, json: { type: 6 } },
rawError: { message: 'Unknown interaction', code: 10062 },
code: 10062,
status: 404,
method: 'POST',
url: '[...]'
}
/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:722
throw new DiscordAPIError(data, "code" in data ? data.code : data.error, status, method, url, requestData);
^

DiscordAPIError[10062]: Unknown interaction
at handleErrors (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:722:13)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async BurstHandler.runRequest (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:826:23)
at async _REST.request (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/@discordjs/rest/dist/index.js:1266:22)
at async ButtonInteraction.deferUpdate (/mnt/c/Users/Honie/Documents/Retool JS/node_modules/discord.js/src/structures/interfaces/InteractionResponses.js:200:5)
at async InteractionCollector.<anonymous> (/mnt/c/Users/Honie/Documents/Retool JS/classes/ranking.js:120:4) {
requestBody: { files: undefined, json: { type: 6 } },
rawError: { message: 'Unknown interaction', code: 10062 },
code: 10062,
status: 404,
method: 'POST',
url: '[...]'
}
Honie
Honie7mo ago
Demo, for bonus points. Takes forever because it needs to fetch usernames from an ID.
No description
ayman
ayman7mo ago
Nice use of fields features for your leaderboard love it
Honie
Honie7mo ago
Thank you thank youu!
d.js docs
d.js docs7mo ago
Common causes of DiscordAPIError[10062]: Unknown interaction: - Initial response took more than 3 seconds ➞ defer the response *. - Wrong interaction object inside a collector. - Two processes handling the same command (the first consumes the interaction, so it won't be valid for the other instance) * Note: you cannot defer modal or autocomplete value responses
Honie
Honie7mo ago
I might be missing something but I'm nto sure if any of these apply? The response is being deferred (it just crashes on the second go), and there are two interactions inside the function but they've got different names Maybe I'm misunderstanding the third but the new interaction created by the collection is passed to the function that generates the embed and back to a newly created collection, so I'm not sure where the issue lies
d.js docs
d.js docs7mo ago
If you are waiting for button or select menu input from a specific message, don't create the collector on the channel. - Channel collectors return component interactions for any component within that channel.
- <Channel>.createMessageComponentCollector(…)
+ <Message>.createMessageComponentCollector(…)
- <Channel>.createMessageComponentCollector(…)
+ <Message>.createMessageComponentCollector(…)
Honie
Honie7mo ago
Okay, so the good part is that the max: 1 setting worked! Thanks a ton The not-so-great part is that I don't really have a message? interaction.message returns null, it being a slash command and all - don't think I've got a choice but to use interaction.channel Hold on, I might be stupid - Ayup, that makes sense. Had to base it on the message I'm supposed to be editing, had a bit of a brainfart there But yeah, thank you! Would have never figured it out myself :)