feat: add user preference to hide translation button (#1358)

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>

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,

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",

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",

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')"