Merge pull request #321 from mariusbegby/action-components

Updated action components
mariusbegby · Dec 12, 2023 · 82927c5 · 82927c5
2 parents 5dfe902 + 4b646e2
commit 82927c5
Show file tree

Hide file tree

Showing 6 changed files with 100 additions and 38 deletions.
diff --git a/src/interactions/commands/player/history.ts b/src/interactions/commands/player/history.ts
@@ -1,5 +1,16 @@
 import { GuildQueue, GuildQueueHistory, Track, useHistory, useQueue } from 'discord-player';
-import { ChatInputCommandInteraction, EmbedBuilder, EmbedFooterData, SlashCommandBuilder } from 'discord.js';
+import {
+    APIActionRowComponent,
+    APIButtonComponent,
+    APIMessageActionRowComponent,
+    ButtonBuilder,
+    ButtonStyle,
+    ChatInputCommandInteraction,
+    ComponentType,
+    EmbedBuilder,
+    EmbedFooterData,
+    SlashCommandBuilder
+} from 'discord.js';
 import { Logger } from 'pino';
 import { BaseSlashCommandInteraction } from '../../../classes/interactions';
 import { BaseSlashCommandParams, BaseSlashCommandReturnType } from '../../../types/interactionTypes';
@@ -64,6 +75,38 @@ class HistoryCommand extends BaseSlashCommandInteraction {
     ) {
         logger.debug('History exists with current track, gathering information.');
 
+        const components: APIMessageActionRowComponent[] = [];
+
+        const previousButton: APIButtonComponent = new ButtonBuilder()
+            .setDisabled(queue.history.tracks.data.length > 0 ? false : true)
+            .setCustomId(`action-previous-button_${currentTrack.id}`)
+            .setLabel('Previous')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.previousTrack)
+            .toJSON();
+        components.push(previousButton);
+
+        const playPauseButton: APIButtonComponent = new ButtonBuilder()
+            .setCustomId(`action-pauseresume-button_${currentTrack.id}`)
+            .setLabel(queue.node.isPaused() ? 'Resume' : 'Pause')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.pauseResumeTrack)
+            .toJSON();
+        components.push(playPauseButton);
+
+        const skipButton: APIButtonComponent = new ButtonBuilder()
+            .setCustomId(`action-skip-button_${currentTrack.id}`)
+            .setLabel('Skip')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.nextTrack)
+            .toJSON();
+        components.push(skipButton);
+
+        const embedActionRow: APIActionRowComponent<APIMessageActionRowComponent> = {
+            type: ComponentType.ActionRow,
+            components
+        };
+
         logger.debug('Responding with info embed.');
         await interaction.editReply({
             embeds: [
@@ -81,7 +124,8 @@ class HistoryCommand extends BaseSlashCommandInteraction {
                     .setThumbnail(this.getTrackThumbnailUrl(currentTrack))
                     .setFooter(this.getDisplayFullFooterInfo(interaction, history))
                     .setColor(this.embedOptions.colors.info)
-            ]
+            ],
+            components: [embedActionRow]
         });
         return Promise.resolve();
     }

diff --git a/src/interactions/commands/player/nowplaying.ts b/src/interactions/commands/player/nowplaying.ts
@@ -44,19 +44,36 @@ class NowPlayingCommand extends BaseSlashCommandInteraction {
         const displayQueueRepeatMode: string = this.getDisplayQueueRepeatMode(queue);
         const displayEmbedProgressBar: string = this.getDisplayQueueProgressBar(queue);
 
-        const customId: string = `nowplaying-skip-button_${currentTrack.id}`;
-        logger.debug(`Generated custom id for skip button: ${customId}`);
+        const components: APIMessageActionRowComponent[] = [];
+
+        const previousButton: APIButtonComponent = new ButtonBuilder()
+            .setDisabled(queue.history.tracks.data.length > 0 ? false : true)
+            .setCustomId(`action-previous-button_${currentTrack.id}`)
+            .setLabel('Previous')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.previousTrack)
+            .toJSON();
+        components.push(previousButton);
+
+        const playPauseButton: APIButtonComponent = new ButtonBuilder()
+            .setCustomId(`action-pauseresume-button_${currentTrack.id}`)
+            .setLabel(queue.node.isPaused() ? 'Resume' : 'Pause')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.pauseResumeTrack)
+            .toJSON();
+        components.push(playPauseButton);
 
         const skipButton: APIButtonComponent = new ButtonBuilder()
-            .setCustomId(customId)
-            .setLabel('Skip track')
+            .setCustomId(`action-skip-button_${currentTrack.id}`)
+            .setLabel('Skip')
             .setStyle(ButtonStyle.Secondary)
             .setEmoji(this.embedOptions.icons.nextTrack)
             .toJSON();
+        components.push(skipButton);
 
         const embedActionRow: APIActionRowComponent<APIMessageActionRowComponent> = {
             type: ComponentType.ActionRow,
-            components: [skipButton]
+            components
         };
 
         logger.debug('Sending info embed with action row components.');
@@ -78,7 +95,7 @@ class NowPlayingCommand extends BaseSlashCommandInteraction {
                     .setThumbnail(this.getTrackThumbnailUrl(queue.currentTrack!))
                     .setColor(this.embedOptions.colors.info)
             ],
-            components: [embedActionRow as APIActionRowComponent<APIMessageActionRowComponent>]
+            components: [embedActionRow]
         });
     }
 

diff --git a/src/interactions/commands/player/queue.ts b/src/interactions/commands/player/queue.ts
@@ -67,31 +67,32 @@ class QueueCommand extends BaseSlashCommandInteraction {
     ) {
         logger.debug('Queue exists with current track, gathering information.');
 
+        const components: APIMessageActionRowComponent[] = [];
+
+        const previousButton: APIButtonComponent = new ButtonBuilder()
+            .setDisabled(queue.history.tracks.data.length > 0 ? false : true)
+            .setCustomId(`action-previous-button_${currentTrack.id}`)
+            .setLabel('Previous')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.previousTrack)
+            .toJSON();
+        components.push(previousButton);
+
         const playPauseButton: APIButtonComponent = new ButtonBuilder()
-            .setCustomId(`nowplaying-playpause-button_${currentTrack.id}`)
-            // .setLabel('Pause/Resume track')
+            .setCustomId(`action-pauseresume-button_${currentTrack.id}`)
+            .setLabel(queue.node.isPaused() ? 'Resume' : 'Pause')
             .setStyle(ButtonStyle.Secondary)
             .setEmoji(this.embedOptions.icons.pauseResumeTrack)
             .toJSON();
-        const components: APIMessageActionRowComponent[] = [playPauseButton];
-        if (queue.history.tracks.data.length > 0) {
-            const backButton: APIButtonComponent = new ButtonBuilder()
-                .setCustomId(`nowplaying-back-button_${currentTrack.id}`)
-                // .setLabel('Previous track')
-                .setStyle(ButtonStyle.Secondary)
-                .setEmoji(this.embedOptions.icons.previousTrack)
-                .toJSON();
-            components.unshift(backButton);
-        }
-        if (queue.tracks.data.length > 0) {
-            const skipButton: APIButtonComponent = new ButtonBuilder()
-                .setCustomId(`nowplaying-skip-button_${currentTrack.id}`)
-                // .setLabel('Skip track')
-                .setStyle(ButtonStyle.Secondary)
-                .setEmoji(this.embedOptions.icons.nextTrack)
-                .toJSON();
-            components.push(skipButton);
-        }
+        components.push(playPauseButton);
+
+        const skipButton: APIButtonComponent = new ButtonBuilder()
+            .setCustomId(`action-skip-button_${currentTrack.id}`)
+            .setLabel('Skip')
+            .setStyle(ButtonStyle.Secondary)
+            .setEmoji(this.embedOptions.icons.nextTrack)
+            .toJSON();
+        components.push(skipButton);
 
         const embedActionRow: APIActionRowComponent<APIMessageActionRowComponent> = {
             type: ComponentType.ActionRow,

diff --git a/...components/nowplaying-playpause-button.ts → ...s/components/action-pauseresume-button.ts b/...components/nowplaying-playpause-button.ts → ...s/components/action-pauseresume-button.ts
@@ -5,9 +5,9 @@ import { BaseComponentParams, BaseComponentReturnType } from '../../types/intera
 import { checkQueueCurrentTrack, checkQueueExists } from '../../utils/validation/queueValidator';
 import { checkInVoiceChannel, checkSameVoiceChannel } from '../../utils/validation/voiceChannelValidator';
 
-class NowplayingPlayPauseButton extends BaseComponentInteraction {
+class ActionPauseResumeButton extends BaseComponentInteraction {
     constructor() {
-        super('nowplaying-playpause-button');
+        super('action-pauseresume-button');
     }
 
     async execute(params: BaseComponentParams): BaseComponentReturnType {
@@ -89,4 +89,4 @@ class NowplayingPlayPauseButton extends BaseComponentInteraction {
     }
 }
 
-export default new NowplayingPlayPauseButton();
+export default new ActionPauseResumeButton();
diff --git a/...ions/components/nowplaying-back-button.ts → ...ions/components/action-previous-button.ts b/...ions/components/nowplaying-back-button.ts → ...ions/components/action-previous-button.ts
@@ -6,9 +6,9 @@ import { checkQueueCurrentTrack, checkQueueExists } from '../../utils/validation
 import { checkInVoiceChannel, checkSameVoiceChannel } from '../../utils/validation/voiceChannelValidator';
 import { Logger } from 'pino';
 
-class NowplayingBackButton extends BaseComponentInteraction {
+class ActionPreviousButton extends BaseComponentInteraction {
     constructor() {
-        super('nowplaying-back-button');
+        super('action-previous-button');
     }
 
     async execute(params: BaseComponentParams): BaseComponentReturnType {
@@ -108,4 +108,4 @@ class NowplayingBackButton extends BaseComponentInteraction {
     }
 }
 
-export default new NowplayingBackButton();
+export default new ActionPreviousButton();
diff --git a/...ions/components/nowplaying-skip-button.ts → ...ractions/components/action-skip-button.ts b/...ions/components/nowplaying-skip-button.ts → ...ractions/components/action-skip-button.ts
@@ -5,9 +5,9 @@ import { BaseComponentParams, BaseComponentReturnType } from '../../types/intera
 import { checkQueueCurrentTrack, checkQueueExists } from '../../utils/validation/queueValidator';
 import { checkInVoiceChannel, checkSameVoiceChannel } from '../../utils/validation/voiceChannelValidator';
 
-class NowplayingSkipButton extends BaseComponentInteraction {
+class ActionSkipButton extends BaseComponentInteraction {
     constructor() {
-        super('nowplaying-skip-button');
+        super('action-skip-button');
     }
 
     async execute(params: BaseComponentParams): BaseComponentReturnType {
@@ -83,4 +83,4 @@ class NowplayingSkipButton extends BaseComponentInteraction {
     }
 }
 
-export default new NowplayingSkipButton();
+export default new ActionSkipButton();