FreeTube/src/renderer/components/ft-profile-bubble/ft-profile-bubble.js
Jason 47946ff453
Profile settings UX improvements (#4358)
* Update Edit Profile styling, labels, and order

* Introduce additional styling updates

* Remove check for channel name of All Channels, as that can be faulty for users who renamed it & had another profile take the name

* Force use of All Channels profile translation (& forbid alteration of All Channels profile name

* Combine ProfileSettings and ProfileEdit routes under one route

* Implement active settings profile styling & profileList watcher

* Fix pre-existing bug of selected channels & count in Other Channels not updating when changing the profile filter

* Fix pre-existing behavior of filter profile selection resetting after each use

* Fix pre-existing bug with Edit Profile Subscription List of count bugging after adding new channel mid-count

And vice versa with removing channel mid-count on Other Channels.

* Fix two toasts to use localized profile name, & remove unnecessary mounted

* Remove old modification of base ft-input styling
2023-11-25 18:23:27 +01:00

40 lines
989 B
JavaScript

import { defineComponent } from 'vue'
import { sanitizeForHtmlId } from '../../helpers/accessibility'
import { MAIN_PROFILE_ID } from '../../../constants'
export default defineComponent({
name: 'FtProfileBubble',
props: {
profileName: {
type: String,
required: true
},
profileId: {
type: String,
required: true
},
backgroundColor: {
type: String,
required: true
},
textColor: {
type: String,
required: true
}
},
computed: {
isMainProfile: function () {
return this.profileId === MAIN_PROFILE_ID
},
sanitizedId: function() {
return 'profileBubble' + sanitizeForHtmlId(this.profileId)
},
profileInitial: function () {
return this?.profileName?.length > 0 ? Array.from(this.translatedProfileName)[0].toUpperCase() : ''
},
translatedProfileName: function () {
return this.isMainProfile ? this.$t('Profile.All Channels') : this.profileName
}
}
})