feat(bot): playback progress bar in nowplaying/songinfo embed

packages/bot/src/functions/music/commands/nowplaying.spec.ts

@@ -5,12 +5,15 @@ const requireQueueMock = jest.fn()
 const requireCurrentTrackMock = jest.fn()
 const interactionReplyMock = jest.fn()
 const resolveGuildQueueMock = jest.fn()
-const trackToDataMock = jest.fn((track: unknown) => ({ title: (track as { title: string }).title }))
+const trackToDataMock = jest.fn((track: unknown) => ({
+    title: (track as { title: string }).title,
+}))
 const buildTrackEmbedMock = jest.fn(() => ({ embed: 'nowplaying' }))
 
 jest.mock('../../../utils/command/commandValidations', () => ({
     requireQueue: (...args: unknown[]) => requireQueueMock(...args),
-    requireCurrentTrack: (...args: unknown[]) => requireCurrentTrackMock(...args),
+    requireCurrentTrack: (...args: unknown[]) =>
+        requireCurrentTrackMock(...args),
 }))
 
 jest.mock('../../../utils/general/interactionReply', () => ({
@@ -29,7 +32,10 @@ jest.mock('../../../utils/general/responseEmbeds', () => ({
 function makeInteraction() {
     return {
         guildId: 'guild-1',
-        user: { username: 'TestUser', displayAvatarURL: jest.fn(() => 'http://avatar') },
+        user: {
+            username: 'TestUser',
+            displayAvatarURL: jest.fn(() => 'http://avatar'),
+        },
     } as any
 }
 
@@ -42,14 +48,19 @@ describe('nowplaying command', () => {
 
     it('has correct command name and description', () => {
         expect(nowplayingCommand.data.name).toBe('nowplaying')
-        expect(nowplayingCommand.data.description).toContain('currently playing')
+        expect(nowplayingCommand.data.description).toContain(
+            'currently playing',
+        )
     })
 
     it('returns early when queue validation fails', async () => {
         requireQueueMock.mockResolvedValue(false)
         resolveGuildQueueMock.mockReturnValue({ queue: null })
 
-        await nowplayingCommand.execute({ client: {} as any, interaction: makeInteraction() } as any)
+        await nowplayingCommand.execute({
+            client: {} as any,
+            interaction: makeInteraction(),
+        } as any)
 
         expect(interactionReplyMock).not.toHaveBeenCalled()
     })
@@ -59,22 +70,61 @@ describe('nowplaying command', () => {
         const queue = { currentTrack: null }
         resolveGuildQueueMock.mockReturnValue({ queue })
 
-        await nowplayingCommand.execute({ client: {} as any, interaction: makeInteraction() } as any)
+        await nowplayingCommand.execute({
+            client: {} as any,
+            interaction: makeInteraction(),
+        } as any)
 
         expect(interactionReplyMock).not.toHaveBeenCalled()
     })
 
-    it('replies with track embed when track is playing', async () => {
+    it('replies with track embed including a progress bar when track is playing', async () => {
         const track = { title: 'Bohemian Rhapsody', author: 'Queen' }
-        const queue = { currentTrack: track }
+        const createProgressBar = jest.fn(() => '00:30 ┃🔘▬▬ 05:55')
+        const queue = { currentTrack: track, node: { createProgressBar } }
         resolveGuildQueueMock.mockReturnValue({ queue })
 
-        await nowplayingCommand.execute({ client: {} as any, interaction: makeInteraction() } as any)
+        await nowplayingCommand.execute({
+            client: {} as any,
+            interaction: makeInteraction(),
+        } as any)
 
         expect(trackToDataMock).toHaveBeenCalledWith(track)
-        const [, status, user] = buildTrackEmbedMock.mock.calls[0] as [unknown, string, unknown]
+        expect(createProgressBar).toHaveBeenCalledWith({
+            length: 18,
+            timecodes: true,
+        })
+        const [, status, user, options] = buildTrackEmbedMock.mock.calls[0] as [
+            unknown,
+            string,
+            unknown,
+            { progressBar: string | null },
+        ]
         expect(status).toBe('playing')
         expect(user).toMatchObject({ tag: 'TestUser' })
+        expect(options).toEqual({ progressBar: '00:30 ┃🔘▬▬ 05:55' })
         expect(interactionReplyMock).toHaveBeenCalled()
     })
+
+    it('passes a null progress bar for a livestream (no position)', async () => {
+        const track = { title: 'Lofi Radio', author: 'Chillhop' }
+        const queue = {
+            currentTrack: track,
+            node: { createProgressBar: jest.fn(() => null) },
+        }
+        resolveGuildQueueMock.mockReturnValue({ queue })
+
+        await nowplayingCommand.execute({
+            client: {} as any,
+            interaction: makeInteraction(),
+        } as any)
+
+        const [, , , options] = buildTrackEmbedMock.mock.calls[0] as [
+            unknown,
+            string,
+            unknown,
+            { progressBar: string | null },
+        ]
+        expect(options).toEqual({ progressBar: null })
+    })
 })

packages/bot/src/functions/music/commands/songinfo.ts

@@ -1,13 +1,16 @@
 import { SlashCommandBuilder } from '@discordjs/builders'
 import Command from '../../../models/Command'
 import { assertDefined } from '@lucky/shared/utils/guards'
-import { interactionReply } from "../../../utils/general/interactionReply"
-import { buildTrackEmbed, trackToData } from '../../../utils/general/responseEmbeds'
-import type { CommandExecuteParams } from "../../../types/CommandData"
+import { interactionReply } from '../../../utils/general/interactionReply'
+import {
+    buildTrackEmbed,
+    trackToData,
+} from '../../../utils/general/responseEmbeds'
+import type { CommandExecuteParams } from '../../../types/CommandData'
 import {
     requireQueue,
     requireCurrentTrack,
-} from "../../../utils/command/commandValidations"
+} from '../../../utils/command/commandValidations'
 import { resolveGuildQueue } from '../../../utils/music/queueResolver'
 
 export default new Command({
@@ -24,11 +27,26 @@ export default new Command({
         if (!(await requireQueue(queue, interaction))) return
         if (!(await requireCurrentTrack(queue, interaction))) return
 
-        const trackData = trackToData(assertDefined(track, 'track present after requireCurrentTrack guard'))
-        const embed = buildTrackEmbed(trackData, 'playing', {
-            tag: interaction.user.username,
-            displayAvatarURL: interaction.user.displayAvatarURL,
-        })
+        const trackData = trackToData(
+            assertDefined(
+                track,
+                'track present after requireCurrentTrack guard',
+            ),
+        )
+        // Snapshot the current playback position as a progress bar with
+        // elapsed/total timecodes. Null for livestreams / no-duration tracks.
+        const progressBar =
+            queue?.node.createProgressBar({ length: 18, timecodes: true }) ??
+            null
+        const embed = buildTrackEmbed(
+            trackData,
+            'playing',
+            {
+                tag: interaction.user.username,
+                displayAvatarURL: interaction.user.displayAvatarURL,
+            },
+            { progressBar },
+        )
 
         await interactionReply({
             interaction,

packages/bot/src/utils/general/responseEmbeds/buildTrackEmbed.spec.ts

@@ -57,6 +57,29 @@ describe('buildTrackEmbed', () => {
         },
     )
 
+    it('adds a Progress field when a progress bar is provided', () => {
+        const bar = '00:30 ┃🔘▬▬▬ 05:55'
+        const embed = buildTrackEmbed(baseTrack, 'playing', fakeUser, {
+            progressBar: bar,
+        })
+        const progress = embed.data.fields?.find((f) => f.name === 'Progress')
+        expect(progress?.value).toBe(bar)
+        expect(progress?.inline).toBe(false)
+    })
+
+    it('omits the Progress field when no/null progress bar', () => {
+        const noOpts = buildTrackEmbed(baseTrack, 'playing', fakeUser)
+        const nullBar = buildTrackEmbed(baseTrack, 'playing', fakeUser, {
+            progressBar: null,
+        })
+        expect(noOpts.data.fields?.some((f) => f.name === 'Progress')).toBe(
+            false,
+        )
+        expect(nullBar.data.fields?.some((f) => f.name === 'Progress')).toBe(
+            false,
+        )
+    })
+
     it('handles missing/unknown fields and edge cases', () => {
         // Missing title
         const noTitle = buildTrackEmbed(

packages/bot/src/utils/general/responseEmbeds/buildTrackEmbed.ts

@@ -23,10 +23,21 @@ const KIND_LABELS: Record<TrackEmbedKind, string> = {
     history: 'From History',
 }
 
+export type TrackEmbedOptions = {
+    /**
+     * A pre-rendered playback progress bar (e.g. discord-player's
+     * `queue.node.createProgressBar()`). Rendered as its own field so a user
+     * can see how far into the track playback is. Null/undefined for tracks
+     * with no live position (queued/recommended/history, or a livestream).
+     */
+    progressBar?: string | null
+}
+
 export function buildTrackEmbed(
     track: TrackData,
     kind: TrackEmbedKind,
     requestedBy?: Pick<User, 'tag' | 'displayAvatarURL'>,
+    options?: TrackEmbedOptions,
 ): EmbedBuilder {
     const badge = detectSource(track)
     const label = KIND_LABELS[kind]
@@ -55,6 +66,14 @@ export function buildTrackEmbed(
     }
     fields.push({ name: 'Source', value: badge.label, inline: true })
 
+    if (options?.progressBar) {
+        fields.push({
+            name: 'Progress',
+            value: options.progressBar,
+            inline: false,
+        })
+    }
+
     embed.addFields(fields)
     return embed
 }