Merge branch 'fix/temp/api-ver' into feature/playlist-search-videos-i…

…n-one-user-playlist-2

* fix/temp/api-ver: (37 commits)
  workaround
  Hide date and views separator on the watch page when views are hidden (#4697)
  Translated using Weblate (Ukrainian)
  Translated using Weblate (Polish)
  Translated using Weblate (Estonian)
  Bump webpack from 5.90.1 to 5.90.3 (#4696)
  Bump sass from 1.70.0 to 1.71.0 (#4693)
  Bump electron from 28.2.2 to 28.2.3 (#4692)
  Bump the stylelint group with 1 update (#4691)
  Remove unused isLoading from ft-community-post (#4684)
  Include swiper version in CSS file name, for cache busting (#4685)
  Translated using Weblate (Chinese (Traditional))
  Fix local API erroring when the view count is missing on the channel shorts tab (#4689)
  Translated using Weblate (Croatian)
  Translated using Weblate (Polish)
  Fix Hungarian Locale Name (#4686)
  Translated using Weblate (Dutch)
  Translated using Weblate (French)
  Translated using Weblate (Spanish)
  Bump marked from 11.2.0 to 12.0.0 (#4638)
  ...

_scripts/webpack.renderer.config.js

@@ -11,6 +11,8 @@ const CopyWebpackPlugin = require('copy-webpack-plugin')
 
 const isDevMode = process.env.NODE_ENV === 'development'
 
+const { version: swiperVersion } = JSON.parse(readFileSync(path.join(__dirname, '../node_modules/swiper/package.json')))
+
 const processLocalesPlugin = new ProcessLocalesPlugin({
   compress: !isDevMode,
   inputDir: path.join(__dirname, '../static/locales'),
@@ -118,7 +120,8 @@ const config = {
       'process.env.IS_ELECTRON': true,
       'process.env.IS_ELECTRON_MAIN': false,
       'process.env.LOCALE_NAMES': JSON.stringify(processLocalesPlugin.localeNames),
-      'process.env.GEOLOCATION_NAMES': JSON.stringify(readdirSync(path.join(__dirname, '..', 'static', 'geolocations')).map(filename => filename.replace('.json', '')))
+      'process.env.GEOLOCATION_NAMES': JSON.stringify(readdirSync(path.join(__dirname, '..', 'static', 'geolocations')).map(filename => filename.replace('.json', ''))),
+      'process.env.SWIPER_VERSION': `'${swiperVersion}'`
     }),
     new HtmlWebpackPlugin({
       excludeChunks: ['processTaskWorker'],
@@ -137,7 +140,7 @@ const config = {
       patterns: [
         {
           from: path.join(__dirname, '../node_modules/swiper/modules/{a11y,navigation,pagination}-element.css').replaceAll('\\', '/'),
-          to: 'swiper.css',
+          to: `swiper-${swiperVersion}.css`,
           context: path.join(__dirname, '../node_modules/swiper/modules'),
           transformAll: (assets) => {
             return Buffer.concat(assets.map(asset => asset.data))

_scripts/webpack.web.config.js

@@ -11,6 +11,8 @@ const ProcessLocalesPlugin = require('./ProcessLocalesPlugin')
 
 const isDevMode = process.env.NODE_ENV === 'development'
 
+const { version: swiperVersion } = JSON.parse(fs.readFileSync(path.join(__dirname, '../node_modules/swiper/package.json')))
+
 const config = {
   name: 'web',
   mode: process.env.NODE_ENV,
@@ -114,6 +116,7 @@ const config = {
     new webpack.DefinePlugin({
       'process.env.IS_ELECTRON': false,
       'process.env.IS_ELECTRON_MAIN': false,
+      'process.env.SWIPER_VERSION': `'${swiperVersion}'`,
 
       // video.js' vhs-utils supports both atob() in web browsers and Buffer in node
       // As the FreeTube web build only runs in web browsers, we can override their check for atob() here: https://github.com/videojs/vhs-utils/blob/main/src/decode-b64-to-uint8-array.js#L3
@@ -145,7 +148,7 @@ const config = {
       patterns: [
         {
           from: path.join(__dirname, '../node_modules/swiper/modules/{a11y,navigation,pagination}-element.css').replaceAll('\\', '/'),
-          to: 'swiper.css',
+          to: `swiper-${swiperVersion}.css`,
           context: path.join(__dirname, '../node_modules/swiper/modules'),
           transformAll: (assets) => {
             return Buffer.concat(assets.map(asset => asset.data))

package.json

@@ -62,7 +62,7 @@
     "autolinker": "^4.0.0",
     "electron-context-menu": "^3.6.1",
     "lodash.debounce": "^4.0.8",
-    "marked": "^11.2.0",
+    "marked": "^12.0.0",
     "path-browserify": "^1.0.1",
     "process": "^0.11.10",
     "swiper": "^11.0.6",
@@ -84,12 +84,12 @@
     "@babel/eslint-parser": "^7.23.10",
     "@babel/plugin-proposal-class-properties": "^7.18.6",
     "@babel/preset-env": "^7.23.9",
-    "@double-great/stylelint-a11y": "^3.0.1",
+    "@double-great/stylelint-a11y": "^3.0.2",
     "babel-loader": "^9.1.3",
     "copy-webpack-plugin": "^12.0.2",
     "css-loader": "^6.10.0",
     "css-minimizer-webpack-plugin": "^6.0.0",
-    "electron": "^28.2.2",
+    "electron": "^28.2.3",
     "electron-builder": "^24.9.1",
     "eslint": "^8.56.0",
     "eslint-config-prettier": "^9.1.0",
@@ -113,7 +113,7 @@
     "postcss-scss": "^4.0.9",
     "prettier": "^2.8.8",
     "rimraf": "^5.0.5",
-    "sass": "^1.70.0",
+    "sass": "^1.71.0",
     "sass-loader": "^14.1.0",
     "stylelint": "^16.2.1",
     "stylelint-config-sass-guidelines": "^11.0.0",
@@ -124,7 +124,7 @@
     "vue-devtools": "^5.1.4",
     "vue-eslint-parser": "^9.4.2",
     "vue-loader": "^15.10.0",
-    "webpack": "^5.90.1",
+    "webpack": "^5.90.3",
     "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^4.15.1",
     "webpack-watch-external-files-plugin": "^3.0.0",

src/renderer/components/data-settings/data-settings.js

@@ -1133,7 +1133,7 @@ export default defineComponent({
           })
 
           if (process.env.IS_ELECTRON && this.backendFallback && this.backendPreference === 'invidious') {
-            showToast(this.$t('Falling back to the local API'))
+            showToast(this.$t('Falling back to Local API'))
             resolve(this.getChannelInfoLocal(channelId))
           } else {
             resolve([])

src/renderer/components/ft-age-restricted/ft-age-restricted.js

@@ -3,10 +3,14 @@ import { defineComponent } from 'vue'
 export default defineComponent({
   name: 'FtAgeRestricted',
   props: {
-    contentTypeString: {
-      type: String,
-      required: true
-    }
+    isChannel: {
+      type: Boolean,
+      default: false,
+    },
+    isVideo: {
+      type: Boolean,
+      default: false,
+    },
   },
   computed: {
     emoji: function () {
@@ -15,8 +19,11 @@ export default defineComponent({
     },
 
     restrictedMessage: function () {
-      const contentType = this.$t('Age Restricted.Type.' + this.contentTypeString)
-      return this.$t('Age Restricted.This {videoOrPlaylist} is age restricted', { videoOrPlaylist: contentType })
+      if (this.isChannel) {
+        return this.$t('Age Restricted.This channel is age restricted')
+      }
+
+      return this.$t('Age Restricted.This video is age restricted:')
     }
   }
 })

src/renderer/components/ft-community-post/ft-community-post.js

@@ -40,7 +40,6 @@ export default defineComponent({
       voteCount: '',
       postContent: '',
       commentCount: '',
-      isLoading: true,
       author: '',
       authorId: '',
     }
@@ -73,7 +72,7 @@ export default defineComponent({
         injectStylesUrls: [
           // This file is created with the copy webpack plugin in the web and renderer webpack configs.
           // If you add more modules, please remember to add their CSS files to the list in webpack config files.
-          createWebURL('/swiper.css')
+          createWebURL(`/swiper-${process.env.SWIPER_VERSION}.css`)
         ],
 
         a11y: true,
@@ -132,7 +131,6 @@ export default defineComponent({
       this.type = (this.data.postContent !== null && this.data.postContent !== undefined) ? this.data.postContent.type : 'text'
       this.author = this.data.author
       this.authorId = this.data.authorId
-      this.isLoading = false
     },
 
     getBestQualityImage(imageArray) {

src/renderer/components/ft-community-post/ft-community-post.vue

@@ -1,6 +1,5 @@
 <template>
   <div
-    v-if="!isLoading"
     class="ft-list-post ft-list-item outside"
     :appearance="appearance"
     :class="{ list: listType === 'list', grid: listType === 'grid' }"

src/renderer/components/ft-list-video/ft-list-video.vue

@@ -152,7 +152,7 @@
       <ft-icon-button
         class="optionsButton"
         :icon="['fas', 'ellipsis-v']"
-        title="More Options"
+        :title="$t('Video.More Options')"
         theme="base-no-default"
         :size="16"
         :use-shadow="false"

src/renderer/components/subscriptions-community/subscriptions-community.js

@@ -200,7 +200,7 @@ export default defineComponent({
             copyToClipboard(err)
           })
           if (process.env.IS_ELECTRON && this.backendPreference === 'invidious' && this.backendFallback) {
-            showToast(this.$t('Falling back to the local API'))
+            showToast(this.$t('Falling back to Local API'))
             resolve(this.getChannelPostsLocal(channel))
           } else {
             resolve([])

src/renderer/components/subscriptions-live/subscriptions-live.js

@@ -282,7 +282,7 @@ export default defineComponent({
               break
             case 1:
               if (process.env.IS_ELECTRON && this.backendFallback) {
-                showToast(this.$t('Falling back to the local API'))
+                showToast(this.$t('Falling back to Local API'))
                 resolve(this.getChannelLiveLocal(channel, failedAttempts + 1))
               } else {
                 resolve([])
@@ -321,7 +321,7 @@ export default defineComponent({
             return this.getChannelLiveInvidious(channel, failedAttempts + 1)
           case 1:
             if (process.env.IS_ELECTRON && this.backendFallback) {
-              showToast(this.$t('Falling back to the local API'))
+              showToast(this.$t('Falling back to Local API'))
               return this.getChannelLiveLocalRSS(channel, failedAttempts + 1)
             } else {
               return []

src/renderer/components/subscriptions-shorts/subscriptions-shorts.js

@@ -213,7 +213,7 @@ export default defineComponent({
         switch (failedAttempts) {
           case 0:
             if (process.env.IS_ELECTRON && this.backendFallback) {
-              showToast(this.$t('Falling back to the local API'))
+              showToast(this.$t('Falling back to Local API'))
               return this.getChannelShortsLocal(channel, failedAttempts + 1)
             } else {
               return []

src/renderer/components/subscriptions-videos/subscriptions-videos.js

@@ -279,7 +279,7 @@ export default defineComponent({
               break
             case 1:
               if (process.env.IS_ELECTRON && this.backendFallback) {
-                showToast(this.$t('Falling back to the local API'))
+                showToast(this.$t('Falling back to Local API'))
                 resolve(this.getChannelVideosLocalScraper(channel, failedAttempts + 1))
               } else {
                 resolve([])
@@ -319,7 +319,7 @@ export default defineComponent({
             return this.getChannelVideosInvidiousScraper(channel, failedAttempts + 1)
           case 1:
             if (process.env.IS_ELECTRON && this.backendFallback) {
-              showToast(this.$t('Falling back to the local API'))
+              showToast(this.$t('Falling back to Local API'))
               return this.getChannelVideosLocalRSS(channel, failedAttempts + 1)
             } else {
               return []

src/renderer/components/watch-video-comments/watch-video-comments.js

@@ -293,7 +293,7 @@ export default defineComponent({
           copyToClipboard(err)
         })
         if (process.env.IS_ELECTRON && this.backendFallback && this.backendPreference === 'invidious') {
-          showToast(this.$t('Falling back to local API'))
+          showToast(this.$t('Falling back to Local API'))
           this.getCommentDataLocal()
         } else {
           this.isLoading = false

src/renderer/components/watch-video-comments/watch-video-comments.vue

@@ -268,7 +268,7 @@
       v-else-if="showComments && !isLoading"
     >
       <h3 class="noCommentMsg">
-        {{ $t("There are no comments available for this video") }}
+        {{ $t("Comments.There are no comments available for this video") }}
       </h3>
     </div>
     <h4

src/renderer/components/watch-video-info/watch-video-info.vue

@@ -9,7 +9,10 @@
     </div>
     <div class="videoMetrics">
       <div class="datePublishedAndViewCount">
-        {{ publishedString }} {{ dateString }} • {{ parsedViewCount }}
+        {{ publishedString }} {{ dateString }}
+        <template v-if="!hideVideoViews">
+          • {{ parsedViewCount }}
+        </template>
       </div>
       <div
         v-if="!hideVideoLikesAndDislikes"

src/renderer/helpers/api/local.js

@@ -189,7 +189,7 @@ export async function getLocalVideoInfo(id, attemptBypass = false) {
     // that's fine as we have most of the information from the original getInfo request
     info = await innertube.getBasicInfo(id, 'TV_EMBEDDED')
   } else {
-    const innertube = await createInnertube({ withPlayer: true, generateSessionLocally: false })
+    const innertube = await createInnertube({ withPlayer: true, generateSessionLocally: true })
     player = innertube.actions.session.player
 
     info = await innertube.getInfo(id)
@@ -539,7 +539,7 @@ export function parseLocalChannelShorts(shorts, channelId, channelName) {
       title: short.title.text,
       author: channelName,
       authorId: channelId,
-      viewCount: parseLocalSubscriberCount(short.views.text),
+      viewCount: short.views.isEmpty() ? null : parseLocalSubscriberCount(short.views.text),
       lengthSeconds: ''
     }
   })

src/renderer/store/modules/invidious.js

@@ -39,22 +39,21 @@ const actions = {
         console.error(err)
       }
     }
+
     // If the invidious instance fetch isn't returning anything interpretable
     if (instances.length === 0) {
       // Fallback: read from static file
       const fileName = 'invidious-instances.json'
       /* eslint-disable-next-line n/no-path-concat */
       const fileLocation = process.env.NODE_ENV === 'development' ? './static/' : `${__dirname}/static/`
       const filePath = `${fileLocation}${fileName}`
-      if (!process.env.IS_ELECTRON) {
-        console.warn('reading static file for invidious instances')
-        const fileData = process.env.IS_ELECTRON ? await fs.readFile(filePath, 'utf8') : await (await fetch(createWebURL(filePath))).text()
-        instances = JSON.parse(fileData).filter(e => {
-          return process.env.IS_ELECTRON || e.cors
-        }).map(e => {
-          return e.url
-        })
-      }
+      console.warn('reading static file for invidious instances')
+      const fileData = process.env.IS_ELECTRON ? await fs.readFile(filePath, 'utf8') : await (await fetch(createWebURL(filePath))).text()
+      instances = JSON.parse(fileData).filter(e => {
+        return process.env.IS_ELECTRON || e.cors
+      }).map(e => {
+        return e.url
+      })
     }
     commit('setInvidiousInstancesList', instances)
   },

src/renderer/store/modules/settings.js

@@ -289,7 +289,7 @@ const state = {
   videoPlaybackRateInterval: 0.25,
   downloadAskPath: true,
   downloadFolderPath: '',
-  downloadBehavior: 'download',
+  downloadBehavior: 'open',
   enableScreenshot: false,
   screenshotFormat: 'png',
   screenshotQuality: 95,

src/renderer/views/Channel/Channel.vue

@@ -417,7 +417,7 @@
     <ft-age-restricted
       v-else-if="!isLoading && (!isFamilyFriendly && showFamilyFriendlyOnly)"
       class="ageRestricted"
-      :content-type-string="'Channel'"
+      :is-channel="true"
     />
   </div>
 </template>

src/renderer/views/Playlist/Playlist.js

@@ -284,7 +284,7 @@ export default defineComponent({
         const dateString = new Date(result.updated * 1000)
         this.lastUpdated = dateString.toLocaleDateString(this.currentLocale, { year: 'numeric', month: 'short', day: 'numeric' })
 
-        this.allPlaylistItems = result.videos
+        this.playlistItems = result.videos
 
         this.isLoading = false
       }).catch((err) => {

src/renderer/views/Watch/Watch.vue

@@ -87,7 +87,7 @@
     <ft-age-restricted
       v-if="(!isLoading && !isFamilyFriendly && showFamilyFriendlyOnly)"
       class="ageRestricted"
-      :content-type-string="'Video'"
+      :is-video="true"
     />
     <div
       v-if="(isFamilyFriendly || !showFamilyFriendlyOnly)"

static/locales/ar.yaml

@@ -931,6 +931,7 @@ Video:
   Pause on Current Video: توقف مؤقتًا على الفيديو الحالي
   Unhide Channel: عرض القناة
   Hide Channel: إخفاء القناة
+  More Options: المزيد من الخيارات
 Videos:
   #& Sort By
   Sort By:
@@ -1007,7 +1008,7 @@ Up Next: 'التالي'
 Local API Error (Click to copy): 'خطأ API المحلي (انقر للنسخ)'
 Invidious API Error (Click to copy): 'خطأ Invidious API ( انقر للنسخ)'
 Falling back to Invidious API: 'التراجع إلى Invidious API'
-Falling back to the local API: 'التراجع إلى API المحلي'
+Falling back to Local API: 'التراجع إلى API المحلي'
 Subscriptions have not yet been implemented: 'لم يتم تنفيذ الاشتراكات بعد'
 Loop is now disabled: 'تم تعطيل التكرار'
 Loop is now enabled: 'تم تمكين التكرار'
@@ -1131,11 +1132,6 @@ Starting download: بدء تنزيل "{videoTitle}"
 Screenshot Success: تم حفظ لقطة الشاشة كا"{filePath}"
 Screenshot Error: فشل أخذ لقطة للشاشة. {error}
 New Window: نافذة جديدة
-Age Restricted:
-  Type:
-    Channel: القناة
-    Video: فيديو
-  This {videoOrPlaylist} is age restricted: 'هذا {videoOrPlaylist} مقيد بالعمر'
 Channels:
   Count: تم العثور على قناة (قنوات) {number}.
   Unsubscribed: 'تمت إزالة {channelName} من اشتراكاتك'
@@ -1172,3 +1168,7 @@ Trimmed input must be at least N characters long: يجب أن يكون طول ا
   حرفًا واحدًا على الأقل | يجب أن يبلغ طول الإدخال المقتطع {length} من الأحرف على
   الأقل
 Tag already exists: العلامة "{tagName}" موجودة بالفعل
+Age Restricted:
+  This channel is age restricted: هذه القناة مقيدة بالعمر
+  This video is age restricted: هذا الفيديو مقيد بالفئة العمرية
+Close Banner: إغلاق الشعار