feat: add pick, remove, and update the general /roleypoly command

packages/interactions/handlers/interaction.ts

@@ -1,8 +1,3 @@
-import { helloWorld } from '@roleypoly/interactions/handlers/interactions/hello-world';
-import { pickableRoles } from '@roleypoly/interactions/handlers/interactions/pickable-roles';
-import { roleypoly } from '@roleypoly/interactions/handlers/interactions/roleypoly';
-import { verifyRequest } from '@roleypoly/interactions/utils/interactions';
-import { somethingWentWrong } from '@roleypoly/interactions/utils/responses';
 import {
   InteractionData,
   InteractionRequest,
@@ -11,6 +6,12 @@ import {
   InteractionType,
 } from '@roleypoly/types';
 import { respond } from '@roleypoly/worker-utils';
+import { verifyRequest } from '../utils/interactions';
+import { somethingWentWrong } from '../utils/responses';
+import { helloWorld } from './interactions/hello-world';
+import { pickRole } from './interactions/pick-role';
+import { pickableRoles } from './interactions/pickable-roles';
+import { roleypoly } from './interactions/roleypoly';
 
 const commands: Record<
   InteractionData['name'],
@@ -19,6 +20,8 @@ const commands: Record<
   'hello-world': helloWorld,
   roleypoly: roleypoly,
   'pickable-roles': pickableRoles,
+  'pick-role': pickRole('add'),
+  'remove-role': pickRole('remove'),
 };
 
 export const interactionHandler = async (request: Request): Promise<Response> => {

packages/interactions/handlers/interactions/pick-role.ts

@@ -1,16 +1,80 @@
+import { selectRole } from '@roleypoly/interactions/utils/api';
+import { invalid, mustBeInGuild } from '@roleypoly/interactions/utils/responses';
 import {
   InteractionCallbackType,
+  InteractionFlags,
   InteractionRequestCommand,
   InteractionResponse,
 } from '@roleypoly/types';
 
-export const helloWorld = async (
-  interaction: InteractionRequestCommand
-): Promise<InteractionResponse> => {
-  return {
-    type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
-    data: {
-      content: `Hey there, ${interaction.member?.nick || interaction.user?.username}`,
-    },
+export const pickRole =
+  (mode: 'add' | 'remove') =>
+  async (interaction: InteractionRequestCommand): Promise<InteractionResponse> => {
+    if (!interaction.guild_id) {
+      return mustBeInGuild();
+    }
+
+    const userID = interaction.member?.user?.id;
+    if (!userID) {
+      return mustBeInGuild();
+    }
+
+    const roleID = interaction.data.options?.find(
+      (option) => option.name === 'role'
+    )?.value;
+    if (!roleID) {
+      return invalid();
+    }
+
+    const code = await selectRole(mode, interaction.guild_id, userID, roleID);
+
+    if (code === 409) {
+      return {
+        type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
+        data: {
+          content: `:x: You ${mode === 'add' ? 'already' : "don't"} have that role.`,
+          flags: InteractionFlags.EPHEMERAL,
+        },
+      };
+    }
+
+    if (code === 404) {
+      return {
+        type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
+        data: {
+          content: `:x: <@&${roleID}> isn't pickable.`,
+          flags: InteractionFlags.EPHEMERAL,
+        },
+      };
+    }
+
+    if (code === 403) {
+      return {
+        type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
+        data: {
+          content: `:x: <@&${roleID}> has unsafe permissions.`,
+          flags: InteractionFlags.EPHEMERAL,
+        },
+      };
+    }
+
+    if (code !== 200) {
+      return {
+        type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
+        data: {
+          content: `:x: Something went wrong, please try again later.`,
+          flags: InteractionFlags.EPHEMERAL,
+        },
+      };
+    }
+
+    return {
+      type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
+      data: {
+        content: `:white_check_mark: You ${
+          mode === 'add' ? 'got' : 'removed'
+        } the role: <@&${roleID}>`,
+        flags: InteractionFlags.EPHEMERAL,
+      },
+    };
   };
-};

packages/interactions/handlers/interactions/roleypoly.ts

@@ -1,5 +1,6 @@
 import { uiPublicURI } from '@roleypoly/interactions/utils/config';
 import {
+  Embed,
   InteractionCallbackType,
   InteractionFlags,
   InteractionRequestCommand,
@@ -13,7 +14,34 @@ export const roleypoly = async (
     return {
       type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
       data: {
-        content: `:beginner: Assign your roles here! ${uiPublicURI}/s/${interaction.guild_id}`,
+        embeds: [
+          {
+            color: 0x453e3d,
+            title: `:beginner: Hey there, ${
+              interaction.member?.nick || interaction.member?.user?.username || 'friend'
+            }!`,
+            description: `Try these slash commands, or pick roles from your browser!`,
+            fields: [
+              { name: 'See all the roles', value: '/pickable-roles' },
+              { name: 'Pick a role', value: '/pick-role' },
+              { name: 'Remove a role', value: '/remove-role' },
+            ],
+          } as Embed,
+        ],
+        components: [
+          {
+            type: 1,
+            components: [
+              // Link to Roleypoly
+              {
+                type: 2,
+                label: `Pick roles on ${new URL(uiPublicURI).hostname}`,
+                url: `${uiPublicURI}/s/${interaction.guild_id}`,
+                style: 5,
+              },
+            ],
+          },
+        ],
         flags: InteractionFlags.EPHEMERAL,
       },
     };

packages/interactions/utils/api.ts

@@ -23,3 +23,19 @@ export const getPickableRoles = async (
 
   return (await response.json()) as Record<Category['name'], CategorySlug>;
 };
+
+export const selectRole = async (
+  mode: 'add' | 'remove',
+  guildID: string,
+  userID: string,
+  roleID: string
+): Promise<number> => {
+  const response = await apiFetch(
+    `/interactions-pick-role/${guildID}/${userID}/${roleID}`,
+    {
+      method: mode === 'add' ? 'PUT' : 'DELETE',
+    }
+  );
+
+  return response.status;
+};

packages/interactions/utils/responses.ts

@@ -12,6 +12,14 @@ export const mustBeInGuild = (): InteractionResponse => ({
   },
 });
 
+export const invalid = (): InteractionResponse => ({
+  type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
+  data: {
+    content: ':x: You filled that command out wrong...',
+    flags: InteractionFlags.EPHEMERAL,
+  },
+});
+
 export const somethingWentWrong = (): InteractionResponse => ({
   type: InteractionCallbackType.CHANNEL_MESSAGE_WITH_SOURCE,
   data: {