From ee0139507102e1a8e6a3c82c4f1209929a0e5578 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 17:00:21 +0300
Subject: [PATCH 1/9] image cropper cleanup

---
 src/components/image_cropper/image_cropper.js | 22 ++++++-------------
 1 file changed, 7 insertions(+), 15 deletions(-)

diff --git a/src/components/image_cropper/image_cropper.js b/src/components/image_cropper/image_cropper.js
index 32b615265..afca328e8 100644
--- a/src/components/image_cropper/image_cropper.js
+++ b/src/components/image_cropper/image_cropper.js
@@ -10,19 +10,12 @@ library.add(
 
 const ImageCropper = {
   props: {
+    // Mime-types to accept, i.e. which filetypes to accept (.gif, .png, etc.)
     mimes: {
       type: String,
       default: 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon'
     },
-    saveButtonLabel: {
-      type: String
-    },
-    saveWithoutCroppingButtonlabel: {
-      type: String
-    },
-    cancelButtonLabel: {
-      type: String
-    },
+    // Fixed aspect-ratio for selection box
     aspectRatio: {
       type: Number
     }
@@ -30,11 +23,13 @@ const ImageCropper = {
   data () {
     return {
       dataUrl: undefined,
-      filename: undefined,
-      submitting: false
+      filename: undefined
     }
   },
-  emits: ['submit'],
+  emits: [
+    'submit', // cropping complete or uncropped image returned
+    'close', // cropper is closed
+  ],
   methods: {
     destroy () {
       this.$refs.input.value = ''
@@ -42,8 +37,6 @@ const ImageCropper = {
       this.$emit('close')
     },
     submit (cropping = true) {
-      this.submitting = true
-
       let cropperPromise
       if (cropping) {
         cropperPromise = this.$refs.cropperSelection.$toCanvas()
@@ -53,7 +46,6 @@ const ImageCropper = {
 
       cropperPromise.then(canvas => {
         this.$emit('submit', { canvas, file: this.file })
-        this.submitting = false
       })
     },
     pickImage () {

From 6e44a3afa935f58fd7074cfca8faf11a829dc2e8 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 17:00:39 +0300
Subject: [PATCH 2/9] language switcher cleanup

---
 .../interface_language_switcher.js            | 58 +++++++++++++++++
 .../interface_language_switcher.vue           | 65 +------------------
 .../settings_modal/tabs/general_tab.js        |  3 +-
 .../settings_modal/tabs/general_tab.vue       | 16 +++--
 src/components/user_card/user_card.js         |  4 --
 5 files changed, 71 insertions(+), 75 deletions(-)
 create mode 100644 src/components/interface_language_switcher/interface_language_switcher.js

diff --git a/src/components/interface_language_switcher/interface_language_switcher.js b/src/components/interface_language_switcher/interface_language_switcher.js
new file mode 100644
index 000000000..bd7b641a5
--- /dev/null
+++ b/src/components/interface_language_switcher/interface_language_switcher.js
@@ -0,0 +1,58 @@
+import localeService from '../../services/locale/locale.service.js'
+
+import Select from '../select/select.vue'
+import ProfileSettingIndicator from 'src/components/settings_modal/helpers/profile_setting_indicator.vue'
+
+export default {
+  components: {
+    Select,
+    ProfileSettingIndicator
+  },
+  props: {
+    // List of languages (or just one language)
+    modelValue: {
+      type: [Array, String],
+      required: true
+    },
+    // Is this setting stored in user profile (true) or elsewhere (false)
+    // Doesn't affect storage, just shows an icon if true
+    profile: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ['update:modelValue'],
+  computed: {
+    languages () {
+      return localeService.languages
+    },
+
+    controlledLanguage: {
+      get: function () {
+        return Array.isArray(this.modelValue) ? this.modelValue : [this.modelValue]
+      },
+      set: function (val) {
+        this.$emit('update:modelValue', val)
+      }
+    }
+  },
+
+  methods: {
+    getLanguageName (code) {
+      return localeService.getLanguageName(code)
+    },
+    addLanguage () {
+      this.controlledLanguage = [...this.controlledLanguage, '']
+    },
+    setLanguageAt (index, val) {
+      const lang = [...this.controlledLanguage]
+      lang[index] = val
+      this.controlledLanguage = lang
+    },
+    removeLanguageAt (index) {
+      const lang = [...this.controlledLanguage]
+      lang.splice(index, 1)
+      this.controlledLanguage = lang
+    }
+  }
+}
diff --git a/src/components/interface_language_switcher/interface_language_switcher.vue b/src/components/interface_language_switcher/interface_language_switcher.vue
index 46837b018..8b300d43b 100644
--- a/src/components/interface_language_switcher/interface_language_switcher.vue
+++ b/src/components/interface_language_switcher/interface_language_switcher.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="interface-language-switcher">
     <label>
-      {{ promptText }}
+      <slot />
       <ProfileSettingIndicator :is-profile="profile" />
     </label>
     <ul class="setting-list">
@@ -45,68 +45,7 @@
   </div>
 </template>
 
-<script>
-import localeService from '../../services/locale/locale.service.js'
-
-import Select from '../select/select.vue'
-import ProfileSettingIndicator from 'src/components/settings_modal/helpers/profile_setting_indicator.vue'
-
-export default {
-  components: {
-    // eslint-disable-next-line vue/no-reserved-component-names
-    Select,
-    ProfileSettingIndicator
-  },
-  props: {
-    promptText: {
-      type: String,
-      required: true
-    },
-    language: {
-      type: [Array, String],
-      required: true
-    },
-    profile: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ['update'],
-  computed: {
-    languages () {
-      return localeService.languages
-    },
-
-    controlledLanguage: {
-      get: function () {
-        return Array.isArray(this.language) ? this.language : [this.language]
-      },
-      set: function (val) {
-        this.$emit('update', val)
-      }
-    }
-  },
-
-  methods: {
-    getLanguageName (code) {
-      return localeService.getLanguageName(code)
-    },
-    addLanguage () {
-      this.controlledLanguage = [...this.controlledLanguage, '']
-    },
-    setLanguageAt (index, val) {
-      const lang = [...this.controlledLanguage]
-      lang[index] = val
-      this.controlledLanguage = lang
-    },
-    removeLanguageAt (index) {
-      const lang = [...this.controlledLanguage]
-      lang.splice(index, 1)
-      this.controlledLanguage = lang
-    }
-  }
-}
-</script>
+<script src="./interface_language_switcher.js"></script>
 
 <style lang="scss">
 .interface-language-switcher {
diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
index 7f5d99da5..8d295db2b 100644
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@@ -66,7 +66,8 @@ const GeneralTab = {
       // Chrome-likes
       Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'webkitAudioDecodedByteCount') ||
       // Future spec, still not supported in Nightly 63 as of 08/2018
-      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'audioTracks')
+      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'audioTracks'),
+      emailLanguage: this.$store.state.users.currentUser.language || ['']
     }
   },
   components: {
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index c8858f773..f0ff7f50b 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -5,18 +5,20 @@
       <ul class="setting-list">
         <li>
           <interface-language-switcher
-            :prompt-text="$t('settings.interfaceLanguage')"
-            :language="language"
+            v-model="language"
             @update="val => language = val"
-          />
+          >
+            {{ $t('settings.interfaceLanguage') }}
+          </interface-language-switcher>
         </li>
         <li>
           <interface-language-switcher
-            :prompt-text="$t('settings.email_language')"
-            :language="emailLanguage"
+            v-model="emailLanguage"
             :profile="true"
-            @update="val => { emailLanguage = val; updateProfile() }"
-          />
+            @update:modelValue="updateProfile()"
+          >
+            {{ $t('settings.email_language') }}
+          </interface-language-switcher>
         </li>
         <li v-if="instanceSpecificPanelPresent">
           <BooleanSetting path="hideISP">
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index e9c79aff1..409cc9e6b 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -472,10 +472,6 @@ export default {
         params.header = this.newBannerFile
       }
 
-      if (this.emailLanguage) {
-        params.language = localeService.internalToBackendLocaleMulti(this.emailLanguage)
-      }
-
       this.$store.state.api.backendInteractor
         .updateProfile({ params })
         .then((user) => {

From d4c0ccf659faa207211fb12178b580280c0f9d34 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 17:08:33 +0300
Subject: [PATCH 3/9] profile tab cleanup

---
 .../settings_modal/tabs/profile_tab.js        | 50 ++-----------------
 .../settings_modal/tabs/profile_tab.scss      | 15 +-----
 2 files changed, 4 insertions(+), 61 deletions(-)

diff --git a/src/components/settings_modal/tabs/profile_tab.js b/src/components/settings_modal/tabs/profile_tab.js
index e6d3e6141..9e13eed69 100644
--- a/src/components/settings_modal/tabs/profile_tab.js
+++ b/src/components/settings_modal/tabs/profile_tab.js
@@ -1,18 +1,9 @@
 import UserCard from 'src/components/user_card/user_card.vue'
-import ImageCropper from 'src/components/image_cropper/image_cropper.vue'
-import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
-import ProgressButton from 'src/components/progress_button/progress_button.vue'
-import EmojiInput from 'src/components/emoji_input/emoji_input.vue'
-import suggestor from 'src/components/emoji_input/suggestor.js'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
-import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
-import Select from 'src/components/select/select.vue'
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
 
-import { propsToNative } from 'src/services/attributes_helper/attributes_helper.service.js'
-
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faTimes,
@@ -29,55 +20,23 @@ library.add(
 const ProfileTab = {
   data () {
     return {
+      // Whether user is locked or not
       locked: this.$store.state.users.currentUser.locked,
     }
   },
   components: {
     UserCard,
-    ScopeSelector,
-    ImageCropper,
-    EmojiInput,
-    ProgressButton,
     Checkbox,
     BooleanSetting,
-    InterfaceLanguageSwitcher,
-    ProfileSettingIndicator,
-    Select
+    ProfileSettingIndicator
   },
   computed: {
     user () {
       return this.$store.state.users.currentUser
     },
-    ...SharedComputedObject(),
-    emojiUserSuggestor () {
-      return suggestor({
-        emoji: [
-          ...this.$store.getters.standardEmojiList,
-          ...this.$store.state.instance.customEmoji
-        ],
-        store: this.$store
-      })
-    },
-    emojiSuggestor () {
-      return suggestor({
-        emoji: [
-          ...this.$store.getters.standardEmojiList,
-          ...this.$store.state.instance.customEmoji
-        ]
-      })
-    },
-    userSuggestor () {
-      return suggestor({ store: this.$store })
-    },
-    bannerImgSrc () {
-      const src = this.$store.state.users.currentUser.cover_photo
-      return (!src) ? this.defaultBanner : src
-    },
+    ...SharedComputedObject()
   },
   methods: {
-    changeVis (visibility) {
-      this.newDefaultScope = visibility
-    },
     updateProfile () {
       const params = {
         locked: this.locked
@@ -92,9 +51,6 @@ const ProfileTab = {
         .catch((error) => {
           this.displayUploadError(error)
         })
-    },
-    propsToNative (props) {
-      return propsToNative(props)
     }
   },
   watch: {
diff --git a/src/components/settings_modal/tabs/profile_tab.scss b/src/components/settings_modal/tabs/profile_tab.scss
index 33a7c5ed0..ce85188bd 100644
--- a/src/components/settings_modal/tabs/profile_tab.scss
+++ b/src/components/settings_modal/tabs/profile_tab.scss
@@ -1,6 +1,6 @@
 .profile-tab {
   // overriding global for better look
-  div.profile-edit {
+  .setting-item.profile-edit {
     margin: 0;
 
     h2 {
@@ -12,17 +12,4 @@
       overflow: hidden;
     }
   }
-
-  .bio {
-    margin: 0;
-  }
-
-  .uploading {
-    font-size: 1.5em;
-    margin: 0.25em;
-  }
-
-  .setting-subitem {
-    margin-left: 1.75em;
-  }
 }

From 99886ac28c100d9e325aad14e65ec61c0021eda0 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 17:17:01 +0300
Subject: [PATCH 4/9] user avatar cleanup

---
 src/components/user_avatar/user_avatar.js  | 31 +++++++++++++++++-----
 src/components/user_avatar/user_avatar.vue |  6 ++---
 2 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/src/components/user_avatar/user_avatar.js b/src/components/user_avatar/user_avatar.js
index 855ea60e8..8092ba62b 100644
--- a/src/components/user_avatar/user_avatar.js
+++ b/src/components/user_avatar/user_avatar.js
@@ -14,12 +14,31 @@ library.add(
 )
 
 const UserAvatar = {
-  props: [
-    'user',
-    'compact',
-    'showActorTypeIndicator',
-    'url'
-  ],
+  props: {
+    // User object to show avatar of
+    user: {
+      required: true,
+      type: Object
+    },
+    // Use less space and use alternative roundness
+    compact: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show small icon indicating if account is a bot or group
+    showActorTypeIndicator : {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Override avatar image URL, useful for profile editing
+    url: {
+      required: false,
+      type: String,
+      default: null
+    }
+  },
   data () {
     return {
       showPlaceholder: false,
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index e3398165c..c0336d407 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -40,12 +40,12 @@
 
   display: inline-block;
   position: relative;
-  width: 48px;
+  width: 3.5em;
   height: 48px;
 
   &.-compact {
-    width: 32px;
-    height: 32px;
+    width: 2.2em;
+    height: 2.2em;
     border-radius: var(--roundness);
   }
 

From ebe727b3787598e33379c8656beb9edbc7c4467e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 17:52:30 +0300
Subject: [PATCH 5/9] user-card cleanup

---
 .../settings_modal/tabs/general_tab.js        |  2 +
 src/components/user_card/user_card.js         | 71 ++++++++++++-------
 src/components/user_card/user_card.scss       | 37 ++--------
 src/components/user_card/user_card.vue        | 35 +++------
 src/components/user_panel/user_panel.vue      |  1 -
 src/components/user_popover/user_popover.vue  |  4 +-
 src/components/user_profile/user_profile.vue  | 13 +++-
 src/panel.scss                                |  1 +
 8 files changed, 77 insertions(+), 87 deletions(-)

diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
index 8d295db2b..ff6d0e477 100644
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@@ -8,6 +8,7 @@ import FloatSetting from '../helpers/float_setting.vue'
 import UnitSetting from '../helpers/unit_setting.vue'
 import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
 import Select from 'src/components/select/select.vue'
+import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
@@ -77,6 +78,7 @@ const GeneralTab = {
     FloatSetting,
     UnitSetting,
     InterfaceLanguageSwitcher,
+    ProfileSettingIndicator,
     ScopeSelector,
     Select
   },
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index 409cc9e6b..5521ea411 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -58,18 +58,49 @@ library.add(
 )
 
 export default {
-  props: [
-    'editable',
-    'userId',
-    'switcher',
-    'selected',
-    'hideBio',
-    'rounded',
-    'bordered',
-    'avatarAction', // default - open profile, 'zoom' - zoom, function - call function
-    'onClose',
-    'hasNoteEditor'
-  ],
+  props: {
+    // Enables all the options for profile editing, used in settings -> profile tab
+    editable: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    // ID of user to show data of
+    userId: {
+      required: true,
+      type: String
+    },
+    // Use a compact layout that hides bio, stats etc.
+    hideBio: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    // default - open profile, 'zoom' - zoom, function - call function
+    avatarAction: {
+      required: false,
+      type: String,
+      default: 'default'
+    },
+    // Show note editor if supported
+    hasNoteEditor: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show close icon (for popovers)
+    showClose: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show close icon (for popovers)
+    showExpand: {
+      required: false,
+      type: Boolean,
+      default: false
+    }
+  },
   components: {
     DialogModal,
     UserAvatar,
@@ -155,14 +186,6 @@ export default {
     relationship () {
       return this.$store.getters.relationship(this.userId)
     },
-    classes () {
-      return [{
-        '-rounded-t': this.rounded === 'top', // set border-top-left-radius and border-top-right-radius
-        '-rounded': this.rounded === true, // set border-radius for all sides
-        '-bordered': this.bordered === true, // set border for all sides
-        '-popover': !!this.onClose // set popover rounding
-      }]
-    },
     style () {
       return {
         backgroundImage: [
@@ -332,12 +355,6 @@ export default {
     unsubscribeUser () {
       return this.$store.dispatch('unsubscribeUser', this.user.id)
     },
-    setProfileView (v) {
-      if (this.switcher) {
-        const store = this.$store
-        store.commit('setProfileView', { v })
-      }
-    },
     linkClicked ({ target }) {
       if (target.tagName === 'SPAN') {
         target = target.parentNode
@@ -457,7 +474,7 @@ export default {
         fields_attributes: this.newFields.filter(el => el != null),
         show_role: !!this.newShowRole,
         birthday: this.newBirthday || '',
-        show_birthday: !!this.showBirthday,
+        show_birthday: !!this.newShowBirthday,
       }
 
       if (this.actorType) {
diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index c948480ba..1ad2018ba 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -3,6 +3,9 @@
   z-index: 1;
   overflow: hidden;
 
+  border-top-left-radius: calc(var(--roundness) - 1px);
+  border-top-right-radius: calc(var(--roundness) - 1px);
+
   // editing headers
   h4 {
     line-height: 2;
@@ -118,42 +121,12 @@
     padding: 0;
     mask: linear-gradient(to top, transparent 0, white 5em) bottom no-repeat;
     background-size: cover;
-    border-top-left-radius: calc(var(--__roundnessTop, --panelRadius) - 1px);
-    border-top-right-radius: calc(var(--__roundnessTop, --panelRadius) - 1px);
-    border-bottom-left-radius: calc(var(--__roundnessBottom, --panelRadius) - 1px);
-    border-bottom-right-radius: calc(var(--__roundnessBottom, --panelRadius) - 1px);
     background-color: var(--profileBg);
+    border-top-left-radius: calc(var(--roundness) - 1px);
+    border-top-right-radius: calc(var(--roundness) - 1px);
     z-index: -2;
   }
 
-  &.-rounded-t {
-    border-top-left-radius: var(--roundness);
-    border-top-right-radius: var(--roundness);
-
-    --__roundnessTop: var(--roundness);
-    --__roundnessBottom: 0;
-  }
-
-  &.-rounded {
-    border-radius: var(--roundness);
-
-    --__roundnessTop: var(--roundness);
-    --__roundnessBottom: var(--roundness);
-  }
-
-  &.-popover {
-    border-radius: var(--roundness);
-
-    --__roundnessTop: var(--roundness);
-    --__roundnessBottom: var(--roundness);
-  }
-
-  &.-bordered {
-    border-width: 1px;
-    border-style: solid;
-    border-color: var(--border);
-  }
-
   .bottom-buttons {
     display: flex;
     gap: 0.5em;
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index d913cf96e..a993a87a5 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -1,8 +1,5 @@
 <template>
-  <div
-    class="user-card"
-    :class="classes"
-  >
+  <div class="user-card">
     <div class="user-card-inner">
       <div class="user-info">
         <div class="user-identity">
@@ -70,7 +67,7 @@
                     fixed-width
                     class="icon"
                     icon="pencil"
-                    :title="$t('user_card.change_banner')"
+                    :title="$t('settings.change_banner')"
                   />
                 </button>
                 <button
@@ -102,10 +99,10 @@
                   :relationship="relationship"
                 />
                 <router-link
-                  v-if="onClose"
+                  v-if="showExpand"
                   :to="userProfileLink(user)"
                   class="button-unstyled external-link-button"
-                  @click="onClose"
+                  @click="$emit('close')"
                 >
                   <FAIcon
                     class="icon"
@@ -113,9 +110,9 @@
                   />
                 </router-link>
                 <button
-                  v-if="onClose"
+                  v-if="showClose"
                   class="button-unstyled external-link-button"
-                  @click="onClose"
+                  @click="$emit('close')"
                 >
                   <FAIcon
                     class="icon"
@@ -164,7 +161,7 @@
               </div>
             </div>
             <div class="bottom-line">
-              <user-link
+              <UserLink
                 class="user-screen-name"
                 :user="user"
               />
@@ -521,32 +518,22 @@
         <dl
           v-if="!mergedConfig.hideUserStats && !hideBio"
           class="user-count"
-          @click.prevent="setProfileView('statuses')"
         >
           <dd>{{ user.statuses_count }}</dd>
           {{ ' ' }}
           <dt>{{ $t('user_card.statuses') }}</dt>
         </dl>
-        <dl
-          class="user-count"
-          @click.prevent="setProfileView('statuses')"
-        >
+        <dl class="user-count">
           <dd>{{ dailyAvg }}</dd>
           {{ ' ' }}
           <dt>{{ $t('user_card.statuses_per_day') }}</dt>
         </dl>
-        <dl
-          class="user-count"
-          @click.prevent="setProfileView('friends')"
-        >
+        <dl class="user-count">
           <dd>{{ hideFollowsCount ? $t('user_card.hidden') : user.friends_count }}</dd>
           {{ ' ' }}
           <dt>{{ $t('user_card.followees') }}</dt>
         </dl>
-        <dl
-          class="user-count"
-          @click.prevent="setProfileView('followers')"
-        >
+        <dl class="user-count">
           <dd>{{ hideFollowersCount ? $t('user_card.hidden') : user.followers_count }}</dd>
           {{ ' ' }}
           <dt>{{ $t('user_card.followers') }}</dt>
@@ -568,7 +555,7 @@
           class="birthday"
         >
           <div>
-            <Checkbox v-model="showBirthday">
+            <Checkbox v-model="newShowBirthday">
               {{ $t('settings.birthday.show_birthday') }}
             </Checkbox>
           </div>
diff --git a/src/components/user_panel/user_panel.vue b/src/components/user_panel/user_panel.vue
index 783770dda..14741fe00 100644
--- a/src/components/user_panel/user_panel.vue
+++ b/src/components/user_panel/user_panel.vue
@@ -8,7 +8,6 @@
       <UserCard
         :user-id="user.id"
         :hide-bio="true"
-        rounded="top"
       />
       <PostStatusForm />
     </div>
diff --git a/src/components/user_popover/user_popover.vue b/src/components/user_popover/user_popover.vue
index 10850ef70..e0f2c84c1 100644
--- a/src/components/user_popover/user_popover.vue
+++ b/src/components/user_popover/user_popover.vue
@@ -12,10 +12,12 @@
     <template #content="{close}">
       <UserCard
         class="user-popover"
+        :show-close="true"
+        :show-expand="true"
         :user-id="userId"
         :hide-bio="true"
         :avatar-action="userPopoverAvatarAction == 'close' ? close : userPopoverAvatarAction"
-        :on-close="close"
+        @close="close"
       />
     </template>
   </Popover>
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index e759c6752..e05e62c46 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -4,13 +4,12 @@
       v-if="user"
       class="user-profile panel panel-default"
     >
-      <div class="panel-body">
+      <div class="panel-body card-wrapper">
         <UserCard
           :user-id="userId"
           :switcher="true"
           :selected="timeline.viewing"
           avatar-action="zoom"
-          rounded="top"
           :has-note-editor="true"
         />
       </div>
@@ -130,6 +129,16 @@
 .user-profile {
   flex: 2;
 
+  .card-wrapper {
+    border-top-left-radius: var(--roundness);
+    border-top-right-radius: var(--roundness);
+  }
+
+  .panel-footer {
+    border-bottom-left-radius: var(--roundness);
+    border-bottom-right-radius: var(--roundness);
+  }
+
   // No sticky header on user profile
   --currentPanelStack: 0;
 
diff --git a/src/panel.scss b/src/panel.scss
index 8d9c2896b..dbd6f2041 100644
--- a/src/panel.scss
+++ b/src/panel.scss
@@ -4,6 +4,7 @@
   --__panel-backdrop-filter: var(--backdrop-filter);
   --_shadow: var(--shadow);
 
+
   .tab-switcher .tabs {
     background: var(--__panel-background);
     backdrop-filter: var(--__panel-backdrop-filter);

From 76e67a08c6b18e9131a4163d85d013f68a417aef Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 18:20:06 +0300
Subject: [PATCH 6/9] appearance card fix

---
 src/components/settings_modal/tabs/appearance_tab.js | 3 +++
 src/components/user_card/user_card.js                | 3 ---
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/settings_modal/tabs/appearance_tab.js b/src/components/settings_modal/tabs/appearance_tab.js
index 77204850a..7fbb0a5cd 100644
--- a/src/components/settings_modal/tabs/appearance_tab.js
+++ b/src/components/settings_modal/tabs/appearance_tab.js
@@ -191,6 +191,9 @@ const AppearanceTab = {
     }
   },
   computed: {
+    isDefaultBackground () {
+      return !(this.$store.state.users.currentUser.background_image)
+    },
     switchInProgress () {
       return useInterfaceStore().themeChangeInProgress
     },
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index 5521ea411..f68ded665 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -314,9 +314,6 @@ export default {
       return !(this.$store.state.users.currentUser.cover_photo) ||
       this.$store.state.users.currentUser.cover_photo.includes(baseBanner)
     },
-    isDefaultBackground () {
-      return !(this.$store.state.users.currentUser.background_image)
-    },
     fieldsLimits () {
       return this.$store.state.instance.fieldsLimits
     },

From d66dd17f7b2d1d1c9147272bcf4453ac71ec32a4 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 18:21:49 +0300
Subject: [PATCH 7/9] vuex cleanup

---
 src/modules/instance.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/modules/instance.js b/src/modules/instance.js
index ef27353eb..93f81e4d8 100644
--- a/src/modules/instance.js
+++ b/src/modules/instance.js
@@ -139,7 +139,6 @@ const defaultState = {
 
   // Nasty stuff
   customEmoji: [],
-  rawCustomEmoji: [],
   customEmojiFetched: false,
   emoji: {},
   emojiFetched: false,

From 1c4f19e56ffc385263ff47af4b9f6abfbdd31c57 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 18:23:17 +0300
Subject: [PATCH 8/9] fix

---
 src/components/settings_modal/tabs/profile_tab.vue | 1 -
 src/components/user_card/user_card.js              | 2 --
 src/components/user_card/user_card.scss            | 1 -
 src/panel.scss                                     | 1 -
 4 files changed, 5 deletions(-)

diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index 6d458c7c8..947be4a18 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -6,7 +6,6 @@
         :user-id="user.id"
         :editable="true"
         :switcher="false"
-        rounded="top"
       />
     </div>
     <div class="setting-item">
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index f68ded665..8a99c4ceb 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -430,9 +430,7 @@ export default {
     addField () {
       if (this.newFields.length < this.maxFields) {
         this.newFields.push({ name: '', value: '' })
-        return true
       }
-      return false
     },
     deleteField (index) {
       this.newFields.splice(index, 1)
diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 1ad2018ba..ce26fdfe7 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -2,7 +2,6 @@
   position: relative;
   z-index: 1;
   overflow: hidden;
-
   border-top-left-radius: calc(var(--roundness) - 1px);
   border-top-right-radius: calc(var(--roundness) - 1px);
 
diff --git a/src/panel.scss b/src/panel.scss
index dbd6f2041..8d9c2896b 100644
--- a/src/panel.scss
+++ b/src/panel.scss
@@ -4,7 +4,6 @@
   --__panel-backdrop-filter: var(--backdrop-filter);
   --_shadow: var(--shadow);
 
-
   .tab-switcher .tabs {
     background: var(--__panel-background);
     backdrop-filter: var(--__panel-backdrop-filter);

From 7b643b5486f52e4e07f292606d9e3adb7cdd0966 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 18:33:38 +0300
Subject: [PATCH 9/9] lint

---
 src/components/settings_modal/tabs/general_tab.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index f0ff7f50b..49fc57c79 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -15,7 +15,7 @@
           <interface-language-switcher
             v-model="emailLanguage"
             :profile="true"
-            @update:modelValue="updateProfile()"
+            @update:model-value="updateProfile()"
           >
             {{ $t('settings.email_language') }}
           </interface-language-switcher>