Modales

Avec les modales, vous pouvez créer des formulaires contextuels qui permettent aux utilisateurs de vous fournir des saisies formatées via des soumissions. Nous verrons comment créer, afficher et recevoir des formulaires modaux à l'aide de necord

app.modals.ts

import { Injectable } from '@nestjs/common';
import { Context, Modal, ModalContext } from 'necord';

@Injectable()
export class AppModals {
    @Modal('pizza')
    public onModal(@Ctx() [interaction]: ModalContext) {
      return interaction.reply({
        content: `Your fav pizza : ${interaction.fields.getTextInputValue('pizza')}`
      });
    }
}

Modale dynamique

Vous pouvez créer des modales avec un champ id dynamique. Ceci est utile pour transmettre des métadonnées aux modales.

Les modales dynamiques utilisent le format path-to-regexp pour effectuer la correspondance par expression régulière. Transforme une chaîne de chemin telle que user/:name en une expression régulière.

Pour créer une modale dynamique

new ModalBuilder()
  .setTitle('What your fav pizza?')
  .setCustomId('pizza/12345')
  .setComponents([
    new ActionRowBuilder<ModalActionRowComponentBuilder>().addComponents([
      new TextInputBuilder()
        .setCustomId('pizza')
        .setLabel('???')
        .setStyle(TextInputStyle.Paragraph)
    ])
  ])

Pour recevoir une modale dynamique

app.modals.ts

import { Injectable } from '@nestjs/common';
import { Context, Modal, ModalContext,ModalParam } from 'necord';

@Injectable()
export class AppModals {
    @Modal('pizza/:value')
    public onModal(@Ctx() [interaction]: ModalContext, @ModalParam('value') value: string) {
      return interaction.reply({
        content: `Your fav pizza ${value} : ${interaction.fields.getTextInputValue('pizza')}`
      });
    }
}

Vous pouvez consulter un exemple fonctionnel ici.