Discord Application Setup Instructions

\n Go to the Discord Developer Portal\n
Create a new application or select an existing one
In the \"OAuth2\" section, select the \"applications.commands\" scope
Use the generated URL to add the application to your server
\n Copy your application's public key and add it{\" \"}\n \n as a Val Town environment variable\n {\" \"}\n named LINKIFY_DISCORD_PUBLIC_KEY\n
\n Copy your application ID and add it{\" \"}\n \n as a Val Town environment variable\n {\" \"}\n named LINKIFY_DISCORD_APPLICATION_ID\n
In the \"Bot\" section, ensure that the \"MESSAGE CONTENT INTENT\" is enabled
\n Copy your bot token and add it{\" \"}\n \n as a Val Town environment variable\n {\" \"}\n named LINKIFY_DISCORD_BOT_TOKEN\n
\n In the \"General Information\" section, set the following URL as your Discord application's interactions\n endpoint URL:\n {window.location.href}\n

\n After setting up the Discord application and environment variables, use the \"Register Commands\" button below to\n set up the /linkify command.\n

\n );\n}\n\nfunction InstallationLinks() {\n const [applicationId, setApplicationId] = useState(null);\n\n useEffect(() => {\n fetch(\"/application-id\")\n .then(response => response.json())\n .then(data => setApplicationId(data.applicationId))\n .catch(error => console.error(\"Error fetching application ID:\", error));\n }, []);\n\n if (!applicationId) {\n return

Loading installation link...

;\n }\n\n const installUrl = `https://discord.com/oauth2/authorize?client_id=${applicationId}`;\n\n return (\n

Installation Link

Use this link to install the bot on your Discord server or your personal account:

\n Install Bot\n

\n );\n}\n\nfunction App() {\n const [url, setUrl] = useState(\"\");\n const [transformedUrl, setTransformedUrl] = useState(\"\");\n const [registrationStatus, setRegistrationStatus] = useState(\"\");\n\n const handleTransform = () => {\n const transformed = transformLink(url);\n setTransformedUrl(transformed);\n };\n\n const handleRegisterCommands = async () => {\n try {\n const response = await fetch(\"/register-commands\", { method: \"POST\" });\n const result = await response.json();\n if (response.ok) {\n setRegistrationStatus(\"Commands registered successfully!\");\n } else {\n setRegistrationStatus(`Error registering commands: ${result.error}`);\n }\n console.log(\"Registration result:\", result);\n } catch (error) {\n setRegistrationStatus(`Error registering commands: ${error.message}`);\n }\n };\n\n return (\n

Discord Linkify Command Tester

\n setUrl(e.target.value)}\n placeholder=\"Enter URL\"\n />\n \n

\n {transformedUrl && (\n

Transformed URL:

{transformedUrl}

\n )}\n \n

\n \n {registrationStatus &&

{registrationStatus}

}\n

\n \n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(req: Request): Promise {\n if (req.method === \"GET\") {\n const url = new URL(req.url);\n if (url.pathname === \"/application-id\") {\n const applicationId = Deno.env.get(\"LINKIFY_DISCORD_APPLICATION_ID\");\n return new Response(JSON.stringify({ applicationId }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n return new Response(\n `\n \n \n Discord Linkify Command Tester\n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"content-type\": \"text/html\" },\n },\n );\n }\n\n if (req.method === \"POST\" && new URL(req.url).pathname === \"/register-commands\") {\n try {\n const result = await registerDiscordSlashCommand(\n Deno.env.get(\"LINKIFY_DISCORD_APPLICATION_ID\"),\n Deno.env.get(\"LINKIFY_DISCORD_BOT_TOKEN\"),\n {\n name: \"linkify\",\n description: \"Transform a URL\",\n options: [\n {\n name: \"url\",\n description: \"The URL to transform\",\n type: 3, // STRING\n required: true,\n },\n {\n name: \"summarize\",\n description: \"Whether to summarize the link content\",\n type: 5, // BOOLEAN\n required: false,\n },\n ],\n },\n );\n return new Response(JSON.stringify(result), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n return new Response(JSON.stringify({ error: error.message }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n const body = await req.json();\n\n const verified = await verify_discord_signature(\n Deno.env.get(\"LINKIFY_DISCORD_PUBLIC_KEY\"),\n JSON.stringify(body),\n req.headers.get(\"X-Signature-Ed25519\"),\n req.headers.get(\"X-Signature-Timestamp\"),\n );\n if (!verified) {\n return new Response(\"signature invalid\", {\n status: 401,\n statusText: \"signature invalid\",\n });\n }\n\n // PING\n if (body.type === 1) {\n return Response.json({ type: 1 }); // PONG\n }\n\n // APPLICATION_COMMAND interactions\n if (body.type === 2) {\n if (body.data?.name === \"linkify\") {\n const url = body.data.options.find((opt) => opt.name === \"url\")?.value;\n const summarize = body.data.options.find((opt) => opt.name === \"summarize\")?.value ?? false;\n\n if (!url) {\n return Response.json({\n type: 4,\n data: {\n content: \"Please provide a valid URL.\",\n },\n });\n }\n\n const transformedUrl = transformLink(url);\n let response = {\n type: 4,\n data: {\n content: `Transformed link: ${transformedUrl}`,\n },\n };\n\n if (summarize) {\n response.data.content += \"\\n\\nSummary functionality is not implemented in this example.\";\n }\n\n return Response.json(response);\n }\n\n return new Response(\"Bad request\", {\n status: 400,\n statusText: \"Bad request\",\n });\n }\n\n return new Response(\"Not handled\", { status: 422 });\n}\n\nconst css = `\nbody {\n font-family: Arial, sans-serif;\n max-width: 800px;\n margin: 0 auto;\n padding: 20px;\n}\n\ninput[type=\"text\"] {\n width: 100%;\n padding: 10px;\n margin-bottom: 10px;\n}\n\nbutton {\n padding: 10px 20px;\n background-color: #4CAF50;\n color: white;\n border: none;\n cursor: pointer;\n margin-right: 10px;\n}\n\nbutton:hover {\n background-color: #45a049;\n}\n\npre {\n background-color: #f4f4f4;\n padding: 10px;\n overflow-x: auto;\n}\n\n.setup-instructions, .installation-links {\n background-color: #f0f0f0;\n border: 1px solid #ddd;\n border-radius: 5px;\n padding: 20px;\n margin-top: 20px;\n margin-bottom: 20px;\n}\n\n.setup-instructions h2, .installation-links h2 {\n margin-top: 0;\n}\n\n.setup-instructions ol, .installation-links ul {\n padding-left: 20px;\n}\n\n.setup-instructions li, .installation-links li {\n margin-bottom: 10px;\n}\n\n.setup-instructions code {\n background-color: #e0e0e0;\n padding: 2px 4px;\n border-radius: 3px;\n}\n\n.installation-links a {\n color: #4CAF50;\n text-decoration: none;\n}\n\n.installation-links a:hover {\n text-decoration: underline;\n}\n\nfooter {\n margin-top: 20px;\n text-align: center;\n}\n\n.view-source {\n color: #4CAF50;\n text-decoration: none;\n}\n\n.view-source:hover {\n text-decoration: underline;\n}\n`;","deleted","label",[98],"permalink","https://www.val.town/x/jamiedubs/linkifyDiscordBot/code/main.tsx","extension","actionData","errors"]