Discord JS V14 problem with modals and my bot

I'm attempting to make a modal which can handle applications but I've ran into a few errors. I have tried asking chatGPT for help and a few discord servers and I am just left to be confused. If anyone it asble to help please do because I have tried so many things and I have hit a dead end.

Here is the code

  SlashCommandBuilder,
  ActionRowBuilder,

  ModalBuilder,
  TextInputBuilder,
  TextInputStyle,
} = require("discord.js");

const channelId = "1124020014924697600";

module.exports = {
  data: new SlashCommandBuilder()
    .setName("apply")
    .setDescription("Apply for TVCO"),

  async execute(interaction, client) {
    const modal = new ModalBuilder()
      .setTitle("TVCO Application")
      .setCustomId('apply');

    const name = new TextInputBuilder()
      .setCustomId("name")
      .setRequired(true)
      .setLabel("Username")
      .setStyle(TextInputStyle.Short)
      .setValue('Default');

    const why = new TextInputBuilder()
      .setCustomId("why")
      .setRequired(true)
      .setLabel("Why do you wish to join?")
      .setStyle(TextInputStyle.Paragraph)
      .setValue('Default');

    const factions = new TextInputBuilder()
      .setCustomId("factions")
      .setRequired(true)
      .setLabel("What factions are you in or were in?")
      .setStyle(TextInputStyle.Paragraph)
      .setValue('Default');

    const profilelink = new TextInputBuilder()
      .setCustomId("proflielink")
      .setRequired(true)
      .setLabel("Please provide your profile link.")
      .setStyle(TextInputStyle.Short)
      .setValue('Default');

    const firstactionrow = new ActionRowBuilder().addComponents(name);
    const secondactionrow = new ActionRowBuilder().addComponents(why);
    const thirdactionrow = new ActionRowBuilder().addComponents(factions);
    const fourthactionrow = new ActionRowBuilder().addComponents(profilelink);

    modal.addComponents(
      firstactionrow,
      secondactionrow,
      thirdactionrow,
      fourthactionrow
    );
    interaction.showModal(modal);

    const channel = client.channels.cache.get(channelId);
    await channel.send({ cotent: "apply", components: [firstactionrow, secondactionrow, thirdactionrow, fourthactionrow], });

    // const row = new ActionRowBuilder().addComponents(
    //   new ButtonBuilder()
    //     .setCustomId("accept")
    //     .setLabel("Accept")
    //     .setStyle("SUCCESS"),
    //   new ButtonBuilder()
    //     .setCustomId("deny")
    //     .setLabel("Deny")
    //     .setStyle("DANGER")
    // );
  },
};

Now the error

DiscordAPIError[50035]: Invalid Form Body
components[0].components[0][UNION_TYPE_CHOICES]: Value of field "type" must be one of (2, 3, 5, 6, 7, 8).
components[1].components[0][UNION_TYPE_CHOICES]: Value of field "type" must be one of (2, 3, 5, 6, 7, 8).
components[2].components[0][UNION_TYPE_CHOICES]: Value of field "type" must be one of (2, 3, 5, 6, 7, 8).
components[3].components[0][UNION_TYPE_CHOICES]: Value of field "type" must be one of (2, 3, 5, 6, 7, 8).
    at handleErrors (C:\Users\aleks\Downloads\BGC_CHECK\node_modules\@discordjs\rest\dist\index.js:640:13)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async SequentialHandler.runRequest (C:\Users\aleks\Downloads\BGC_CHECK\node_modules\@discordjs\rest\dist\index.js:1021:23)
    at async SequentialHandler.queueRequest (C:\Users\aleks\Downloads\BGC_CHECK\node_modules\@discordjs\rest\dist\index.js:862:14)
    at async REST.request (C:\Users\aleks\Downloads\BGC_CHECK\node_modules\@discordjs\rest\dist\index.js:1387:22)
    at async TextChannel.send (C:\Users\aleks\Downloads\BGC_CHECK\node_modules\discord.js\src\structures\interfaces\TextBasedChannel.js:162:15)
    at async Object.execute (C:\Users\aleks\Downloads\BGC_CHECK\commands\util\apply.js:64:5)
    at async Object.execute (C:\Users\aleks\Downloads\BGC_CHECK\events\client\interactionCreate.js:18:17) {
  requestBody: {
    files: [],
    json: {
      content: undefined,
      tts: false,
      nonce: undefined,
      embeds: undefined,
      components: [Array],
      username: undefined,
      avatar_url: undefined,
      allowed_mentions: undefined,
      flags: undefined,
      message_reference: undefined,
      attachments: undefined,
      sticker_ids: undefined,
      thread_name: undefined
    }
  },
  rawError: {
    code: 50035,
    errors: { components: [Object] },
    message: 'Invalid Form Body'
  },
  code: 50035,
  status: 400,
  method: 'POST',
  url: 'https://discord.com/api/v10/channels/1124020014924697600/messages'
}
node:events:491
      throw er; // Unhandled 'error' event
      ^

Error [InteractionAlreadyReplied]: The reply to this interaction has already been sent or deferred.
    at ChatInputCommandInteraction.reply (C:\Users\aleks\Downloads\BGC_CHECK\node_modules\discord.js\src\structures\interfaces\InteractionResponses.js:102:46)
    at Object.execute (C:\Users\aleks\Downloads\BGC_CHECK\events\client\interactionCreate.js:21:35)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Emitted 'error' event on Client instance at:
    at emitUnhandledRejectionOrErr (node:events:394:10)
    at process.processTicksAndRejections (node:internal/process/task_queues:84:21) {
  code: 'InteractionAlreadyReplied'
}

Node.js v18.15.0

Solution

The first error you're encountering (Invalid Form Body) is related to the channel.send() method you're invoking. As Zsolt pointed out, you're already showing the modal to the user with interaction.showModal();, you don't need the channel.send method. It's also not accepting your components because it can't process TextInputBuilders as they are meant for Modals (which you're also using them for), thus throwing the error.

Your second error (The reply to this interaction has already been sent or deferred) may be related to you deferring the reply (with deferReply) somewhere beforehand. A modal response (showModal) must be the first not-deferred response to an interaction.