The "awaitModalSubmit" method does not work properly (Undefined)! || Discord.js V.14

This is my code:

async function createTicketModal(interaction, ticketType) {
      if (interaction.deferred || interaction.replied) {
        // Interaction has already been replied to or deferred
        return;
      }
    
      const modal = new ModalBuilder()
        .setCustomId('ticketModal')
        .setTitle(`${ticketType} - Ticket`);
    
      const questionModal = new TextInputBuilder()
        .setCustomId('questionModal')
        .setLabel('Please describe your problem.')
        .setStyle(TextInputStyle.Paragraph);
    
      const firstActionRow = new ActionRowBuilder().addComponents(questionModal);
    
      modal.addComponents(firstActionRow);
    
      const modalMessage = await interaction.showModal(modal);
    
      try {
        const modalResponse = await modalMessage.awaitModalSubmit({
          filter: (interaction) =>
            interaction.customId === 'ticketModal' && interaction.user.id === interaction.user.id,
          time: 60000,
        });
    
        if (modalResponse.isMessageComponent()) {
          const description = modalResponse.values[0];
    
          const channel = await interaction.guild.channels.create(`${interaction.user.username}-ticket`, {
            type: 'text',
            //parent: 'PUT_YOUR_CATEGORY_ID_HERE', // Replace with the ID of the category you want to create the ticket channel in
            permissionOverwrites: [
              {
                id: interaction.guild.id,
                deny: 'VIEW_CHANNEL',
              },
              {
                id: interaction.user.id,
                allow: ['VIEW_CHANNEL', 'SEND_MESSAGES', 'ATTACH_FILES'],
              },
            ],
          });
    
          if (!channel.isText()) {
            await modalMessage.editReply({
              content: `Failed to create a text channel for your ${ticketType} ticket.`,
              embeds: [],
              components: [],
            });
            return;
          }
    
          const embed = new EmbedBuilder()
            .setTitle(`${ticketType} Ticket`)
            .setDescription(`Problem Description: ${description}`)
            .setColor('#0099ff')
            .build();
    
          await channel.send(`${interaction.user}`, { embeds:  });
    
          // Close the modal by updating the interaction with an empty array of components
          await modalMessage.editReply({ components: [] });
        }
      } catch (error) {
        console.error(error);
        await modalMessage.editReply({
          content: `An error occurred while creating your ${ticketType} ticket. Please try again later.`,
          embeds: [],
          components: [],
        });
      }
    }              

When running the command (/ticket) the bot sends an embed message with 4 buttons. When clicking on one of the buttons it must show a modal asking ‘Please describe your problem’. But the problem is when I click on one of the buttons it returns an error in the console/terminal:

TypeError: Cannot read properties of undefined (reading 'awaitModalSubmit')
    at createTicketModal (C:\---\Commands\Info\ticket-sys.js:90:50)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async InteractionCollector.<anonymous> (C:\---\Commands\Info\ticket-sys.js:48:15)
C:\---\Commands\Info\ticket-sys.js:136
        await modalMessage.editReply({
                           ^

TypeError: Cannot read properties of undefined (reading 'editReply')
    at createTicketModal (C:\---\Commands\Info\ticket-sys.js:136:28)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async InteractionCollector.<anonymous> (C:\---\Commands\Info\ticket-sys.js:48:15)

Node.js v18.12.1

NOTE:

I used to have a collector but I replaced it with the awaitModalSubmit method.

>Solution :

showModal doesn’t return anything, so modalMessage is undefined. awaitModalSubmit is available on CommandInteraction so something like the snippet below should work. Also, you shouldn’t use the same variable name (interaction) inside your filter as interaction.user.id === interaction.user.id won’t work.

await interaction.awaitModalSubmit({
  filter: (i) =>
    i.customId === "ticketModal" &&
    i.user.id === interaction.user.id,
  time: 60000,
});