Skip to content

Commit

Permalink
cc/interactions: address review feedback
Browse files Browse the repository at this point in the history
Signed-off-by: SoggySaussages <[email protected]>
  • Loading branch information
SoggySaussages committed Jun 10, 2024
1 parent 8f08bbe commit a8d1e30
Show file tree
Hide file tree
Showing 4 changed files with 75 additions and 73 deletions.
20 changes: 2 additions & 18 deletions content/custom-commands/commands.md
Original file line number Diff line number Diff line change
Expand Up @@ -241,34 +241,18 @@ You must specify a channel to run interval commands in even if the command doesn

#### Component

{{% notice style="tip" %}}

Use of interactions within YAGPDB is an advanced topic, the documentation should be used only as reference. To learn
about using interactions, [see here](/reference/custom_interactions).

{{% /notice %}}
[In-depth Interactions Guide](/reference/custom-interactions)

The component trigger is used to trigger custom commands via buttons or select menus.

When creating a button or a select menu using template scripting, you must define a `custom_id`. When that button/menu
is used by a member of your server, it triggers any custom command whose trigger matches that Custom ID.

The trigger is matched using [RegEx](/reference/regex).

#### Modal

{{% notice style="tip" %}}

Use of interactions within YAGPDB is an advanced topic, the documentation should be used only as reference. To learn
about using interactions, [see here](/reference/custom_interactions).

{{% /notice %}}
[In-depth Interactions Guide](/reference/custom-interactions)

The modal trigger is used to trigger custom commands via submitting a modal.

When responding to an interaction with a modal using template scripting, you must define a `custom_id`. When that modal
is submitted by a member of your server, it triggers any custom command whose trigger matches that Custom ID.

The trigger is matched using [RegEx](/reference/regex).

#### Case Sensitivity
Expand Down
124 changes: 71 additions & 53 deletions content/reference/custom_interactions.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,82 +9,91 @@ Buttons, Modals, Select Menus, Ephemeral Messages, and more!

{{% notice warning %}}

Use of interactions within YAGPDB is an advanced topic. You will need a thorough understanding of YAGPDB's scripting
Use of interactions within YAGPDB is an advanced topic; you will need a thorough understanding of YAGPDB's scripting
language before learning interactions.

We have a comprehensive learning course located [here](https://learn.yagpdb.xyz) for you to get started.
We have a [comprehensive learning course](https://learn.yagpdb.xyz) for you to get started.

{{% /notice %}}

## The Basics

Interactions within Discord allow server members to use alternative, built-in features to trigger bots to take action
other than messages or reactions. These features include builtin buttons, dropdown selection menus, or submitting a
modal (basically a pop-up form). Within custom commands it is possible to both create and customize these new
modal (basically a pop-up form). Within custom commands it is possible to not only create and customize these new
interactive features, but respond to them as well, opening up new possibilities for ephemeral message responses, modals,
and more within YAGPDB custom templating script.

### Interaction Lifetime

An interaction's lifetime starts with the initial *interaction* with an *interactive element*.

1. A server member clicks on a *button*, uses a *menu*, or submits a *modal* after filling it out.
2. This interaction is sent to YAGPDB, and becomes available to trigger any custom commands which match it.
3. Within the triggered custom command(s), YAGPDB should then *respond* once to the interaction, sending a message,
updating the triggering message, or sending a modal. This may only be done within the CC which was triggered by the
interaction.
4. *(optional)* Continue to send followup responses for up to 15 minutes until the interaction token expires.

{{< mermaid >}}
graph LR;
A[Button pressed] --> B{CC Triggered}
C[Menu used] --> B
D[Modal submitted] --> B
B --> E[Bot sends message response]
B --> G[Bot sends modal response]
B --> H[Bot updates message]
E --> F(Bot sends followups)
G --> F
H --> F
{{< /mermaid >}}

### Definitions

**Interaction** - A user engaging with YAGPDB through one of Discord's builtin features: Clicking a button, Making a
Interaction
: A user engaging with YAGPDB through one of Discord's builtin features: Clicking a button, Making a
selection with a select menu, or Submitting a modal.

**Response** - YAGPDB is required to send an initial interaction response after receiving an *interaction*. If it does
not do this, the user triggering the interaction will see a "This application did not respond" error. The bot cannot
respond to an interaction more than once. YAGPDB may only respond to an interaction in one of the following ways:
Sending a message, sending a modal, or updating the message which the *interaction* was triggered on.
Response
: YAGPDB is required to respond promptly after receiving an interaction by either sending a message or modal, or by
updating the message on which the interaction was triggered. If it does not do this, the user triggering the interaction
will see a "This application did not respond" error. The bot cannot respond to an interaction more than once.

**Followup** - Since YAGPDB may only *respond* to an *interaction* once, it is subsequently required to send an interaction
followup if it still needs to respond to the interaction. These followups can be sent up to 15 minutes after the initial
Followup
: Since YAGPDB may only *respond* to an *interaction* once, it is subsequently required to send an interaction
followup if it still needs to interface with the interaction. These followups can be sent up to 15 minutes after the initial
interaction, and you can send as many as you want. YAGPDB may only send a followup in one of the following ways: Sending
a message, editing a response or followup, or getting a response or followup message.
a followup message, editing an initial response or previous followup message, or getting an initial response or previous
followup message.

**Interactive Elements** - Elements users can interact with to send *interactions*, i.e. buttons, menus, and modals.
Interactive Elements
: Elements users can interact with to send *interactions*, i.e. buttons, menus, and modals.

**Message Components** - *Interactive Elements* which can be attached to YAGPDB's Discord messages, i.e. buttons and menus.
Message Components
: *Interactive Elements* which can be attached to YAGPDB's Discord messages, i.e. buttons and menus.

**Button** - A button appearing in or under a Discord message sent by YAGPDB. You can create and customize these
Button
: A button appearing in or under a Discord message sent by YAGPDB. You can create and customize these
buttons' appearance and behavior with color, emoji, label text, etc. When a button is clicked, an *interaction* is sent
to the bot.

**Menu** - A dropdown select menu appearing in or under a Discord message sent by YAGPDB. You can create and customize these
Menu
: A dropdown select menu appearing in or under a Discord message sent by YAGPDB. You can create and customize these
menus' appearance and behavior with placeholder text, predefined options with labels, descriptions, and/or emojis,
designate the entire menu as a user or role select menu instead, etc. When a select menu is used, an *interaction* is sent
to the bot.

**Modal** - A pop-up form YAGPDB can send in response to an interaction. It allows users to privately input text which
Modal
: A pop-up form YAGPDB can send in response to an interaction. It allows users to privately input text which
is sent directly to YAGPDB for use in CC scripting. You can create and customize these modals' appearance and
behavior with a title and fields. YAGPDB can both **receive a submitted modal** (which is an
*interaction*), and **send a modal** for a member to fill out, (which is an interaction *response*).

**Ephemeral** - An ephemeral message is sent to a server channel but only appears to a single user. YAGPDB cannot send
Ephemeral
: An ephemeral message is sent to a server channel but only appears to a single user. YAGPDB cannot send
these ephemeral messages to users except in response to an *interaction*. Both *response* messages and *followup*
messages can be ephemeral.

## Interaction Lifetime

An interaction's lifetime starts with the initial *interaction* with an *interactive element*.

1. A server member clicks on a *button*, uses a *menu*, or submits a *modal* after filling it out.
2. This interaction is sent to YAGPDB, and becomes available to trigger any custom commands which match it.
3. Within the triggered custom command(s), YAGPDB should then *respond* once to the interaction, sending a message,
updating the triggering message, or sending a modal. This may only be done within the CC which was triggered by the
interaction.
4. _(optional)_ Continue to send followup responses for up to 15 minutes until the interaction token expires.

{{< mermaid >}}
graph LR;
A[Button pressed] --> B{CC Triggered}
C[Menu used] --> B
D[Modal submitted] --> B
B --> E[Bot sends message response]
B --> G[Bot sends modal response]
B --> H[Bot updates message]
E --> F(Bot sends followups)
G --> F
H --> F
{{< /mermaid >}}

## Creating Interactive Elements

Before you can start triggering Custom Commands with interactive elements, you'll need to have elements to interact
Expand All @@ -103,31 +112,37 @@ Let's examine how to make a basic button.
{{ sendMessage nil $message }}
```

Result:

![A basic button](basic_button.png)

We've successfully made a basic button. Currently this button doesn't do anything when we click it. That's because it
doesn't have an ID that YAGPDB can use to trigger any other custom commands. For our next iteration, we'll add a custom
ID which can trigger a custom command. Let's say we want to trigger a custom command with this trigger:
ID which can trigger a custom command.

![A custom command triggering on the message component custom ID "duck"](duck_trigger.png)
##### Custom IDs

This custom command will trigger on any message component, either button or menu, whose custom ID contains the word "duck."
{{% notice info %}}

Multiple buttons and menus can not have the same custom ID in one message.

{{% /notice %}}

```go
{{ $button := cbutton "label" "Button" "custom_id" "buttons-duck" }}
{{ $message := complexMessage "buttons" $button }}
{{ sendMessage nil $message }}
```

This button triggers our duck RegEx custom command.
This button will now trigger the following custom command:

Now, let's add some more buttons.
![A custom command triggering on the message component custom ID "duck"](duck_trigger.png)

{{% notice info %}}
This custom command will trigger on any message component, either button or menu, whose custom ID contains the word "duck."

You cannot have two message components with the same Custom ID in one message.
##### Multiple Components

{{% /notice %}}
Now, let's add some more buttons.

{{% notice info %}}

Expand All @@ -150,8 +165,11 @@ Link style buttons do not trigger *interactions*.
At this stage we have three buttons. Both of the first two buttons will trigger our duck trigger custom command, but the
third button will not trigger any custom command. Link buttons do not create *interactions*.

We can differentiate between the two buttons with `.StrippedID`, which returns the `.CustomID` but with the trigger and
everything before it (in our case, `buttons-duck`) stripped off.
We can differentiate between the two buttons using `.StrippedID`, which, just like `.StrippedMsg`, returns our Custom ID
without the trigger and everything else before that. In our example, `.StrippedID` will return `-alpha` for the first
button and `-beta` for the second button.

Confirming this behavior will be left as an exercise to the reader (you).

Let's add in a select menu now.

Expand Down Expand Up @@ -186,8 +204,8 @@ since this menu is a string select type menu.
A message can have 5 rows of components.
A row of components can have 5 buttons, **or** 1 menu.

Let's say I wanted to play tic tac toe. If I just add 9 buttons into the same slice in my complex message, they'll just
fill the first row with 5 buttons and the second row with 4, which isn't what I'm looking for. Here's a solution:
Let's say we want to play tic tac toe. If we just add 9 buttons into the same slice in our complex message, they'll just
fill the first row with 5 buttons and the second row with 4, which isn't what we're looking for. Here's a solution:

```go
{{ $blankEmoji := sdict "name" "" }}
Expand Down
2 changes: 1 addition & 1 deletion content/reference/templates/_index.md
Original file line number Diff line number Diff line change
Expand Up @@ -200,7 +200,7 @@ Channel functions are covered [here](functions#channel).

{{% notice style="tip" %}}

Use of interactions within YAGPDB is an advanced topic, the documentation should be used only as reference. To learn
Use of interactions within YAGPDB is an advanced topic; the documentation should be used only as reference. To learn
about using interactions, [see here](/reference/custom_interactions).

{{% /notice %}}
Expand Down
2 changes: 1 addition & 1 deletion content/reference/templates/functions.md
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ convert the number to type _string_ before saving and later back to its original
{{% notice style="tip" %}}
Use of interactions within YAGPDB is an advanced topic, the documentation should be used only as reference. To learn
Use of interactions within YAGPDB is an advanced topic; the documentation should be used only as reference. To learn
about using interactions, [see here](/reference/custom_interactions).
{{% /notice %}}
Expand Down

0 comments on commit a8d1e30

Please sign in to comment.