Customisation of default profile tab, clean up settings (#156)

Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk>
Reviewed-on: https://akkoma.dev/AkkomaGang/pleroma-fe/pulls/156

src/components/extra_buttons/extra_buttons.js

@@ -55,8 +55,10 @@ const ExtraButtons = {
     hideDeleteStatusConfirmDialog () {
       this.showingDeleteDialog = false
     },
-
     translateStatus () {
+      if (this.noTranslationTargetSet) {
+        this.$store.dispatch('pushGlobalNotice', { messageKey: 'toast.no_translation_target_set', level: 'info' })
+      }
       const translateTo = this.$store.getters.mergedConfig.translationLanguage || this.$store.state.instance.interfaceLanguage
       this.$store.dispatch('translateStatus', { id: this.status.id, language: translateTo })
         .then(() => this.$emit('onSuccess'))
@@ -120,6 +122,9 @@ const ExtraButtons = {
     canTranslate () {
       return this.$store.state.instance.translationEnabled === true
     },
+    noTranslationTargetSet () {
+      return this.$store.getters.mergedConfig.translationLanguage === undefined
+    },
     statusLink () {
       if (this.status.is_local) {
         return `${this.$store.state.instance.server}${this.$router.resolve({ name: 'conversation', params: { id: this.status.id } }).href}`

src/components/extra_buttons/extra_buttons.vue

@@ -126,6 +126,16 @@
             fixed-width
             icon="globe"
           /><span>{{ $t("status.translate") }}</span>
+
+          <template v-if="noTranslationTargetSet">
+            <span class="dropdown-item-icon__badge warning">
+              <FAIcon
+                fixed-width
+                icon="exclamation-triangle"
+                name="test"
+              />
+            </span>
+          </template>
         </button>
       </div>
     </template>

src/components/settings_modal/tabs/general_tab.js

@@ -43,6 +43,11 @@ const GeneralTab = {
         value: mode,
         label: this.$t(`settings.third_column_mode_${mode}`)
       })),
+      userProfileDefaultTabOptions: ['statuses', 'replies'].map(tab => ({
+        key: tab,
+        value: tab,
+        label: this.$t(`user_card.${tab}`)
+      })),
       loopSilentAvailable:
       // Firefox
       Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') ||

src/components/settings_modal/tabs/general_tab.vue

@@ -15,11 +15,6 @@
             {{ $t('settings.hide_isp') }}
           </BooleanSetting>
         </li>
-        <li>
-          <BooleanSetting path="sidebarRight">
-            {{ $t('settings.right_sidebar') }}
-          </BooleanSetting>
-        </li>
         <li v-if="instanceWallpaperUsed">
           <BooleanSetting path="hideInstanceWallpaper">
             {{ $t('settings.hide_wallpaper') }}
@@ -104,41 +99,7 @@
             {{ $t('settings.virtual_scrolling') }}
           </BooleanSetting>
         </li>
-        <li>
-          <BooleanSetting path="disableStickyHeaders">
-            {{ $t('settings.disable_sticky_headers') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="showScrollbars">
-            {{ $t('settings.show_scrollbars') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <ChoiceSetting
-            v-if="user"
-            id="thirdColumnMode"
-            path="thirdColumnMode"
-            :options="thirdColumnModeOptions"
-          >
-            {{ $t('settings.third_column_mode') }}
-          </ChoiceSetting>
-        </li>
-        <li>
-          <BooleanSetting path="minimalScopesMode">
-            {{ $t('settings.minimal_scopes_mode') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="sensitiveByDefault">
-            {{ $t('settings.sensitive_by_default') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="sensitiveIfSubject">
-            {{ $t('settings.sensitive_if_subject') }}
-          </BooleanSetting>
-        </li>
+
         <li>
           <BooleanSetting path="renderMisskeyMarkdown">
             {{ $t('settings.render_mfm') }}
@@ -156,6 +117,15 @@
             </li>
           </ul>
         </li>
+        <li>
+          <ChoiceSetting
+            id="userProfileDefaultTab"
+            path="userProfileDefaultTab"
+            :options="userProfileDefaultTabOptions"
+          >
+            {{ $t('settings.user_profile_default_tab') }}
+          </ChoiceSetting>
+        </li>
         <li>
           <ChoiceSetting
             v-if="user && (translationLanguages.length > 0)"
@@ -487,12 +457,22 @@
             />
           </label>
         </li>
+        <li>
+          <BooleanSetting path="minimalScopesMode">
+            {{ $t('settings.minimal_scopes_mode') }}
+          </BooleanSetting>
+        </li>
         <li>
           <!-- <BooleanSetting path="serverSide_defaultNSFW"> -->
           <BooleanSetting path="sensitiveByDefault">
             {{ $t('settings.sensitive_by_default') }}
           </BooleanSetting>
         </li>
+        <li>
+          <BooleanSetting path="sensitiveIfSubject">
+            {{ $t('settings.sensitive_if_subject') }}
+          </BooleanSetting>
+        </li>
         <li>
           <BooleanSetting
             path="scopeCopy"

src/components/user_profile/user_profile.js

@@ -33,22 +33,21 @@ const FriendList = withLoadMore({
   additionalPropNames: ['userId']
 })(List)
 
-const defaultTabKey = 'statuses'
-
 const UserProfile = {
   data () {
     return {
       error: false,
       userId: null,
-      tab: defaultTabKey,
+      tab: 'statuses',
       footerRef: null,
       note: null,
       noteLoading: false
     }
   },
   created () {
+    const defaultTabKey = this.defaultTabKey
     const routeParams = this.$route.params
-    const hash = get(this.$route, 'hash', defaultTabKey).replace(/^#/, '')
+    const hash = (get(this.$route, 'hash') || defaultTabKey).replace(/^#/, '')
     if (hash !== '') this.tab = hash
     this.load(routeParams.name || routeParams.id)
   },
@@ -86,6 +85,9 @@ const UserProfile = {
     },
     currentUser () {
       return this.$store.state.users.currentUser
+    },
+    defaultTabKey () {
+      return this.$store.getters.mergedConfig.userProfileDefaultTab || 'statuses'
     }
   },
   methods: {
@@ -191,7 +193,7 @@ const UserProfile = {
     },
     '$route.hash': function (newVal) {
       const oldTab = this.tab
-      this.tab = newVal.replace(/^#/, '') || defaultTabKey
+      this.tab = newVal.replace(/^#/, '') || this.defaultTabKey
       this.onRouteChange(oldTab, this.tab)
     }
   },

src/i18n/en.json

@@ -806,6 +806,7 @@
         "use_one_click_nsfw": "Open NSFW attachments with just one click",
         "user_mutes": "Users",
         "user_profiles": "User Profiles",
+        "user_profile_default_tab": "Default Tab on User Profile",
         "user_settings": "User Settings",
         "valid_until": "Valid until",
         "values": {
@@ -921,6 +922,9 @@
         "socket_reconnected": "Realtime connection established",
         "up_to_date": "Up-to-date"
     },
+    "toast": {
+      "no_translation_target_set": "No translation target language set - this may fail. Please set a target language in your settings."
+    },
     "tool_tip": {
         "accept_follow_request": "Accept follow request",
         "add_reaction": "Add Reaction",

src/modules/config.js

@@ -116,7 +116,8 @@ export const defaultState = {
   conversationTreeFadeAncestors: undefined, // instance default
   maxDepthInThread: undefined, // instance default
   translationLanguage: undefined, // instance default,
-  supportedTranslationLanguages: {} // instance default
+  supportedTranslationLanguages: {}, // instance default
+  userProfileDefaultTab: 'statuses'
 }
 
 // caching the instance default properties