Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add a formatNumber helper and other i18n cleanup #3055

Merged
merged 2 commits into from
Jan 15, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 4 additions & 7 deletions src/renderer/components/ft-list-channel/ft-list-channel.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import Vue from 'vue'
import i18n from '../../i18n/index'
import { youtubeImageUrlToInvidious } from '../../helpers/api/invidious'
import { formatNumber } from '../../helpers/utils'

export default Vue.extend({
name: 'FtListChannel',
Expand Down Expand Up @@ -35,9 +35,6 @@ export default Vue.extend({
},
hideChannelSubscriptions: function () {
return this.$store.getters.getHideChannelSubscriptions
},
currentLocale: function () {
return i18n.locale.replace('_', '-')
}
},
mounted: function () {
Expand Down Expand Up @@ -65,7 +62,7 @@ export default Vue.extend({
if (this.data.videos === null) {
this.videoCount = 0
} else {
this.videoCount = Intl.NumberFormat(this.currentLocale).format(this.data.videos)
this.videoCount = formatNumber(this.data.videos)
}

if (this.data.handle) {
Expand All @@ -86,9 +83,9 @@ export default Vue.extend({
if (this.hideChannelSubscriptions) {
this.subscriberCount = null
} else {
this.subscriberCount = Intl.NumberFormat(this.currentLocale).format(this.data.subCount)
this.subscriberCount = formatNumber(this.data.subCount)
}
this.videoCount = Intl.NumberFormat(this.currentLocale).format(this.data.videoCount)
this.videoCount = formatNumber(this.data.videoCount)
this.description = this.data.description
}
}
Expand Down
10 changes: 3 additions & 7 deletions src/renderer/components/ft-list-video/ft-list-video.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,14 @@
import Vue from 'vue'
import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
import { mapActions } from 'vuex'
import i18n from '../../i18n/index'
import {
copyToClipboard,
formatDurationAsTimestamp,
formatNumber,
openExternalLink,
showToast,
toLocalePublicationString,
toDistractionFreeTitle,

toDistractionFreeTitle
} from '../../helpers/utils'

export default Vue.extend({
Expand Down Expand Up @@ -282,9 +281,6 @@ export default Vue.extend({
return this.$store.getters.getSaveWatchedProgress
},

currentLocale: function () {
return i18n.locale.replace('_', '-')
},
showDistractionFreeTitles: function () {
return this.$store.getters.getShowDistractionFreeTitles
},
Expand Down Expand Up @@ -406,7 +402,7 @@ export default Vue.extend({
if (this.hideVideoViews) {
this.hideViews = true
} else if (typeof (this.data.viewCount) !== 'undefined' && this.data.viewCount !== null) {
this.parsedViewCount = Intl.NumberFormat(this.currentLocale).format(this.data.viewCount)
this.parsedViewCount = formatNumber(this.data.viewCount)
} else if (typeof (this.data.viewCountText) !== 'undefined') {
this.parsedViewCount = this.data.viewCountText.replace(' views', '')
} else {
Expand Down
10 changes: 3 additions & 7 deletions src/renderer/components/playlist-info/playlist-info.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import Vue from 'vue'
import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue'
import i18n from '../../i18n/index'
import { copyToClipboard, openExternalLink } from '../../helpers/utils'
import { copyToClipboard, formatNumber, openExternalLink } from '../../helpers/utils'

export default Vue.extend({
name: 'PlaylistInfo',
Expand Down Expand Up @@ -76,9 +75,6 @@ export default Vue.extend({
default:
return `https://i.ytimg.com/vi/${this.firstVideoId}/mqdefault.jpg`
}
},
currentLocale: function () {
return i18n.locale.replace('_', '-')
}
},
mounted: function () {
Expand All @@ -94,11 +90,11 @@ export default Vue.extend({

// Causes errors if not put inside of a check
if (typeof (this.data.viewCount) !== 'undefined' && !isNaN(this.data.viewCount)) {
this.viewCount = this.hideViews ? null : Intl.NumberFormat(this.currentLocale).format(this.data.viewCount)
this.viewCount = this.hideViews ? null : formatNumber(this.data.viewCount)
}

if (typeof (this.data.videoCount) !== 'undefined' && !isNaN(this.data.videoCount)) {
this.videoCount = Intl.NumberFormat(this.currentLocale).format(this.data.videoCount)
this.videoCount = formatNumber(this.data.videoCount)
}

this.lastUpdated = this.data.lastUpdated
Expand Down
16 changes: 6 additions & 10 deletions src/renderer/components/watch-video-info/watch-video-info.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,7 @@ import FtButton from '../ft-button/ft-button.vue'
import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
import FtShareButton from '../ft-share-button/ft-share-button.vue'
import { MAIN_PROFILE_ID } from '../../../constants'
import i18n from '../../i18n/index'
import { openExternalLink, showToast } from '../../helpers/utils'
import { formatNumber, openExternalLink, showToast } from '../../helpers/utils'

export default Vue.extend({
name: 'WatchVideoInfo',
Expand Down Expand Up @@ -133,7 +132,7 @@ export default Vue.extend({
},

currentLocale: function () {
return i18n.locale.replace('_', '-')
return this.$i18n.locale.replace('_', '-')
},

profileList: function () {
Expand Down Expand Up @@ -215,17 +214,15 @@ export default Vue.extend({
return null
}

const locale = this.currentLocale.replace('_', '-')
return this.likeCount.toLocaleString([locale, 'en'])
return formatNumber(this.likeCount)
},

parsedDislikeCount: function () {
if (this.hideVideoLikesAndDislikes || this.dislikeCount === null) {
return null
}

const locale = this.currentLocale.replace('_', '-')
return this.dislikeCount.toLocaleString([locale, 'en'])
return formatNumber(this.dislikeCount)
},

likePercentageRatio: function () {
Expand All @@ -236,7 +233,7 @@ export default Vue.extend({
if (this.hideVideoViews) {
return null
}
return Intl.NumberFormat(this.currentLocale).format(this.viewCount) + ` ${this.$t('Video.Views').toLowerCase()}`
return formatNumber(this.viewCount) + ` ${this.$t('Video.Views').toLowerCase()}`
},

isSubscribed: function () {
Expand All @@ -261,8 +258,7 @@ export default Vue.extend({

dateString() {
const date = new Date(this.published)
const locale = this.currentLocale.replace('_', '-')
const localeDateString = new Intl.DateTimeFormat([locale, 'en'], { dateStyle: 'medium' }).format(date)
const localeDateString = new Intl.DateTimeFormat([this.currentLocale, 'en'], { dateStyle: 'medium' }).format(date)
// replace spaces with no break spaces to make the date act as a single entity while wrapping
return `${localeDateString}`.replaceAll(' ', '\u00A0')
},
Expand Down
4 changes: 4 additions & 0 deletions src/renderer/helpers/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -606,3 +606,7 @@ export function toDistractionFreeTitle(title, minUpperCase = 3) {
const reg = RegExp(`[\\p{Lu}|']{${minUpperCase},}`, 'ug')
return title.replace(reg, x => capitalizedWord(x.toLowerCase()))
}

export function formatNumber(number, options = undefined) {
return Intl.NumberFormat([i18n.locale.replace('_', '-'), 'en'], options).format(number)
}
9 changes: 2 additions & 7 deletions src/renderer/views/Channel/Channel.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,7 @@ import FtShareButton from '../../components/ft-share-button/ft-share-button.vue'
import ytch from 'yt-channel-info'
import autolinker from 'autolinker'
import { MAIN_PROFILE_ID } from '../../../constants'
import i18n from '../../i18n/index'
import { copyToClipboard, showToast } from '../../helpers/utils'
import { copyToClipboard, formatNumber, showToast } from '../../helpers/utils'
import packageDetails from '../../../../package.json'
import { invidiousAPICall, invidiousGetChannelInfo, youtubeImageUrlToInvidious } from '../../helpers/api/invidious'

Expand Down Expand Up @@ -143,15 +142,11 @@ export default Vue.extend({
]
},

currentLocale: function () {
return i18n.locale.replace('_', '-')
},

formattedSubCount: function () {
if (this.hideChannelSubscriptions) {
return null
}
return Intl.NumberFormat(this.currentLocale).format(this.subCount)
return formatNumber(this.subCount)
},

showFetchMoreButton: function () {
Expand Down
3 changes: 1 addition & 2 deletions src/renderer/views/Playlist/Playlist.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import PlaylistInfo from '../../components/playlist-info/playlist-info.vue'
import FtListVideoLazy from '../../components/ft-list-video-lazy/ft-list-video-lazy.vue'
import FtFlexBox from '../../components/ft-flex-box/ft-flex-box.vue'
import FtButton from '../../components/ft-button/ft-button.vue'
import i18n from '../../i18n/index'
import { getLocalPlaylist, parseLocalPlaylistVideo } from '../../helpers/api/local'
import { extractNumberFromString } from '../../helpers/utils'
import { invidiousGetPlaylistInfo, youtubeImageUrlToInvidious } from '../../helpers/api/invidious'
Expand Down Expand Up @@ -55,7 +54,7 @@ export default Vue.extend({
return this.$store.getters.getCurrentInvidiousInstance
},
currentLocale: function () {
return i18n.locale.replace('_', '-')
return this.$i18n.locale.replace('_', '-')
}
},
watch: {
Expand Down
5 changes: 3 additions & 2 deletions src/renderer/views/Watch/Watch.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
copyToClipboard,
extractNumberFromString,
formatDurationAsTimestamp,
formatNumber,
getFormatsFromHLSManifest,
getUserDataPath,
showToast
Expand Down Expand Up @@ -371,9 +372,9 @@ export default Vue.extend({

if (!isNaN(subCount)) {
if (subCount >= 10000) {
this.channelSubscriptionCountText = Intl.NumberFormat([this.currentLocale, 'en'], { notation: 'compact' }).format(subCount)
this.channelSubscriptionCountText = formatNumber(subCount, { notation: 'compact' })
} else {
this.channelSubscriptionCountText = Intl.NumberFormat([this.currentLocale, 'en']).format(subCount)
this.channelSubscriptionCountText = formatNumber(subCount)
}
} else {
this.channelSubscriptionCountText = ''
Expand Down