Merge pull request #20 from jeroentvb/dev

fix: images not rendering in 'add to playlist' contextmenu
jeroentvb · Feb 28, 2024 · b4315d8 · b4315d8
2 parents 8f9f899 + 5dbc0c2
commit b4315d8
Show file tree

Hide file tree

Showing 7 changed files with 464 additions and 558 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "playlist-icons",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "private": true,
   "scripts": {
     "build": "spicetify-creator",

diff --git a/src/app.tsx b/src/app.tsx
@@ -27,12 +27,12 @@ async function main() {
    const initPlaylistWatcher = () => {
       renderPlaylistImages(playlistData);
       observer = createMutationObserver(() => renderPlaylistImages(playlistData));
-   }
+   };
 
    /**
    * Init
    */
-   if (legacyMode) initPlaylistWatcher()
+   if (legacyMode) initPlaylistWatcher();
    if (showBigIcons) playlistElement.classList.add('big-icons');
 
    // Watch for context menu and add icons to it
@@ -47,7 +47,7 @@ async function main() {
          localStorage.setItem(LEGACY_MODE_KEY, JSON.stringify(!legacyMode));
          legacyMode = !legacyMode;
          if (legacyMode) {
-            initPlaylistWatcher()
+            initPlaylistWatcher();
          } else {
             observer?.disconnect();
             observer = undefined;

diff --git a/src/utils/add-to-playlist-icons.ts b/src/utils/add-to-playlist-icons.ts
@@ -17,7 +17,7 @@ export function watchAddToPlaylistMenu(playlistData: SpotifyApi.PlaylistObjectSi
                liElement.classList.add('add-to-playlist-item');
 
                createMutationObserver(() => {
-                  const nestedPlaylists = liElement.querySelector<HTMLLIElement>('.main-contextMenu-menu[tabindex="-1"] > div');
+                  const nestedPlaylists = liElement.querySelector<HTMLLIElement>('ul[tabindex="-1"] > div');
                   if (!nestedPlaylists) return;
 
                   renderPlaylistIcons(nestedPlaylists.children);
@@ -38,11 +38,9 @@ export function watchAddToPlaylistMenu(playlistData: SpotifyApi.PlaylistObjectSi
    };
 
    createMutationObserver(() => {
-      const addToPlaylistElement: HTMLDivElement | null = document.querySelector('#context-menu .main-contextMenu-menu[tabindex="-1"] > div');
+      const addToPlaylistElement: HTMLDivElement | null = document.querySelector('#context-menu ul[tabindex="-1"] > div');
       if (!addToPlaylistElement) return;
 
       renderPlaylistIcons(addToPlaylistElement.children);
    });
 }
-
-
diff --git a/src/utils/get-all-playlists.ts b/src/utils/get-all-playlists.ts
@@ -1,7 +1,4 @@
-const data = [];
-
-
-export default async function getAllPlaylistData(url: string, items: SpotifyApi.PlaylistObjectSimplified[] = []): Promise<SpotifyApi.PlaylistObjectSimplified[]> {
+export default async function getAllPlaylistData(url: string): Promise<SpotifyApi.PlaylistObjectSimplified[]> {
    const res: SpotifyApi.ListOfCurrentUsersPlaylistsResponse = await Spicetify.CosmosAsync.get(url);
 
    return [

diff --git a/src/utils/render-playlist-images.tsx b/src/utils/render-playlist-images.tsx
@@ -9,7 +9,7 @@ export async function renderPlaylistImages(items: SpotifyApi.PlaylistObjectSimpl
    const playlistAnchors = await getPlaylistAnchors();
 
    playlistAnchors.forEach((playlistAnchor) => {
-      const id = playlistAnchor.href.split('/').at(-1)!;
+      const id = playlistAnchor.href.split('/').at(-1) as string;
       const type = playlistAnchor.href.split('/').at(-2);
       const existingImg = imgMap.get(id);
 

diff --git a/tsconfig.json b/tsconfig.json
@@ -8,7 +8,8 @@
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "strict": true,
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "lib": ["es2022", "dom"],
   },
   "include": [
     "./src/**/*.*"