From 4089a31df296c600c6a9da1cedc15b17e46c6b5d Mon Sep 17 00:00:00 2001
From: root <root@git.maharshi.ninja>
Date: Sun, 14 Nov 2021 02:41:35 +0530
Subject: [PATCH] Make columns configurable between 4, 5 and 6

---
 src/routes/FeedPage.vue    | 12 ++++++++----
 src/routes/Preferences.vue | 20 ++++++++++++++++++++
 src/translations/en.json   |  1 +
 3 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/src/routes/FeedPage.vue b/src/routes/FeedPage.vue
index fe4385d..cf9ce8d 100644
--- a/src/routes/FeedPage.vue
+++ b/src/routes/FeedPage.vue
@@ -16,8 +16,8 @@
       <span v-if="!errorIsJSON">{{ $t(error) }}</span>
       <JSONViewer v-else :value="error" />
     </v-alert>
-    <v-row v-for="(row, rowId) in chunkedBySix" :key="rowId">
-      <v-col md="2" v-for="(video, videoId) in row" :key="videoId">
+    <v-row v-for="(row, rowId) in splitIntoRows" :key="rowId">
+      <v-col v-for="(video, videoId) in row" :key="videoId">
         <VideoItem :video="video" max-height />
       </v-col>
     </v-row>
@@ -102,8 +102,12 @@ export default {
     }
   },
   computed: {
-    chunkedBySix () {
-      return _chunk(this.videos, 6)
+    rowSize () {
+      return this.$store.getters['prefs/getPreferenceNumber']('feedColumns', 4)
+    },
+
+    splitIntoRows () {
+      return _chunk(this.videos, this.rowSize)
     }
   },
   components: {
diff --git a/src/routes/Preferences.vue b/src/routes/Preferences.vue
index 50127ba..f2706b0 100644
--- a/src/routes/Preferences.vue
+++ b/src/routes/Preferences.vue
@@ -79,6 +79,26 @@ export default {
             }
           ]
         },
+        {
+          id: 'feedColumns',
+          type: 'select',
+          label: 'Amount of Columns on Feed Pages',
+          default: 4,
+          options: [
+            {
+              text: '4 columns',
+              value: 4
+            },
+            {
+              text: '5 columns',
+              value: 5
+            },
+            {
+              text: '5 columns',
+              value: 5
+            }
+          ]
+        },
         {
           id: 'quality',
           type: 'select',
diff --git a/src/translations/en.json b/src/translations/en.json
index 41a1cf7..45683d0 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -50,6 +50,7 @@
         "enabled_codecs": "Enabled Codecs (Multiple)"
     },
     "preferences": {
+        "feedColumns": "Count of Columns in Feed Pages",
         "sponsorblock": "Enable Sponsorblock",
         "selectedSkip": "Segments to Skip",
         "disableLBRY": "Disable LBRY",