feat(music-module): playlist

apps/docs/package.json

@@ -12,7 +12,7 @@
     "@vue/eslint-config-prettier": "9.0.0",
     "@vue/eslint-config-typescript": "12.0.0",
     "@vue/tsconfig": "0.5.1",
-    "autoprefixer": "10.4.17",
+    "autoprefixer": "10.4.18",
     "eslint": "8.57.0",
     "eslint-plugin-vue": "9.22.0",
     "postcss": "8.4.35",

packages/music-module/CHANGELOG.md

@@ -14,6 +14,8 @@ See also: [GitHub Releases](https://github.com/leomotors/cocoa-discord/releases)
 
 - chore: removed patch script as play-dl is fixed
 - feat!: this.style changed to this.getStyle to allow dynamic style
+- feat: embed now tell if playlist is added
+- fix: prevent printing queue from exceeding characters limit
 
 ## [1.1.0] - 2023-09-23
 

packages/music-module/src/adapters/youtube.ts

@@ -136,7 +136,7 @@ export async function addMusicToQueue(
     state.musicQueue.push(...toAdd);
 
     if (!state.isPlaying) playNextMusicInQueue(guildId);
-    return toAdd[0]!;
+    return toAdd;
   } else {
     const toAdd = {
       data: new YoutubeAdapter(videos),

packages/music-module/src/core/utils.spec.ts

@@ -1,6 +1,6 @@
 import { describe, expect, it } from "vitest";
 
-import { beautifyNumber, parseLength, pickLast } from "./utils.js";
+import { beautifyNumber, parseLength, pickFirst, pickLast } from "./utils.js";
 
 describe("Utils", () => {
   it("pickLast", () => {
@@ -16,6 +16,23 @@ describe("Utils", () => {
     expect(pickLast([{ a: 1 }, { b: 2 }, { c: 3 }])).toEqual({ c: 3 });
   });
 
+  it("pickFirst", () => {
+    expect(pickFirst([])).toBe(undefined);
+
+    expect(pickFirst([1])).toBe(1);
+    expect(pickFirst([1, 2, 3])).toBe(1);
+
+    expect(pickFirst(["a"])).toBe("a");
+    expect(pickFirst(["a", "b", "c"])).toBe("a");
+
+    expect(pickFirst([{ a: 1 }])).toEqual({ a: 1 });
+    expect(pickFirst([{ a: 1 }, { b: 2 }, { c: 3 }])).toEqual({ a: 1 });
+
+    expect(pickFirst("hello")).toBe("hello");
+    expect(pickFirst(123)).toBe(123);
+    expect(pickFirst({ a: 1 })).toEqual({ a: 1 });
+  });
+
   it("parseLength", () => {
     expect(parseLength(0)).toBe("0:00");
     expect(parseLength(1)).toBe("0:01");

packages/music-module/src/core/utils.ts

@@ -1,12 +1,21 @@
 /**
  * Get last element of an array, returns undefined if array is empty
  *
- * Implemented by arr[arr.length - 1]
+ * Implemented by `arr[arr.length - 1]`
  */
 export function pickLast<T>(arr: T[]) {
   return arr[arr.length - 1];
 }
 
+/**
+ * Get first element of an array, returns itself if not an array
+ *
+ * Implemented by `Array.isArray(arr) ? arr[0] : arr`
+ */
+export function pickFirst<T>(arr: T | T[]) {
+  return Array.isArray(arr) ? arr[0] : arr;
+}
+
 /**
  * Parse seconds into `m:ss` format
  */

packages/music-module/src/modules/music.module.ts

@@ -18,6 +18,7 @@ import { search } from "play-dl";
 
 import { addMusicToQueue } from "../adapters/youtube.js";
 import { SearchEmbedIdPrefix, generateId } from "../core/constants.js";
+import { pickFirst } from "../core/utils.js";
 import {
   clearMusicQueue,
   getState,
@@ -74,14 +75,29 @@ export class Music extends SlashModuleClass {
       return;
     }
 
-    // TODO Handle playlist case (Playlist embed)
-    const embed = video.data.makeEmbed(
+    const videoForEmbed = pickFirst(video)!;
+
+    const embed = videoForEmbed.data.makeEmbed(
       ctx,
       this.getStyle(),
       ctx.user.id,
       "Added to Queue",
     );
 
+    if (Array.isArray(video) && video.length > 1) {
+      embed.setTitle("Added Playlist to Queue");
+
+      const otherTitles = [video[1]?.data.getTitle(), video[2]?.data.getTitle()]
+        .filter(Boolean)
+        .join("\n");
+      const moreText =
+        video.length > 3 ? `\n... and ${video.length - 3} more` : "";
+
+      embed.setDescription(
+        embed.data.description + `\n${otherTitles}${moreText}`,
+      );
+    }
+
     await ctx.followUp({ embeds: [embed] });
   }
 
@@ -252,7 +268,7 @@ export class Music extends SlashModuleClass {
       await interaction.message.edit({
         embeds: [
           emb.setDescription(newtext),
-          video.data.makeEmbed(
+          pickFirst(video)!.data.makeEmbed(
             ctx,
             this.getStyle(),
             ctx.user.id,
@@ -293,9 +309,13 @@ export class Music extends SlashModuleClass {
     if (q?.length > 0) text += "**Queue**\n";
 
     for (const [index, m] of Object.entries(q ?? [])) {
+      if (+index >= 20) break;
+
       text += `**${+index + 1})** ${m.data.getTitle()}\n`;
     }
 
+    if (q?.length > 20) text += `... and ${q.length - 20} more`;
+
     const emb = this.getStyle()
       .use(ctx)
       .setTitle("Music Queue")