import { createElement, Fragment, Client } from "discord-tsx-factory";
import * as Discord from "discord.js";
import "discord-tsx-commands"; // this line expands discord-tsx-factory.

const client = new Client(...);

import * as Discord from "discord.js";
import {
  createElement,
  Fragment,
  Client,
  InteractionType,
} from "discord-tsx-factory";
import "discord-tsx-commands";

const client = new Client({
  intents: [Discord.IntentsBitField.Flags.Guilds],
});

client.on("ready", () => {
  const commands = [
    <slash
    name="command"
    description="your command"
    onExecute={() => console.log("command executed!")}
    >
      <user name="user" description="your user" required />
      <role name="role" description="your role" required />
    </slash>
  ] as Discord.SlashCommandBuilder[];
  client.rest.put(Discord.Routes.applicationCommands(client.application!.id!), {
    body: commands.map((command) => command.toJSON()),
  });
});
client.login(...);

client.on("ready", () => {
  const commands = [
    <slash name="command" description="your command">
      <slash
        name="subcommand1"
        description="your sub command1"
        onExecute={(command) => console.log("sub command1 executed!")}
      >
        <string name="string" description="your string" required />
        <string name="select" description="your string select">
          <choice name="choice1">choice1</choice>
          <choice name="choice2" value="choice2" />
        </string>
      </slash>

      <slash
        name="subcommand2"
        description="your sub command2"
        onExecute={() => console.log("sub command2 executed!")}
      >
        <user name="user" description="your user" required />
        <role name="role" description="your role" required />
      </slash>
    </slash>,
  ] as Discord.SlashCommandBuilder[];
  client.rest.put(Discord.Routes.applicationCommands(client.application!.id!), {
    body: commands.map((command) => command.toJSON()),
  });
});

client.on("ready", () => {
  const commands = [
    <slash name="command" description="your command">
      <group name="sub1" description="sub1">
        <slash
          name="sub2_1"
          description="sub2_1"
          onExecute={() => console.log("sub2_1 executed")}
        />
        <slash
          name="sub2_2"
          description="sub2_2"
          onExecute={() => console.log("sub2_2 executed")}
        />
      </group>
    </slash>,
  ] as Discord.SlashCommandBuilder[];
  client.rest.put(Discord.Routes.applicationCommands(client.application!.id!), {
    body: commands.map((command) => command.toJSON()),
  });
});