discord.js - Imagine an app•2y ago

Interaction Failed Async

Hello! i have no clue how to await an interaction in V14, but after trying, the code that is attached is what i came with. however, it's simply not updating the interaction, nor is it printing my console logs which is causing me so much confusion notlikethis

anyone that could point me to the right direction (no docs please, I've already read it like 4 times, and i'm understanding less the more I read it)

const { SlashCommandBuilder, EmbedBuilder, ActionRowBuilder, ButtonBuilder, ButtonStyle } = require('discord.js');
const axios = require('axios');

async function fetchAndSortEvents() {
    let options = {
        method: "POST",
        url: "<Definitely not a Link placeholder>",
        headers: {
            cookie: "<Nom Nom Cookies>",
            "content-type": "application/json"
        },
        data: {
            query: "<Yay a Query>",
            variables: null,
            operationName: "Events"
        }
    };

    try {
        const response = await axios.request(options);
        const events = response.data.data.events;
        events.sort((a, b) => b.id - a.id);
        return events;
    } catch (error) {
        console.error(error);
    }
}

function displayEvents(events, startIndex, endIndex) {
    let result = 'Event ID | Event Name\n';
    for (let i = startIndex; i < endIndex; i++) {
        result += `${events[i].id} | ${events[i].displayName}\n`;
    }
    return result;
}

module.exports = {
    data: new SlashCommandBuilder()
        .setName('arenagamesfetch')
        .setDescription('Fetches and displays the latest 10 Arena Games events'),
    async execute(interaction) {
        const events = await fetchAndSortEvents();
        let startIndex = 0;
        let endIndex = 10;

        const result = displayEvents(events, startIndex, endIndex);
        const embed = new EmbedBuilder()
            .setTitle('Latest Arena Games Events')
            .setThumbnail('<Thumbnail Link>')
            .setDescription(result);


        const row = new ActionRowBuilder()
            .addComponents(
                new ButtonBuilder()
                    .setCustomId('listPrev')
                    .setLabel('Previous')
                    .setStyle(ButtonStyle.Primary),
                new ButtonBuilder()
                    .setCustomId('listNext')
                    .setLabel('Next')
                    .setStyle(ButtonStyle.Primary),
            );

        await interaction.reply({ embeds: [embed], components: [row] });

        const filter = i => i.customId === 'previous' || i.customId === 'next';
        const collector = interaction.channel.createMessageComponentCollector({ filter, time: 15000 });

        collector.on('collect', async i => {
            try {
                if (i.customId === 'listPrev') {
                    startIndex -= 10;
                    endIndex -= 10;
                    if (startIndex < 0) startIndex = 0;
                    if (endIndex < 10) endIndex = 10;
                    console.error("Previoused");
                } else if (i.customId === 'listNext') {
                    startIndex += 10;
                    endIndex += 10;
                    if (startIndex > events.length - 1) startIndex = events.length - 1;
                    if (endIndex > events.length) endIndex = events.length;
                    console.error("Nexted");
                }
            } catch (error) {
                console.error(error);
            }


            const result = displayEvents(events, startIndex, endIndex);
            embed.setDescription(result);
            await i.update({ embeds: [embed], components: [row] });
        });
    },
};

const { SlashCommandBuilder, EmbedBuilder, ActionRowBuilder, ButtonBuilder, ButtonStyle } = require('discord.js');
const axios = require('axios');

async function fetchAndSortEvents() {
    let options = {
        method: "POST",
        url: "<Definitely not a Link placeholder>",
        headers: {
            cookie: "<Nom Nom Cookies>",
            "content-type": "application/json"
        },
        data: {
            query: "<Yay a Query>",
            variables: null,
            operationName: "Events"
        }
    };

    try {
        const response = await axios.request(options);
        const events = response.data.data.events;
        events.sort((a, b) => b.id - a.id);
        return events;
    } catch (error) {
        console.error(error);
    }
}

function displayEvents(events, startIndex, endIndex) {
    let result = 'Event ID | Event Name\n';
    for (let i = startIndex; i < endIndex; i++) {
        result += `${events[i].id} | ${events[i].displayName}\n`;
    }
    return result;
}

module.exports = {
    data: new SlashCommandBuilder()
        .setName('arenagamesfetch')
        .setDescription('Fetches and displays the latest 10 Arena Games events'),
    async execute(interaction) {
        const events = await fetchAndSortEvents();
        let startIndex = 0;
        let endIndex = 10;

        const result = displayEvents(events, startIndex, endIndex);
        const embed = new EmbedBuilder()
            .setTitle('Latest Arena Games Events')
            .setThumbnail('<Thumbnail Link>')
            .setDescription(result);


        const row = new ActionRowBuilder()
            .addComponents(
                new ButtonBuilder()
                    .setCustomId('listPrev')
                    .setLabel('Previous')
                    .setStyle(ButtonStyle.Primary),
                new ButtonBuilder()
                    .setCustomId('listNext')
                    .setLabel('Next')
                    .setStyle(ButtonStyle.Primary),
            );

        await interaction.reply({ embeds: [embed], components: [row] });

        const filter = i => i.customId === 'previous' || i.customId === 'next';
        const collector = interaction.channel.createMessageComponentCollector({ filter, time: 15000 });

        collector.on('collect', async i => {
            try {
                if (i.customId === 'listPrev') {
                    startIndex -= 10;
                    endIndex -= 10;
                    if (startIndex < 0) startIndex = 0;
                    if (endIndex < 10) endIndex = 10;
                    console.error("Previoused");
                } else if (i.customId === 'listNext') {
                    startIndex += 10;
                    endIndex += 10;
                    if (startIndex > events.length - 1) startIndex = events.length - 1;
                    if (endIndex > events.length) endIndex = events.length;
                    console.error("Nexted");
                }
            } catch (error) {
                console.error(error);
            }


            const result = displayEvents(events, startIndex, endIndex);
            embed.setDescription(result);
            await i.update({ embeds: [embed], components: [row] });
        });
    },
};

15 Replies

d.js toolkit•2y ago

• What's your exact discord.js npm list discord.js and node node -v version? • Post the full error stack trace, not just the top part! • Show your code! • Explain what exactly your issue is. • Not a discord.js issue? Check out #useful-servers.

KubiOP•2y ago

`-- [email protected] v18.12.1

for the curious oh also! i recently updated from V13 to V14, but i don't see anything V13 related, so, uh, correct me when wrong MonkaStare

Unknown User•2y ago

Message Not Public

KubiOP•2y ago

it should 🤔 maybe i should log that aswell if it actually emits or not

Unknown User•2y ago

Message Not Public

d.js docs•2y 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(…)

Unknown User•2y ago

Message Not Public

KubiOP•2y ago

Changed the following, seems its indeed not emitting

-         await interaction.reply({ embeds: [embed], components: [row] });    
+         const msg = await interaction.reply({ embeds: [embed], components: [row] });



-         const collector = interaction.channel.createMessageComponentCollector({ filter, time: 15000 });    
+         const collector = msg.createMessageComponentCollector({ filter, time: 15000 });
+        collector.on('collect', (interaction) => {
+            console.log('Collector emitted collect event');
+        });
+        collector.on('end', (collected, reason) => {
+            console.log(`Collector stopped collecting interactions. Reason: ${reason}`);
+        });

-         await interaction.reply({ embeds: [embed], components: [row] });    
+         const msg = await interaction.reply({ embeds: [embed], components: [row] });



-         const collector = interaction.channel.createMessageComponentCollector({ filter, time: 15000 });    
+         const collector = msg.createMessageComponentCollector({ filter, time: 15000 });
+        collector.on('collect', (interaction) => {
+            console.log('Collector emitted collect event');
+        });
+        collector.on('end', (collected, reason) => {
+            console.log(`Collector stopped collecting interactions. Reason: ${reason}`);
+        });

Unknown User•2y ago

Message Not Public

KubiOP•2y ago

oh my god, i just realized that i named the previous and next instead of the dumb custom names i gave them

Unknown User•2y ago

Message Not Public

KubiOP•2y ago

yeeees, it works!

Unknown User•2y ago

Message Not Public

KubiOP•2y ago

eventhough it was a silly mistake, i did genuinely learn alot from this, thank you <a:CB_dance_cat:430423973554159629><a:1279_Flying_Hearts_Red:975427205536567316>

Unknown User•2y ago

Message Not Public

Gaming

Programming

Interaction Failed Async