Merge branch 'feature-allow_opening_comments_optionally'

src/routes/Preferences.vue

@@ -129,9 +129,9 @@ export default {
 					default: true
 				},
 				{
-					id: 'showComments',
+					id: 'disableCommentsByDefault',
 					type: 'bool',
-					default: true
+					default: false
 				},
 				{
 					id: 'showRelatedVideos',

src/routes/WatchVideo.vue

@@ -124,13 +124,16 @@
         </v-row>
 
         <v-row>
-            <v-col cols="12" md="8" offset-md="1" v-if="comments && comments.comments && areCommentsEnabled">
+            <v-col cols="12" md="8" offset-md="1" v-if="this.availableComments !== 0">
                 <h5 class="text-h4 text-center my-4">Comments</h5>
                 <VideoComment v-for="comment in comments.comments" :key="comment.commentId" :comment="comment"
                               :video="video" />
                 <v-progress-linear indeterminate v-intersect="onCommentsProgressIntersect"
                                    v-if="comments.comments.length !== 0 && comments.nextpage != null" />
             </v-col>
+            <v-col cols="12" md="8" offset-md="1" style="display: flex; justify-content: center" v-else-if="$store.getters['prefs/getPreferenceBoolean']('disableCommentsByDefault')">
+                <v-btn x-large @click="fetchComments">Load Comments</v-btn>
+            </v-col>
             <v-col cols="12" md="2" v-if="video && video.relatedStreams && $store.getters['prefs/getPreferenceBoolean']('showRelatedVideos')">
                 <h5 class="text-h4 text-center my-4">Related Videos</h5>
                 <VideoItem class="my-4" v-for="related in video.relatedStreams" :video="related" :key="related.url" />
@@ -242,8 +245,8 @@ export default {
 		initialize () {
 			this.getVideoData()
 			this.getSponsors()
-			if (this.areCommentsEnabled) {
-				this.fetchComments().then(data => (this.comments = data))
+			if (!this.$store.getters['prefs/getPreferenceBoolean']('disableCommentsByDefault')) {
+				this.fetchComments()
 			}
 		},
 
@@ -294,8 +297,8 @@ export default {
 				}
 			})
 		},
-		fetchComments () {
-			return this.$store.dispatch('auth/makeRequest', {
+		async fetchComments () {
+			this.comments = await this.$store.dispatch('auth/makeRequest', {
 				path: '/comments/' + this.videoId
 			})
 		},
@@ -392,12 +395,13 @@ export default {
 		isAutoplayEnabled () {
 			return this.$store.getters['prefs/getPreferenceBoolean']('autoplay', false)
 		},
-		areCommentsEnabled () {
-			return this.$store.getters['prefs/getPreferenceBoolean']('showComments')
-		},
 		videoId () {
 			return this.$route.query.v || this.$route.params.v
 		},
+		availableComments () {
+			const l = this.comments?.comments?.length
+			return Number.isFinite(l) ? l : 0
+		},
 		initialSkip () {
 			// 't' in $route.query ? Number($route.query.t) : (lastWatch.progress ? lastWatch.progress : undefined)
 			// 1st Priority - t in query

src/store/prefs-store.js

@@ -13,7 +13,7 @@ const PrefsStore = {
 			skipToLastPoint: true,
 			clickbaitThumbnailAvoidance: false,
 
-			showComments: true,
+			disableCommentsByDefault: false,
 			showRelatedVideos: true,
 			showMarkers: true,
 			disableLBRY: true,

src/translations/en.json

@@ -80,7 +80,6 @@
         "dark": "Dark",
         "light": "Light",
         "buffering_goal": "Buffering Goal (in seconds)",
-        "show_comments": "Show Comments",
         "minimize_description": "Minimize Description by default",
         "store_watch_history": "Store Watch History",
         "language_selection": "Language Selection",
@@ -102,7 +101,7 @@
         "clickbaitThumbnailAvoidance": "Replace default thumbnails with auto-generated ones",
         "disableLBRY": "Disable LBRY",
         "proxyLBRY": "Proxy LBRY videos",
-        "showComments": "Show Comments",
+        "disableCommentsByDefault": "Don't show comments by default",
         "showRelatedVideos": "Show Related Videos",
         "showMarkers": "Show SponsorBlock Markers"
     }