Why Modal Isn't Open

const { MessageActionRow, MessageButton, Modal, TextInputComponent } = require('discord.js');

module.exports = {
    name: 'panel',
    description: 'Send Panel',
    run: async (client, interaction) => {
        try {
            const button1 = new MessageButton()
                .setCustomId('btn1')
                .setLabel('Avatar')
                .setStyle('PRIMARY'); 
            const button2 = new MessageButton()
                .setCustomId('btn2')
                .setLabel('Banner')
                .setStyle('PRIMARY'); 

            const button3 = new MessageButton()
                .setCustomId('btn3')
                .setLabel('User')
                .setStyle('PRIMARY'); 

            const button4 = new MessageButton()
                .setCustomId('btn4')
                .setLabel('Download')
                .setStyle('PRIMARY'); 

            const row = new MessageActionRow().addComponents(button1, button2, button3, button4);

            const embed = {
                color: 0x00000,
                title: '**لوحة التحكم**',
                thumbnail: {
                    url: 'https://images-ext-1.discordapp.net/external/f94w4Kx7LEwxrt7Po7bYzflGr20B_til4p1WuxUHGsY/https/res.cloudinary.com/ferv/image/upload/v1698479059/icons/nhzok0alt9fhorojec0b.png?format=webp&quality=lossless&width=473&height=473',
                },
                description: 'للحصول على افتار شخص أو البنر أو لتحميل مقاطع الفيديو من التيك توك أو الإنستقرام أو اليوتيوب استخدم الأزرار',
            };

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

            const collector = interaction.channel.createMessageComponentCollector({
                componentType: 'BUTTON',
            });

            collector.on('collect', async i => {
                if (i.customId === 'btn1') {
                    const modal = new Modal()
                        .setCustomId('myModal')
                        .setTitle('My Modal');

                    const idform = new TextInputComponent()
                        .setCustomId('idd')
                        .setLabel("يرجى ادخال ايدي الشخص")
                      

                    const firstActionRow = new MessageActionRow().addComponents(idform);

                    modal.addComponents(firstActionRow);
                    await i.reply({ content: " ", components: [modal] });
                }
            });
        } catch (error) {
            console.error(error);
            await interaction.reply({ content: 'حدث خطأ أثناء معالجة الطلب.', ephemeral: true });
        }
    },
};

const { MessageActionRow, MessageButton, Modal, TextInputComponent } = require('discord.js');

module.exports = {
    name: 'panel',
    description: 'Send Panel',
    run: async (client, interaction) => {
        try {
            const button1 = new MessageButton()
                .setCustomId('btn1')
                .setLabel('Avatar')
                .setStyle('PRIMARY'); 
            const button2 = new MessageButton()
                .setCustomId('btn2')
                .setLabel('Banner')
                .setStyle('PRIMARY'); 

            const button3 = new MessageButton()
                .setCustomId('btn3')
                .setLabel('User')
                .setStyle('PRIMARY'); 

            const button4 = new MessageButton()
                .setCustomId('btn4')
                .setLabel('Download')
                .setStyle('PRIMARY'); 

            const row = new MessageActionRow().addComponents(button1, button2, button3, button4);

            const embed = {
                color: 0x00000,
                title: '**لوحة التحكم**',
                thumbnail: {
                    url: 'https://images-ext-1.discordapp.net/external/f94w4Kx7LEwxrt7Po7bYzflGr20B_til4p1WuxUHGsY/https/res.cloudinary.com/ferv/image/upload/v1698479059/icons/nhzok0alt9fhorojec0b.png?format=webp&quality=lossless&width=473&height=473',
                },
                description: 'للحصول على افتار شخص أو البنر أو لتحميل مقاطع الفيديو من التيك توك أو الإنستقرام أو اليوتيوب استخدم الأزرار',
            };

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

            const collector = interaction.channel.createMessageComponentCollector({
                componentType: 'BUTTON',
            });

            collector.on('collect', async i => {
                if (i.customId === 'btn1') {
                    const modal = new Modal()
                        .setCustomId('myModal')
                        .setTitle('My Modal');

                    const idform = new TextInputComponent()
                        .setCustomId('idd')
                        .setLabel("يرجى ادخال ايدي الشخص")
                      

                    const firstActionRow = new MessageActionRow().addComponents(idform);

                    modal.addComponents(firstActionRow);
                    await i.reply({ content: " ", components: [modal] });
                }
            });
        } catch (error) {
            console.error(error);
            await interaction.reply({ content: 'حدث خطأ أثناء معالجة الطلب.', ephemeral: true });
        }
    },
};