Merge branch 'scrobbles-age' into 'develop'

Add setting to only show scrobbles newer than certain age.

See merge request pleroma/pleroma-fe!1904

8 files changed, 34 insertions, 22 deletions

diff --git a/src/components/settings_modal/helpers/size_setting.js b/src/components/settings_modal/helpers/unit_setting.js
index 12cef705..c9c23cb0 100644
--- a/src/components/settings_modal/helpers/size_setting.js
+++ b/src/components/settings_modal/helpers/unit_setting.js
@@ -17,6 +17,10 @@ export default {
     units: {
       type: Array,
       default: () => allCssUnits
+    },
+    unitSet: {
+      type: String,
+      default: 'none'
     }
   },
   computed: {
@@ -30,6 +34,10 @@ export default {
   },
   methods: {
     ...Setting.methods,
+    getUnitString (value) {
+      if (this.unitSet === 'none') return value
+      return this.$t(['settings', 'units', this.unitSet, value].join('.'))
+    },
     updateValue (e) {
       this.configSink(this.path, parseInt(e.target.value) + this.stateUnit)
     },
diff --git a/src/components/settings_modal/helpers/size_setting.vue b/src/components/settings_modal/helpers/unit_setting.vue
index 0a2206b2..68f52b1c 100644
--- a/src/components/settings_modal/helpers/size_setting.vue
+++ b/src/components/settings_modal/helpers/unit_setting.vue
@@ -1,7 +1,7 @@
 <template>
   <span
     v-if="matchesExpertLevel"
-    class="SizeSetting"
+    class="UnitSetting"
   >
     <label
       :for="path"
@@ -23,7 +23,7 @@
       :id="path"
       :model-value="stateUnit"
       :disabled="disabled"
-      class="css-unit-input"
+      class="unit-input unstyled"
       @change="updateUnit"
     >
       <option
@@ -31,7 +31,7 @@
         :key="option"
         :value="option"
       >
-        {{ option }}
+        {{ getUnitString(option) }}
       </option>
     </Select>
     {{ ' ' }}
@@ -42,20 +42,19 @@
   </span>
 </template>
 
-<script src="./size_setting.js"></script>
+<script src="./unit_setting.js"></script>
 
 <style lang="scss">
-.SizeSetting {
+.UnitSetting {
   .number-input {
     max-width: 6.5em;
+    text-align: right;
   }
 
-  .css-unit-input,
-  .css-unit-input select {
-    margin-left: 0.5em;
-    width: 4em;
-    max-width: 4em;
+  .unit-input,
+  .unit-input select {
     min-width: 4em;
+    width: auto;
   }
 }
 
diff --git a/src/components/settings_modal/settings_modal_admin_content.scss b/src/components/settings_modal/settings_modal_admin_content.scss
index bd619d7f..a5314fe1 100644
--- a/src/components/settings_modal/settings_modal_admin_content.scss
+++ b/src/components/settings_modal/settings_modal_admin_content.scss
@@ -31,10 +31,6 @@
       margin-bottom: 1em;
     }
 
-    select {
-      min-width: 10em;
-    }
-
     textarea {
       width: 100%;
       max-width: 100%;
diff --git a/src/components/settings_modal/settings_modal_user_content.scss b/src/components/settings_modal/settings_modal_user_content.scss
index bd619d7f..a5314fe1 100644
--- a/src/components/settings_modal/settings_modal_user_content.scss
+++ b/src/components/settings_modal/settings_modal_user_content.scss
@@ -31,10 +31,6 @@
       margin-bottom: 1em;
     }
 
-    select {
-      min-width: 10em;
-    }
-
     textarea {
       width: 100%;
       max-width: 100%;
diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js
index 7c37f0bc..fbace15d 100644
--- a/src/components/settings_modal/tabs/filtering_tab.js
+++ b/src/components/settings_modal/tabs/filtering_tab.js
@@ -1,6 +1,7 @@
 import { filter, trim, debounce } from 'lodash'
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import ChoiceSetting from '../helpers/choice_setting.vue'
+import UnitSetting from '../helpers/unit_setting.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
@@ -19,6 +20,7 @@ const FilteringTab = {
   components: {
     BooleanSetting,
     ChoiceSetting,
+    UnitSetting,
     IntegerSetting
   },
   computed: {
diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue
index 1f2c0363..821ca750 100644
--- a/src/components/settings_modal/tabs/filtering_tab.vue
+++ b/src/components/settings_modal/tabs/filtering_tab.vue
@@ -119,6 +119,17 @@
             {{ $t('settings.hide_scrobbles') }}
           </BooleanSetting>
         </li>
+        <li>
+          <UnitSetting
+            key="hideScrobblesAfter"
+            path="hideScrobblesAfter"
+            :units="['m', 'h', 'd']"
+            unitSet="time"
+            expert="1"
+          >
+            {{ $t('settings.hide_scrobbles_after') }}
+          </UnitSetting>
+        </li>
       </ul>
     </div>
     <div
diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
index 3f2bcb13..7d701d34 100644
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@@ -3,7 +3,7 @@ import ChoiceSetting from '../helpers/choice_setting.vue'
 import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 import FloatSetting from '../helpers/float_setting.vue'
-import SizeSetting, { defaultHorizontalUnits } from '../helpers/size_setting.vue'
+import UnitSetting, { defaultHorizontalUnits } from '../helpers/unit_setting.vue'
 import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
@@ -64,7 +64,7 @@ const GeneralTab = {
     ChoiceSetting,
     IntegerSetting,
     FloatSetting,
-    SizeSetting,
+    UnitSetting,
     InterfaceLanguageSwitcher,
     ScopeSelector,
     ProfileSettingIndicator
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index 424ee7e4..208c49ee 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -134,7 +134,7 @@
         <li v-if="expertLevel > 0">
           {{ $t('settings.column_sizes') }}
           <div class="column-settings">
-            <SizeSetting
+            <UnitSetting
               v-for="column in columns"
               :key="column"
               :path="column + 'ColumnWidth'"
@@ -142,7 +142,7 @@
               expert="1"
             >
               {{ $t('settings.column_sizes_' + column) }}
-            </SizeSetting>
+            </UnitSetting>
           </div>
         </li>
         <li class="select-multiple">