Merge branch 'development' into feature/playlist-2023-05

* development: Update to silently allow channel links (with IDs) (FreeTubeApp#4347) Add hide channel option directly to More Options menu (FreeTubeApp#4228) Translated using Weblate (Chinese (Simplified)) Translated using Weblate (Spanish) Make landing page configurable (FreeTubeApp#4200) Bump @silvermine/videojs-quality-selector from 1.3.0 to 1.3.1 (FreeTubeApp#4362) Bump electron from 27.0.4 to 27.1.0 (FreeTubeApp#4363) Bump the eslint group with 1 update (FreeTubeApp#4360) Bump actions/github-script from 6 to 7 (FreeTubeApp#4361) add image to poll & updated quiz style (FreeTubeApp#4318) Move hideOutlines to the utils store instead of using provide/inject (FreeTubeApp#4246) Translated using Weblate (Kurdish (Central)) Translated using Weblate (English (United Kingdom)) Translated using Weblate (French) Translated using Weblate (German) Added translation using Weblate (Kurdish (Central)) Translated using Weblate (Slovak) # Conflicts: # src/renderer/components/ft-list-video/ft-list-video.js
PikachuEXE · Nov 21, 2023 · fdb8c75 · fdb8c75
2 parents b4ea29a + 3fc2e54
commit fdb8c75
Show file tree

Hide file tree

Showing 29 changed files with 1,187 additions and 186 deletions.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -64,7 +64,7 @@ jobs:
 
     - name: Set Version Number Variable
       id: versionNumber
-      uses: actions/github-script@v6
+      uses: actions/github-script@v7
       env:
         IS_DEV: ${{ contains(github.ref, 'development') }}
         IS_RC: ${{ contains(github.ref, 'RC') }}

diff --git a/package.json b/package.json
@@ -58,7 +58,7 @@
     "@fortawesome/free-solid-svg-icons": "^6.4.2",
     "@fortawesome/vue-fontawesome": "^2.0.10",
     "@seald-io/nedb": "^4.0.2",
-    "@silvermine/videojs-quality-selector": "^1.3.0",
+    "@silvermine/videojs-quality-selector": "^1.3.1",
     "autolinker": "^4.0.0",
     "electron-context-menu": "^3.6.1",
     "lodash.debounce": "^4.0.8",
@@ -89,9 +89,9 @@
     "copy-webpack-plugin": "^11.0.0",
     "css-loader": "^6.8.1",
     "css-minimizer-webpack-plugin": "^5.0.1",
-    "electron": "^27.0.4",
+    "electron": "^27.1.0",
     "electron-builder": "^24.6.4",
-    "eslint": "^8.53.0",
+    "eslint": "^8.54.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard": "^17.1.0",
     "eslint-plugin-import": "^2.29.0",

diff --git a/src/constants.js b/src/constants.js
@@ -70,18 +70,12 @@ const SyncEvents = {
   }
 }
 
-// https://v2.vuejs.org/v2/api/#provide-inject
-const Injectables = {
-  SHOW_OUTLINES: 'showOutlines'
-}
-
 // Utils
 const MAIN_PROFILE_ID = 'allChannels'
 
 export {
   IpcChannels,
   DBActions,
   SyncEvents,
-  Injectables,
   MAIN_PROFILE_ID
 }
diff --git a/src/renderer/App.js b/src/renderer/App.js
@@ -12,7 +12,7 @@ import FtProgressBar from './components/ft-progress-bar/ft-progress-bar.vue'
 import FtPlaylistAddVideoPrompt from './components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.vue'
 import FtCreatePlaylistPrompt from './components/ft-create-playlist-prompt/ft-create-playlist-prompt.vue'
 import { marked } from 'marked'
-import { Injectables, IpcChannels } from '../constants'
+import { IpcChannels } from '../constants'
 import packageDetails from '../../package.json'
 import { openExternalLink, openInternalPath, showToast } from './helpers/utils'
 
@@ -34,15 +34,9 @@ export default defineComponent({
     FtPlaylistAddVideoPrompt,
     FtCreatePlaylistPrompt,
   },
-  provide: function () {
-    return {
-      [Injectables.SHOW_OUTLINES]: this.showOutlines
-    }
-  },
   data: function () {
     return {
       dataReady: false,
-      hideOutlines: true,
       showUpdatesBanner: false,
       showBlogBanner: false,
       showReleaseNotes: false,
@@ -63,6 +57,9 @@ export default defineComponent({
     showProgressBar: function () {
       return this.$store.getters.getShowProgressBar
     },
+    outlinesHidden: function () {
+      return this.$store.getters.getOutlinesHidden
+    },
     isLocaleRightToLeft: function () {
       return this.locale === 'ar' || this.locale === 'fa' || this.locale === 'he' ||
         this.locale === 'ur' || this.locale === 'yi' || this.locale === 'ku'
@@ -121,6 +118,10 @@ export default defineComponent({
       return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
     },
 
+    landingPage: function() {
+      return '/' + this.$store.getters.getLandingPage
+    },
+
     externalLinkOpeningPromptNames: function () {
       return [
         this.$t('Yes'),
@@ -146,7 +147,7 @@ export default defineComponent({
     $route () {
       // react to route changes...
       // Hide top nav filter panel on page change
-      this.$refs.topNav.hideFilters()
+      this.$refs.topNav?.hideFilters()
     }
   },
   created () {
@@ -188,7 +189,13 @@ export default defineComponent({
       })
 
       this.$router.afterEach((to, from) => {
-        this.$refs.topNav.navigateHistory()
+        this.$refs.topNav?.navigateHistory()
+      })
+
+      this.$router.onReady(() => {
+        if (this.$router.currentRoute.path !== this.landingPage && this.landingPage !== '/subscriptions') {
+          this.$router.push({ path: this.landingPage })
+        }
       })
     })
   },
@@ -301,7 +308,7 @@ export default defineComponent({
     activateKeyboardShortcuts: function () {
       document.addEventListener('keydown', this.handleKeyboardShortcuts)
       document.addEventListener('mousedown', () => {
-        this.hideOutlines = true
+        this.hideOutlines()
       })
     },
 
@@ -326,7 +333,7 @@ export default defineComponent({
       }
       switch (event.key) {
         case 'Tab':
-          this.hideOutlines = false
+          this.showOutlines()
           break
         case 'L':
         case 'l':
@@ -527,15 +534,6 @@ export default defineComponent({
       }
     },
 
-    /**
-     * provided to all child components, see `provide` near the top of this file
-     * after injecting it, they can show outlines during keyboard navigation
-     * e.g. cycling through tabs with the arrow keys
-     */
-    showOutlines: function () {
-      this.hideOutlines = false
-    },
-
     ...mapMutations([
       'setInvidiousInstancesList'
     ]),
@@ -552,7 +550,9 @@ export default defineComponent({
       'setupListenersToSyncWindows',
       'updateBaseTheme',
       'updateMainColor',
-      'updateSecColor'
+      'updateSecColor',
+      'showOutlines',
+      'hideOutlines'
     ])
   }
 })
diff --git a/src/renderer/App.vue b/src/renderer/App.vue
@@ -3,7 +3,7 @@
     v-if="dataReady"
     id="app"
     :class="{
-      hideOutlines: hideOutlines,
+      hideOutlines: outlinesHidden,
       isLocaleRightToLeft: isLocaleRightToLeft
     }"
   >

diff --git a/src/renderer/components/ft-community-poll/ft-community-poll.css b/src/renderer/components/ft-community-poll/ft-community-poll.css
@@ -11,9 +11,7 @@
   display: block;
   float: var(--float-left-ltr-rtl-value);
   block-size: 10px;
-  inset-inline-start: 5px;
   position: relative;
-  inset-block-start: 8px;
   inline-size: 10px;
 }
 
@@ -29,30 +27,45 @@
 }
 
 .option-text {
+  margin-inline-start: 10px;
+}
+
+.option {
+  display: flex;
+  align-items: center;
+  padding-block-end: 10px;
   border-radius: 5px;
   border-style: solid;
-  border-width: 2px;
+  border-width: 1px;
   padding-block: 5px;
-  padding-inline: 25px;
+  padding-inline-start: 10px;
+  margin-block-end: 10px;
 }
 
-.option {
-  padding-block-end: 10px;
+.option > img {
+  margin-inline-start: 10px;
+  block-size: 125px;
 }
 
 .correct-option {
+  border-color: #78da71;
+  border-width: 2px;
+}
+
+.correct-option .filled-circle {
   background-color: #78da71;
 }
 
 .incorrect-option {
-  background-color: #dd4e4e;
+  border-color: #dd4e4e;
+  border-width: 2px;
 }
 
-.reveal-answer  {
-  text-align: center;
+.reveal-answer {
+  justify-content: center;
   cursor: pointer;
 }
 
-.reveal-answer:hover > .option-text, .reveal-answer:focus > .option-text {
+.reveal-answer:hover, .reveal-answer:focus {
   background-color: var(--side-nav-hover-color)
 }
diff --git a/src/renderer/components/ft-community-poll/ft-community-poll.js b/src/renderer/components/ft-community-poll/ft-community-poll.js
@@ -18,5 +18,11 @@ export default defineComponent({
     formattedVotes: function () {
       return formatNumber(this.data.totalVotes)
     },
+  },
+  methods: {
+    // Use smallest as it's resized to 125px anyways and they're usually all larger than that
+    findSmallestPollImage: function (images) {
+      return images.reduce((prev, img) => (img.height < prev.height) ? img : prev, images[0]).url
+    }
   }
 })
diff --git a/src/renderer/components/ft-community-poll/ft-community-poll.vue b/src/renderer/components/ft-community-poll/ft-community-poll.vue
@@ -13,13 +13,13 @@
       <div
         v-if="data.type === 'quiz'"
         class="option quiz-option"
+        :class="revealAnswer && choice.isCorrect ? 'correct-option' : ''"
       >
         <span class="empty-circle">
           <span :class="revealAnswer && choice.isCorrect ? 'filled-circle' : ''" />
         </span>
         <div
           class="option-text"
-          :class="revealAnswer && choice.isCorrect ? 'correct-option' : ''"
         >
           {{ choice.text }}
         </div>
@@ -29,6 +29,11 @@
         class="option poll-option"
       >
         <span class="empty-circle" />
+        <img
+          v-if="choice.image"
+          :src="findSmallestPollImage(choice.image)"
+          alt=""
+        >
         <div class="option-text">
           {{ choice.text }}
         </div>

diff --git a/src/renderer/components/ft-input-tags/ft-input-tags.js b/src/renderer/components/ft-input-tags/ft-input-tags.js
@@ -46,8 +46,8 @@ export default defineComponent({
   },
   methods: {
     updateTags: async function (text, _e) {
-      // text entered add tag and update tag list
-      const name = text.trim()
+      // get text without spaces after last '/' in url, if any
+      const name = text.split('/').pop().trim()
 
       if (!this.validateTagName(name)) {
         this.$emit('invalid-name')

diff --git a/src/renderer/components/ft-list-video/ft-list-video.js b/src/renderer/components/ft-list-video/ft-list-video.js
@@ -272,8 +272,25 @@ export default defineComponent({
             {
               label: this.$t('Video.Open Channel in Invidious'),
               value: 'openInvidiousChannel'
+            },
+            {
+              type: 'divider'
             }
           )
+
+          const hiddenChannels = JSON.parse(this.$store.getters.getChannelsHidden)
+          const channelShouldBeHidden = hiddenChannels.some(c => c === this.channelId)
+          if (channelShouldBeHidden) {
+            options.push({
+              label: this.$t('Video.Unhide Channel'),
+              value: 'unhideChannel'
+            })
+          } else {
+            options.push({
+              label: this.$t('Video.Hide Channel'),
+              value: 'hideChannel'
+            })
+          }
         }
       }
 
@@ -509,6 +526,12 @@ export default defineComponent({
         case 'openInvidiousChannel':
           openExternalLink(this.invidiousChannelUrl)
           break
+        case 'hideChannel':
+          this.hideChannel(this.channelName, this.channelId)
+          break
+        case 'unhideChannel':
+          this.unhideChannel(this.channelName, this.channelId)
+          break
       }
     },
 
@@ -684,10 +707,26 @@ export default defineComponent({
       }
     },
 
+    hideChannel: function(channelName, channelId) {
+      const hiddenChannels = JSON.parse(this.$store.getters.getChannelsHidden)
+      hiddenChannels.push(channelId)
+      this.updateChannelsHidden(JSON.stringify(hiddenChannels))
+
+      showToast(this.$t('Channel Hidden', { channel: channelName }))
+    },
+
+    unhideChannel: function(channelName, channelId) {
+      const hiddenChannels = JSON.parse(this.$store.getters.getChannelsHidden)
+      this.updateChannelsHidden(JSON.stringify(hiddenChannels.filter(c => c !== channelId)))
+
+      showToast(this.$t('Channel Unhidden', { channel: channelName }))
+    },
+
     ...mapActions([
       'openInExternalPlayer',
       'updateHistory',
       'removeFromHistory',
+      'updateChannelsHidden',
       'showAddToPlaylistPromptForManyVideos',
     ])
   }

diff --git a/src/renderer/components/ft-prompt/ft-prompt.js b/src/renderer/components/ft-prompt/ft-prompt.js
@@ -1,8 +1,8 @@
 import { defineComponent } from 'vue'
+import { mapActions } from 'vuex'
 import FtCard from '../../components/ft-card/ft-card.vue'
 import FtFlexBox from '../../components/ft-flex-box/ft-flex-box.vue'
 import FtButton from '../../components/ft-button/ft-button.vue'
-import { Injectables } from '../../../constants'
 import { sanitizeForHtmlId } from '../../helpers/accessibility'
 
 export default defineComponent({
@@ -12,9 +12,6 @@ export default defineComponent({
     'ft-flex-box': FtFlexBox,
     'ft-button': FtButton
   },
-  inject: {
-    showOutlines: Injectables.SHOW_OUTLINES
-  },
   props: {
     label: {
       type: String,
@@ -105,6 +102,10 @@ export default defineComponent({
         const direction = (e.key === 'ArrowLeft') ? -1 : 1
         this.focusItem(parseInt(currentIndex) + direction)
       }
-    }
+    },
+
+    ...mapActions([
+      'showOutlines'
+    ])
   }
 })