From 6a86331b63f8e5ac0f5fb59a21a23abdb2a90a84 Mon Sep 17 00:00:00 2001
From: waldo121 <17034517+waldo121@users.noreply.github.com>
Date: Tue, 17 Sep 2024 18:10:13 -0400
Subject: [PATCH 1/2] Add error handling on image loading for album covers &
 thumbnails

---
 packages/ui/lib/components/ContextPopup/index.tsx         | 7 ++++++-
 packages/ui/lib/components/Cover/index.tsx                | 6 +++++-
 .../lib/components/GridTrackTable/Cells/ThumbnailCell.tsx | 8 +++++++-
 .../ui/lib/components/MiniPlayer/MiniTrackInfo/index.tsx  | 6 +++++-
 packages/ui/lib/components/QueueItem/index.tsx            | 7 ++++++-
 5 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/packages/ui/lib/components/ContextPopup/index.tsx b/packages/ui/lib/components/ContextPopup/index.tsx
index 3eada32d3b..dc86ffaaa8 100644
--- a/packages/ui/lib/components/ContextPopup/index.tsx
+++ b/packages/ui/lib/components/ContextPopup/index.tsx
@@ -1,5 +1,7 @@
 import React, { useState } from 'react';
 import { Popup, PopupProps } from 'semantic-ui-react';
+import Img from 'react-image';
+import artPlaceholder from '../../../resources/media/art_placeholder.png';
 
 import styles from './styles.scss';
 
@@ -38,7 +40,10 @@ const ContextPopup: React.FC<ContextPopupProps> = ({
       <div className={styles.popup_header}>
         {thumb &&
         <div className={styles.popup_thumb}>
-          <img src={thumb} />
+          <Img 
+            src={thumb}
+            unloader={<img src={artPlaceholder}/>}
+            />
         </div>}
         <div className={styles.popup_info}>
           <div className={styles.popup_title}>
diff --git a/packages/ui/lib/components/Cover/index.tsx b/packages/ui/lib/components/Cover/index.tsx
index 82d70a5c97..ac383485f8 100644
--- a/packages/ui/lib/components/Cover/index.tsx
+++ b/packages/ui/lib/components/Cover/index.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import Img from 'react-image';
 import cx from 'classnames';
 
 import artPlaceholder from '../../../resources/media/art_placeholder.png';
@@ -15,7 +16,10 @@ const Cover: React.FC<CoverProps> = ({ cover = String(artPlaceholder) }) => (
     common.nuclear,
     styles.cover_container
   )}>
-    <img src={cover || String(artPlaceholder)} />
+    <Img 
+      src={cover || String(artPlaceholder)}
+      unloader={<img src={String(artPlaceholder)}/>} 
+     />
   </div>
 );
 
diff --git a/packages/ui/lib/components/GridTrackTable/Cells/ThumbnailCell.tsx b/packages/ui/lib/components/GridTrackTable/Cells/ThumbnailCell.tsx
index da4385493a..128f0fac92 100644
--- a/packages/ui/lib/components/GridTrackTable/Cells/ThumbnailCell.tsx
+++ b/packages/ui/lib/components/GridTrackTable/Cells/ThumbnailCell.tsx
@@ -4,6 +4,8 @@ import cx from 'classnames';
 
 import { Track } from '../../../types';
 import styles from '../styles.scss';
+import Img from 'react-image';
+import artPlaceholder from '../../../../resources/media/art_placeholder.png';
 
 export const ThumbnailCell: React.FC<CellProps<Track>> = ({
   cell,
@@ -12,5 +14,9 @@ export const ThumbnailCell: React.FC<CellProps<Track>> = ({
   className={cx(styles.grid_track_table_cell, styles.thumbnail_cell)}
   {...cell.getCellProps()}
 >
-  <img className={styles.thumbnail_cell_thumbnail} src={value} />
+  <Img 
+    className={styles.thumbnail_cell_thumbnail} 
+    src={value}
+    unloader={<img className={styles.thumbnail_cell_thumbnail} src={artPlaceholder}/>}
+    />
 </div>;
diff --git a/packages/ui/lib/components/MiniPlayer/MiniTrackInfo/index.tsx b/packages/ui/lib/components/MiniPlayer/MiniTrackInfo/index.tsx
index 2c21a3f86a..788a622da7 100644
--- a/packages/ui/lib/components/MiniPlayer/MiniTrackInfo/index.tsx
+++ b/packages/ui/lib/components/MiniPlayer/MiniTrackInfo/index.tsx
@@ -3,6 +3,7 @@ import { Icon } from 'semantic-ui-react';
 
 import styles from './styles.scss';
 import artPlaceholder from '../../../../resources/media/art_placeholder.png';
+import Img from 'react-image';
 
 import { TrackInfoProps } from '../../TrackInfo';
 
@@ -19,7 +20,10 @@ const MiniTrackInfo: React.FC<MiniTrackInfoProps> = ({
 }) => (
     <div className={styles.mini_track_info}>
       <div className={styles.mini_cover}>
-        <img src={cover} />
+      <Img
+        src={cover}
+        unloader={<img src={artPlaceholder} />}
+        />
       </div>
       {
         hasTracks &&
diff --git a/packages/ui/lib/components/QueueItem/index.tsx b/packages/ui/lib/components/QueueItem/index.tsx
index 443c7bc456..7892bdd421 100644
--- a/packages/ui/lib/components/QueueItem/index.tsx
+++ b/packages/ui/lib/components/QueueItem/index.tsx
@@ -10,6 +10,8 @@ import styles from './styles.scss';
 import artPlaceholder from '../../../resources/media/art_placeholder.png';
 import { getTrackArtist, getTrackTitle } from '../../utils';
 import { Track } from '../../types';
+import Img from 'react-image';
+
 
 export type QueueItemProps = {
   isCurrent: boolean;
@@ -46,7 +48,10 @@ export const QueueItem: React.FC<QueueItemProps> = ({
       <div className={styles.thumbnail}>
         {track.loading
           ? <Loader type='small' className={isCompact && styles.compact_loader} />
-          : <img src={track.thumbnail ?? artPlaceholder} />}
+          : <Img 
+              src={track.thumbnail ?? artPlaceholder}
+              unloader={<img src={artPlaceholder}/>}
+            />}
 
         <div
           data-testid='queue-item-remove'

From 69efba4830b8663c64e8520f7ef4e1f6f9369fbb Mon Sep 17 00:00:00 2001
From: waldo121 <17034517+waldo121@users.noreply.github.com>
Date: Tue, 17 Sep 2024 18:10:22 -0400
Subject: [PATCH 2/2] update snapshots

---
 .../AlbumViewContainer.test.tsx.snap          | 12 +----
 .../ArtistViewContainer.test.tsx.snap         | 21 ++------
 .../DashboardContainer.test.tsx.snap          | 14 +----
 .../DeezerPlaylistAdapter.test.tsx.snap       | 14 +----
 .../FavoritesContainer.tracks.test.tsx.snap   | 52 +++----------------
 .../LibraryViewContainer.test.tsx.snap        | 21 ++------
 .../PlayQueueContainer.test.tsx.snap          | 27 ----------
 .../PlaylistViewContainer.test.tsx.snap       | 14 +----
 .../SpotifyPlaylistAdapter.test.tsx.snap      | 14 +----
 .../ui/test/__snapshots__/cover.test.tsx.snap |  6 +--
 .../gridTrackTable.test.tsx.snap              | 21 ++------
 .../__snapshots__/miniPlayer.test.tsx.snap    |  6 +--
 .../__snapshots__/playerBar.test.tsx.snap     |  6 +--
 13 files changed, 30 insertions(+), 198 deletions(-)

diff --git a/packages/app/app/containers/AlbumViewContainer/__snapshots__/AlbumViewContainer.test.tsx.snap b/packages/app/app/containers/AlbumViewContainer/__snapshots__/AlbumViewContainer.test.tsx.snap
index ec13fc34f1..8e76c40a0d 100644
--- a/packages/app/app/containers/AlbumViewContainer/__snapshots__/AlbumViewContainer.test.tsx.snap
+++ b/packages/app/app/containers/AlbumViewContainer/__snapshots__/AlbumViewContainer.test.tsx.snap
@@ -580,11 +580,7 @@ exports[`Album view container should display an album 1`] = `
       >
         <div
           class="nuclear cover_container"
-        >
-          <img
-            src="test-file-stub"
-          />
-        </div>
+        />
       </div>
       <div
         class="player_controls"
@@ -747,11 +743,7 @@ exports[`Album view container should show that an album is still loading 1`] = `
       >
         <div
           class="nuclear cover_container"
-        >
-          <img
-            src="test-file-stub"
-          />
-        </div>
+        />
       </div>
       <div
         class="player_controls"
diff --git a/packages/app/app/containers/ArtistViewContainer/__snapshots__/ArtistViewContainer.test.tsx.snap b/packages/app/app/containers/ArtistViewContainer/__snapshots__/ArtistViewContainer.test.tsx.snap
index 52ef8994fa..8b4b438080 100644
--- a/packages/app/app/containers/ArtistViewContainer/__snapshots__/ArtistViewContainer.test.tsx.snap
+++ b/packages/app/app/containers/ArtistViewContainer/__snapshots__/ArtistViewContainer.test.tsx.snap
@@ -227,12 +227,7 @@ exports[`Artist view container should display an artist 1`] = `
                           <div
                             class="grid_track_table_cell thumbnail_cell"
                             role="cell"
-                          >
-                            <img
-                              class="thumbnail_cell_thumbnail"
-                              src="test-file-stub"
-                            />
-                          </div>
+                          />
                           <div
                             class="grid_track_table_cell favorite_cell"
                             data-testid="favorite-cell"
@@ -323,12 +318,7 @@ exports[`Artist view container should display an artist 1`] = `
                           <div
                             class="grid_track_table_cell thumbnail_cell"
                             role="cell"
-                          >
-                            <img
-                              class="thumbnail_cell_thumbnail"
-                              src="test-file-stub"
-                            />
-                          </div>
+                          />
                           <div
                             class="grid_track_table_cell favorite_cell"
                             data-testid="favorite-cell"
@@ -419,12 +409,7 @@ exports[`Artist view container should display an artist 1`] = `
                           <div
                             class="grid_track_table_cell thumbnail_cell"
                             role="cell"
-                          >
-                            <img
-                              class="thumbnail_cell_thumbnail"
-                              src="test-file-stub"
-                            />
-                          </div>
+                          />
                           <div
                             class="grid_track_table_cell favorite_cell"
                             data-testid="favorite-cell"
diff --git a/packages/app/app/containers/DashboardContainer/__snapshots__/DashboardContainer.test.tsx.snap b/packages/app/app/containers/DashboardContainer/__snapshots__/DashboardContainer.test.tsx.snap
index 574bcae2ae..f86d37720a 100644
--- a/packages/app/app/containers/DashboardContainer/__snapshots__/DashboardContainer.test.tsx.snap
+++ b/packages/app/app/containers/DashboardContainer/__snapshots__/DashboardContainer.test.tsx.snap
@@ -733,12 +733,7 @@ exports[`Dashboard container should display top tracks after going to top tracks
                         <div
                           class="grid_track_table_cell thumbnail_cell"
                           role="cell"
-                        >
-                          <img
-                            class="thumbnail_cell_thumbnail"
-                            src="top track album cover 1"
-                          />
-                        </div>
+                        />
                         <div
                           class="grid_track_table_cell favorite_cell"
                           data-testid="favorite-cell"
@@ -855,12 +850,7 @@ exports[`Dashboard container should display top tracks after going to top tracks
                         <div
                           class="grid_track_table_cell thumbnail_cell"
                           role="cell"
-                        >
-                          <img
-                            class="thumbnail_cell_thumbnail"
-                            src="top track album cover 2"
-                          />
-                        </div>
+                        />
                         <div
                           class="grid_track_table_cell favorite_cell"
                           data-testid="favorite-cell"
diff --git a/packages/app/app/containers/DeezerPlaylistAdapter/__snapshots__/DeezerPlaylistAdapter.test.tsx.snap b/packages/app/app/containers/DeezerPlaylistAdapter/__snapshots__/DeezerPlaylistAdapter.test.tsx.snap
index fab5440cee..81a25f2e31 100644
--- a/packages/app/app/containers/DeezerPlaylistAdapter/__snapshots__/DeezerPlaylistAdapter.test.tsx.snap
+++ b/packages/app/app/containers/DeezerPlaylistAdapter/__snapshots__/DeezerPlaylistAdapter.test.tsx.snap
@@ -263,12 +263,7 @@ exports[`Deezer playlist adapter should display a Deezer playlist 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="test-file-stub"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell favorite_cell"
                       data-testid="favorite-cell"
@@ -379,12 +374,7 @@ exports[`Deezer playlist adapter should display a Deezer playlist 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="test-file-stub"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell favorite_cell"
                       data-testid="favorite-cell"
diff --git a/packages/app/app/containers/FavoritesContainer/__snapshots__/FavoritesContainer.tracks.test.tsx.snap b/packages/app/app/containers/FavoritesContainer/__snapshots__/FavoritesContainer.tracks.test.tsx.snap
index 4e1f66bd3b..36ffa9d1ff 100644
--- a/packages/app/app/containers/FavoritesContainer/__snapshots__/FavoritesContainer.tracks.test.tsx.snap
+++ b/packages/app/app/containers/FavoritesContainer/__snapshots__/FavoritesContainer.tracks.test.tsx.snap
@@ -53,11 +53,7 @@ exports[`Favorite tracks view container should display empty state 1`] = `
       >
         <div
           class="nuclear cover_container"
-        >
-          <img
-            src="test-file-stub"
-          />
-        </div>
+        />
       </div>
       <div
         class="player_controls"
@@ -392,12 +388,7 @@ exports[`Favorite tracks view container should display favorite tracks 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="https://test-track-thumb-url"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell text_cell title_cell"
                       data-testid="title-cell"
@@ -508,12 +499,7 @@ exports[`Favorite tracks view container should display favorite tracks 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="https://test-track-thumb-url"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell text_cell title_cell"
                       data-testid="title-cell"
@@ -606,11 +592,7 @@ exports[`Favorite tracks view container should display favorite tracks 1`] = `
       >
         <div
           class="nuclear cover_container"
-        >
-          <img
-            src="test-file-stub"
-          />
-        </div>
+        />
       </div>
       <div
         class="player_controls"
@@ -961,12 +943,7 @@ exports[`Favorite tracks view container should show a popup when a track is clic
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="https://test-track-thumb-url"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell text_cell title_cell"
                       data-testid="title-cell"
@@ -1077,12 +1054,7 @@ exports[`Favorite tracks view container should show a popup when a track is clic
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="https://test-track-thumb-url"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell text_cell title_cell"
                       data-testid="title-cell"
@@ -1175,11 +1147,7 @@ exports[`Favorite tracks view container should show a popup when a track is clic
       >
         <div
           class="nuclear cover_container"
-        >
-          <img
-            src="test-file-stub"
-          />
-        </div>
+        />
       </div>
       <div
         class="player_controls"
@@ -1320,11 +1288,7 @@ exports[`Favorite tracks view container should show a popup when a track is clic
       >
         <div
           class="popup_thumb"
-        >
-          <img
-            src="https://test-track-thumb-url"
-          />
-        </div>
+        />
         <div
           class="popup_info"
         >
diff --git a/packages/app/app/containers/LibraryViewContainer/__snapshots__/LibraryViewContainer.test.tsx.snap b/packages/app/app/containers/LibraryViewContainer/__snapshots__/LibraryViewContainer.test.tsx.snap
index a8cd90b495..b47caf8a59 100644
--- a/packages/app/app/containers/LibraryViewContainer/__snapshots__/LibraryViewContainer.test.tsx.snap
+++ b/packages/app/app/containers/LibraryViewContainer/__snapshots__/LibraryViewContainer.test.tsx.snap
@@ -1000,12 +1000,7 @@ exports[`Library view container should display local library in simple list mode
                       <div
                         class="grid_track_table_cell thumbnail_cell"
                         role="cell"
-                      >
-                        <img
-                          class="thumbnail_cell_thumbnail"
-                          src="local track thumbnail 1"
-                        />
-                      </div>
+                      />
                       <div
                         class="grid_track_table_cell text_cell title_cell"
                         data-testid="title-cell"
@@ -1113,12 +1108,7 @@ exports[`Library view container should display local library in simple list mode
                       <div
                         class="grid_track_table_cell thumbnail_cell"
                         role="cell"
-                      >
-                        <img
-                          class="thumbnail_cell_thumbnail"
-                          src="local track thumbnail 2"
-                        />
-                      </div>
+                      />
                       <div
                         class="grid_track_table_cell text_cell title_cell"
                         data-testid="title-cell"
@@ -1226,12 +1216,7 @@ exports[`Library view container should display local library in simple list mode
                       <div
                         class="grid_track_table_cell thumbnail_cell"
                         role="cell"
-                      >
-                        <img
-                          class="thumbnail_cell_thumbnail"
-                          src="local track thumbnail 3"
-                        />
-                      </div>
+                      />
                       <div
                         class="grid_track_table_cell text_cell title_cell"
                         data-testid="title-cell"
diff --git a/packages/app/app/containers/PlayQueueContainer/__snapshots__/PlayQueueContainer.test.tsx.snap b/packages/app/app/containers/PlayQueueContainer/__snapshots__/PlayQueueContainer.test.tsx.snap
index 2edc34daff..08f1c32a12 100644
--- a/packages/app/app/containers/PlayQueueContainer/__snapshots__/PlayQueueContainer.test.tsx.snap
+++ b/packages/app/app/containers/PlayQueueContainer/__snapshots__/PlayQueueContainer.test.tsx.snap
@@ -202,9 +202,6 @@ exports[`Play Queue container should display a context popup on right click 1`]
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="https://test-track-thumb-url"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -261,9 +258,6 @@ exports[`Play Queue container should display a context popup on right click 1`]
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="https://test-track-thumb-url"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -320,9 +314,6 @@ exports[`Play Queue container should display a context popup on right click 1`]
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="test-file-stub"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -790,9 +781,6 @@ exports[`Play Queue container should display a context popup on right click for
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="https://test-track-thumb-url"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -849,9 +837,6 @@ exports[`Play Queue container should display a context popup on right click for
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="https://test-track-thumb-url"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -908,9 +893,6 @@ exports[`Play Queue container should display a context popup on right click for
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="test-file-stub"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -1337,9 +1319,6 @@ exports[`Play Queue container should display tracks in the queue 1`] = `
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="https://test-track-thumb-url"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -1396,9 +1375,6 @@ exports[`Play Queue container should display tracks in the queue 1`] = `
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="https://test-track-thumb-url"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
@@ -1455,9 +1431,6 @@ exports[`Play Queue container should display tracks in the queue 1`] = `
                 <div
                   class="thumbnail"
                 >
-                  <img
-                    src="test-file-stub"
-                  />
                   <div
                     class="thumbnail_overlay"
                     data-testid="queue-item-remove"
diff --git a/packages/app/app/containers/PlaylistViewContainer/__snapshots__/PlaylistViewContainer.test.tsx.snap b/packages/app/app/containers/PlaylistViewContainer/__snapshots__/PlaylistViewContainer.test.tsx.snap
index 32b051b9c3..4908ae42cf 100644
--- a/packages/app/app/containers/PlaylistViewContainer/__snapshots__/PlaylistViewContainer.test.tsx.snap
+++ b/packages/app/app/containers/PlaylistViewContainer/__snapshots__/PlaylistViewContainer.test.tsx.snap
@@ -292,12 +292,7 @@ exports[`Playlist view container should display a playlist 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="test thumbnail"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell favorite_cell"
                       data-testid="favorite-cell"
@@ -427,12 +422,7 @@ exports[`Playlist view container should display a playlist 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="test thumbnail 2"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell favorite_cell"
                       data-testid="favorite-cell"
diff --git a/packages/app/app/containers/SpotifyPlaylistAdapter/__snapshots__/SpotifyPlaylistAdapter.test.tsx.snap b/packages/app/app/containers/SpotifyPlaylistAdapter/__snapshots__/SpotifyPlaylistAdapter.test.tsx.snap
index 43e9ec2336..2c6e464caf 100644
--- a/packages/app/app/containers/SpotifyPlaylistAdapter/__snapshots__/SpotifyPlaylistAdapter.test.tsx.snap
+++ b/packages/app/app/containers/SpotifyPlaylistAdapter/__snapshots__/SpotifyPlaylistAdapter.test.tsx.snap
@@ -276,12 +276,7 @@ exports[`Spotfiy playlist adapter should display a Spotify playlist 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="thumb.jpg"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell favorite_cell"
                       data-testid="favorite-cell"
@@ -398,12 +393,7 @@ exports[`Spotfiy playlist adapter should display a Spotify playlist 1`] = `
                     <div
                       class="grid_track_table_cell thumbnail_cell"
                       role="cell"
-                    >
-                      <img
-                        class="thumbnail_cell_thumbnail"
-                        src="test-file-stub"
-                      />
-                    </div>
+                    />
                     <div
                       class="grid_track_table_cell favorite_cell"
                       data-testid="favorite-cell"
diff --git a/packages/ui/test/__snapshots__/cover.test.tsx.snap b/packages/ui/test/__snapshots__/cover.test.tsx.snap
index a3fa51bda0..334e2d3a36 100644
--- a/packages/ui/test/__snapshots__/cover.test.tsx.snap
+++ b/packages/ui/test/__snapshots__/cover.test.tsx.snap
@@ -4,10 +4,6 @@ exports[`(Snapshot) Cover should render correctly 1`] = `
 <DocumentFragment>
   <div
     class="nuclear cover_container"
-  >
-    <img
-      src="https://i.imgur.com/4euOws2.jpg"
-    />
-  </div>
+  />
 </DocumentFragment>
 `;
diff --git a/packages/ui/test/__snapshots__/gridTrackTable.test.tsx.snap b/packages/ui/test/__snapshots__/gridTrackTable.test.tsx.snap
index a077332643..9995eeaa55 100644
--- a/packages/ui/test/__snapshots__/gridTrackTable.test.tsx.snap
+++ b/packages/ui/test/__snapshots__/gridTrackTable.test.tsx.snap
@@ -362,12 +362,7 @@ exports[`(Snapshot) Grid track table - example data with all rows should render
               <div
                 class="grid_track_table_cell thumbnail_cell"
                 role="cell"
-              >
-                <img
-                  class="thumbnail_cell_thumbnail"
-                  src="https://i.imgur.com/4euOws2.jpg"
-                />
-              </div>
+              />
               <div
                 class="grid_track_table_cell favorite_cell"
                 data-testid="favorite-cell"
@@ -505,12 +500,7 @@ exports[`(Snapshot) Grid track table - example data with all rows should render
               <div
                 class="grid_track_table_cell thumbnail_cell"
                 role="cell"
-              >
-                <img
-                  class="thumbnail_cell_thumbnail"
-                  src="https://i.imgur.com/4euOws2.jpg"
-                />
-              </div>
+              />
               <div
                 class="grid_track_table_cell favorite_cell"
                 data-testid="favorite-cell"
@@ -648,12 +638,7 @@ exports[`(Snapshot) Grid track table - example data with all rows should render
               <div
                 class="grid_track_table_cell thumbnail_cell"
                 role="cell"
-              >
-                <img
-                  class="thumbnail_cell_thumbnail"
-                  src="https://i.imgur.com/4euOws2.jpg"
-                />
-              </div>
+              />
               <div
                 class="grid_track_table_cell favorite_cell"
                 data-testid="favorite-cell"
diff --git a/packages/ui/test/__snapshots__/miniPlayer.test.tsx.snap b/packages/ui/test/__snapshots__/miniPlayer.test.tsx.snap
index 35a8a3ac62..8b0d51b7c3 100644
--- a/packages/ui/test/__snapshots__/miniPlayer.test.tsx.snap
+++ b/packages/ui/test/__snapshots__/miniPlayer.test.tsx.snap
@@ -36,11 +36,7 @@ exports[`(Snapshot) Mini player should render correctly 1`] = `
     >
       <div
         class="mini_cover"
-      >
-        <img
-          src="https://i.imgur.com/4euOws2.jpg"
-        />
-      </div>
+      />
     </div>
     <div
       class="seekbar_wrapper"
diff --git a/packages/ui/test/__snapshots__/playerBar.test.tsx.snap b/packages/ui/test/__snapshots__/playerBar.test.tsx.snap
index fd271e41fd..6c83a5af07 100644
--- a/packages/ui/test/__snapshots__/playerBar.test.tsx.snap
+++ b/packages/ui/test/__snapshots__/playerBar.test.tsx.snap
@@ -23,11 +23,7 @@ exports[`(Snapshot) Player bar should render correctly 1`] = `
       >
         <div
           class="nuclear cover_container"
-        >
-          <img
-            src="https://i.imgur.com/4euOws2.jpg"
-          />
-        </div>
+        />
       </div>
       <div
         class="player_controls"