From 801b8fe027ca3e8fe7152cbb07eaf9d775b37eb4 Mon Sep 17 00:00:00 2001
From: Niklas Wolf <wolfniklas94@web.de>
Date: Sat, 21 Jan 2023 11:19:03 +0100
Subject: [PATCH] feat: add user preference to hide translation button (#1358)

---
 components/status/StatusTranslation.vue | 5 ++++-
 composables/settings/definition.ts      | 2 ++
 locales/de-DE.json                      | 1 +
 locales/en-US.json                      | 1 +
 pages/settings/preferences/index.vue    | 6 ++++++
 5 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/components/status/StatusTranslation.vue b/components/status/StatusTranslation.vue
index eb090018..daf00a7e 100644
--- a/components/status/StatusTranslation.vue
+++ b/components/status/StatusTranslation.vue
@@ -10,6 +10,9 @@ const {
   translation,
   enabled: isTranslationEnabled,
 } = useTranslation(status, getLanguageCode())
+const preferenceHideTranslation = usePreferences('hideTranslation')
+
+const showButton = computed(() => !preferenceHideTranslation.value && isTranslationEnabled && status.language !== getLanguageCode())
 
 let translating = $ref(false)
 const toggleTranslation = async () => {
@@ -26,7 +29,7 @@ const toggleTranslation = async () => {
 <template>
   <div>
     <button
-      v-if="isTranslationEnabled && status.language !== getLanguageCode()" p-0 flex="~ center" gap-2 text-sm
+      v-if="showButton" p-0 flex="~ center" gap-2 text-sm
       :disabled="translating" disabled-bg-transparent btn-text class="disabled-text-$c-text-btn-disabled-deeper" @click="toggleTranslation"
     >
       <span v-if="translating" block animate-spin preserve-3d>
diff --git a/composables/settings/definition.ts b/composables/settings/definition.ts
index 68989690..d25bb959 100644
--- a/composables/settings/definition.ts
+++ b/composables/settings/definition.ts
@@ -7,6 +7,7 @@ export interface PreferencesSettings {
   hideBoostCount: boolean
   hideFavoriteCount: boolean
   hideFollowerCount: boolean
+  hideTranslation: boolean
   grayscaleMode: boolean
   enableAutoplay: boolean
   experimentalVirtualScroller: boolean
@@ -58,6 +59,7 @@ export const DEFAULT__PREFERENCES_SETTINGS: PreferencesSettings = {
   hideBoostCount: false,
   hideFavoriteCount: false,
   hideFollowerCount: false,
+  hideTranslation: false,
   grayscaleMode: false,
   enableAutoplay: true,
   experimentalVirtualScroller: true,
diff --git a/locales/de-DE.json b/locales/de-DE.json
index f3a3405b..8756f5a9 100644
--- a/locales/de-DE.json
+++ b/locales/de-DE.json
@@ -335,6 +335,7 @@
       "hide_boost_count": "Boost-Zähler ausblenden",
       "hide_favorite_count": "Favoritenzahl ausblenden",
       "hide_follower_count": "Anzahl der Follower ausblenden",
+      "hide_translation": "Übersetzungen ausblenden",
       "label": "Einstellungen",
       "title": "Experimentelle Funktionen",
       "user_picker": "Benutzerauswahl",
diff --git a/locales/en-US.json b/locales/en-US.json
index 8300c3c4..28cba3f1 100644
--- a/locales/en-US.json
+++ b/locales/en-US.json
@@ -372,6 +372,7 @@
       "hide_boost_count": "Hide boost count",
       "hide_favorite_count": "Hide favorite count",
       "hide_follower_count": "Hide follower count",
+      "hide_translation": "Hide translation",
       "label": "Preferences",
       "title": "Experimental Features",
       "user_picker": "User Picker",
diff --git a/pages/settings/preferences/index.vue b/pages/settings/preferences/index.vue
index 0ed9de73..68d045d5 100644
--- a/pages/settings/preferences/index.vue
+++ b/pages/settings/preferences/index.vue
@@ -33,6 +33,12 @@ const userSettings = useUserSettings()
     >
       {{ $t('settings.preferences.hide_follower_count') }}
     </SettingsToggleItem>
+    <SettingsToggleItem
+      :checked="getPreferences(userSettings, 'hideTranslation')"
+      @click="togglePreferences('hideTranslation')"
+    >
+      {{ $t('settings.preferences.hide_translation') }}
+    </SettingsToggleItem>
     <SettingsToggleItem
       :checked="getPreferences(userSettings, 'grayscaleMode')"
       @click="togglePreferences('grayscaleMode')"