diff --git a/README.md b/README.md index 6de9a9b..e633acd 100644 --- a/README.md +++ b/README.md @@ -88,6 +88,7 @@ On the **General Information** tab, there will be an **Interactions Endpoint URL Click **Save Changes**, and your app should be ready to run 🚀 ## Other resources -- Join the **[Discord Developers server](https://discord.gg/discord-developers)** to ask questions about the API, attend events hosted by the Discord API team, and interact with other devs. - Read **[the documentation](https://discord.com/developers/docs/intro)** for in-depth information about API features. +- Browse the `examples/` folder in this project for smaller, feature-specific code examples +- Join the **[Discord Developers server](https://discord.gg/discord-developers)** to ask questions about the API, attend events hosted by the Discord API team, and interact with other devs. - Check out **[community resources](https://discord.com/developers/docs/topics/community-resources#community-resources)** for language-specific tools maintained by community members. diff --git a/app.js b/app.js index b89a431..67feff5 100644 --- a/app.js +++ b/app.js @@ -1,5 +1,5 @@ import 'dotenv/config' -import express from 'express' +import express, { json } from 'express' import axios from 'axios'; import { InteractionType, InteractionResponseType } from 'discord-interactions'; import { VerifyDiscordRequest, getRandomEmoji, ComponentType, ButtonStyle, DiscordAPI } from './utils.js'; @@ -25,6 +25,7 @@ let activeGames = {}; app.post('/interactions', function (req, res) { // Interaction type and data let { type, id, data } = req.body; + console.log(type); /** * Handle verification requests diff --git a/examples/modal.js b/examples/modal.js index e69de29..af651e9 100644 --- a/examples/modal.js +++ b/examples/modal.js @@ -0,0 +1,85 @@ +import 'dotenv/config' +import express from 'express' +import { InteractionType, InteractionResponseType } from 'discord-interactions'; +import { VerifyDiscordRequest } from './utils.js'; +import { ComponentType } from '../utils.js'; + +// Create and configure express app +const app = express(); +app.use(express.json({verify: VerifyDiscordRequest(process.env.PUBLIC_KEY)})); + +app.post('/interactions', function (req, res) { + // Interaction type and data + let { type, data } = req.body; + /** + * Handle slash command requests + */ + if (type === InteractionType.APPLICATION_COMMAND){ + // Slash command with name of "test" + if (data.name === "test") { + // Send a modal as response + return res.send({ + "type": InteractionResponseType.APPLICATION_MODAL, + "data": { + "custom_id": "my_modal", + "title": "Modal title", + "components": [ + { + // Text inputs must be inside of an action component + "type": ComponentType.ACTION, + "components": [ + { + // See https://discord.com/developers/docs/interactions/message-components#text-inputs-text-input-structure + "type": ComponentType.INPUT, + "custom_id": "my_text", + "style": 1, + "label": "Type some text" + } + ] + }, + { + "type": ComponentType.ACTION, + "components": [ + { + "type": ComponentType.INPUT, + "custom_id": "my_longer_text", + // Bigger text box for input + "style": 2, + "label": "Type some (longer) text" + } + ] + } + ] + } + }); + } + } + + /** + * Handle modal submissions + */ + if (type === InteractionType.APPLICATION_MODAL_SUBMIT) { + // custom_id of modal + let modalId = data.custom_id; + // user ID of member who filled out modal + let userId = req.body.member.user.id; + + if (modalId === 'my_modal') { + let modalValues = ''; + // Get value of text inputs + for (let action of data.components) { + let inputComponent = action.components[0]; + modalValues += `${inputComponent.custom_id}: ${inputComponent.value}\n` + } + + return res.send({ + "type": InteractionResponseType.CHANNEL_MESSAGE_WITH_SOURCE, + "data": { "content": `<@${userId}> typed the following (in a modal):\n\n${modalValues}` } + }) + } + } +}); + +app.listen(3000, () => { + console.log('Listening on port 3000'); +}); \ No newline at end of file