Use ESM import for thumbnail_placeholder.svg instead of require (#6174)

FreeTubeApp · Nov 17, 2024 · 9c127ef · 9c127ef
1 parent f9736fb
commit 9c127ef
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 4 deletions.
diff --git a/src/renderer/components/ft-list-playlist/ft-list-playlist.js b/src/renderer/components/ft-list-playlist/ft-list-playlist.js
@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
 import { mapActions } from 'vuex'
 import { showToast } from '../../helpers/utils'
+import thumbnailPlaceholder from '../../assets/img/thumbnail_placeholder.svg'
 
 export default defineComponent({
   name: 'FtListPlaylist',
@@ -28,7 +29,7 @@ export default defineComponent({
       playlistId: '',
       channelId: '',
       title: 'Pop Music Playlist - Timeless Pop Songs (Updated Weekly 2020)',
-      thumbnail: require('../../assets/img/thumbnail_placeholder.svg'),
+      thumbnail: thumbnailPlaceholder,
       channelName: '#RedMusic: Just Hits',
       videoCount: 200,
     }

diff --git a/src/renderer/components/ft-list-video/ft-list-video.js b/src/renderer/components/ft-list-video/ft-list-video.js
@@ -13,6 +13,7 @@ import {
 } from '../../helpers/utils'
 import { deArrowData, deArrowThumbnail } from '../../helpers/sponsorblock'
 import debounce from 'lodash.debounce'
+import thumbnailPlaceholder from '../../assets/img/thumbnail_placeholder.svg'
 
 export default defineComponent({
   name: 'FtListVideo',
@@ -334,7 +335,7 @@ export default defineComponent({
 
     thumbnail: function () {
       if (this.thumbnailPreference === 'hidden') {
-        return require('../../assets/img/thumbnail_placeholder.svg')
+        return thumbnailPlaceholder
       }
 
       if (this.useDeArrowThumbnails && this.deArrowCache?.thumbnail != null) {

diff --git a/src/renderer/components/ft-playlist-selector/ft-playlist-selector.js b/src/renderer/components/ft-playlist-selector/ft-playlist-selector.js
@@ -1,6 +1,7 @@
 import { defineComponent } from 'vue'
 import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
 import { mapActions } from 'vuex'
+import thumbnailPlaceholder from '../../assets/img/thumbnail_placeholder.svg'
 
 export default defineComponent({
   name: 'FtPlaylistSelector',
@@ -37,7 +38,7 @@ export default defineComponent({
   data: function () {
     return {
       title: '',
-      thumbnail: require('../../assets/img/thumbnail_placeholder.svg'),
+      thumbnail: thumbnailPlaceholder,
       videoCount: 0,
 
       videoPresenceCountInPlaylistTextShouldBeVisible: false,

diff --git a/src/renderer/components/playlist-info/playlist-info.js b/src/renderer/components/playlist-info/playlist-info.js
@@ -15,6 +15,7 @@ import {
   showSaveDialog,
 } from '../../helpers/utils'
 import debounce from 'lodash.debounce'
+import thumbnailPlaceholder from '../../assets/img/thumbnail_placeholder.svg'
 
 export default defineComponent({
   name: 'PlaylistInfo',
@@ -202,7 +203,7 @@ export default defineComponent({
 
     thumbnail: function () {
       if (this.thumbnailPreference === 'hidden' || !this.firstVideoIdExists) {
-        return require('../../assets/img/thumbnail_placeholder.svg')
+        return thumbnailPlaceholder
       }
 
       let baseUrl = 'https://i.ytimg.com'