Discord Modal UI

Help
1

I want my users to verify their solana address in my discord server, then a popup will show to input their wallet and the bot will verify the wallet address.

import discord
from discord_components import DiscordComponents, Button, ButtonStyle

client = discord.Client()
DiscordComponents(client)

@client.event
async def on_ready():
    print('Logged in as {0.user}'.format(client))

@client.event
async def on_message(message):
    if message.content == '/verify':
        # Create a UI modal with a button
        modal = await message.author.send(
            "Please enter your Solana wallet address:",
            components=[
                Button(style=ButtonStyle.blue, label="Submit", custom_id="submit")
            ]
        )

        # Wait for the user to click the button
        def check_interaction(interaction):
            return interaction.message.id == modal.id and interaction.custom_id == "submit"

        interaction = await client.wait_for("button_click", check=check_interaction)

        # Validate the wallet address
        # ...

        # Send a message back to the user indicating whether the wallet address is valid or not
        # ...

client.run()

an error shows:

Code Error
Unexpected token (2:5)

DETAILS
SyntaxError: Unexpected token (2:5)
    at anonymous.pp$4.raise (/var/task/node_modules/acorn/dist/acorn.js:2927:15)
    at anonymous.pp.unexpected (/var/task/node_modules/acorn/dist/acorn.js:698:10)
    at anonymous.pp$1.parseImport (/var/task/node_modules/acorn/dist/acorn.js:1573:78)
    at anonymous.pp$1.parseStatement (/var/task/node_modules/acorn/dist/acorn.js:872:49)
    at anonymous.parseStatement (/var/task/node_modules/acorn-node/lib/dynamic-import/index.js:65:118)
    at anonymous.parseStatement (/var/task/node_modules/acorn-node/lib/import-meta/index.js:45:48)
    at anonymous.pp$1.parseTopLevel (/var/task/node_modules/acorn/dist/acorn.js:755:23)
    at anonymous.parse (/var/task/node_modules/acorn/dist/acorn.js:555:17)
    at Function.parse (/var/task/node_modules/acorn/dist/acorn.js:578:37)
    at Object.parse (/var/task/node_modules/acorn-node/index.js:30:28)
2

Hi @joseph.jumilla,

It looks like you’re trying to use Discord.py code in a Pipedream component. Pipedream components are written in Node.js, not Python. To achieve the same functionality, you can use the Discord.js library and the discord-buttons package in Node.js.

First, you’ll need to create a Discord bot and add it to your server. You can follow the instructions in the Discord.js guide.

Next, you can create a Pipedream component that uses the Discord.js library and discord-buttons package to listen for messages and handle the wallet address verification. Here’s an example component to get you started:

import { Client } from "discord.js";
import { MessageButton, MessageActionRow } from "discord-buttons";

export default defineComponent({
  props: {
    discordToken: {
      type: "string",
      label: "Discord Bot Token",
      secret: true,
    },
  },
  async run({ $ }) {
    const client = new Client();
    require("discord-buttons")(client);

    client.on("ready", () => {
      console.log(`Logged in as ${client.user.tag}`);
    });

    client.on("message", async (message) => {
      if (message.content === "/verify") {
        const button = new MessageButton()
          .setStyle("blurple")
          .setLabel("Submit")
          .setID("submit");

        const row = new MessageActionRow().addComponent(button);

        await message.channel.send("Please enter your Solana wallet address:", { components: [row] });
      }
    });

    client.on("clickButton", async (button) => {
      if (button.id === "submit") {
        // Validate the wallet address
        // ...

        // Send a message back to the user indicating whether the wallet address is valid or not
        // ...
      }
    });

    client.login(this.discordToken);
  },
});

Replace discordToken with your Discord bot token. This component listens for messages in your Discord server and responds with a button when a user sends the /verify command. When the user clicks the “Submit” button, you can validate the Solana wallet address and send a message back to the user.

Please note that running a Discord bot within a Pipedream component is not recommended for production use, as the bot may
I’m a bot powered by Pipedream and GPT-4. I’m still learning, so please double check my answers and code! Learn how to build your own.

3

It says: “Code Error
could not compute configurable props”