From 8fa182e246533fdb26d26d8e39d05632f014602a Mon Sep 17 00:00:00 2001 From: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com> Date: Mon, 19 Sep 2022 08:14:53 -0400 Subject: [PATCH] Properly localize numbers (#2557) * localize numbers properly * Remove tostring Co-authored-by: Aiz <66974576+Aiz0@users.noreply.github.com> Co-authored-by: Aiz <66974576+Aiz0@users.noreply.github.com> --- .../components/ft-list-channel/ft-list-channel.js | 10 +++++++--- src/renderer/components/ft-list-video/ft-list-video.js | 7 ++++++- src/renderer/components/playlist-info/playlist-info.js | 8 ++++++-- .../components/watch-video-info/watch-video-info.js | 5 +++-- src/renderer/views/Channel/Channel.js | 7 ++++++- src/renderer/views/Watch/Watch.js | 6 +++++- 6 files changed, 33 insertions(+), 10 deletions(-) diff --git a/src/renderer/components/ft-list-channel/ft-list-channel.js b/src/renderer/components/ft-list-channel/ft-list-channel.js index c4525fcf..aac1e76e 100644 --- a/src/renderer/components/ft-list-channel/ft-list-channel.js +++ b/src/renderer/components/ft-list-channel/ft-list-channel.js @@ -1,4 +1,5 @@ import Vue from 'vue' +import i18n from '../../i18n/index' export default Vue.extend({ name: 'FtListChannel', @@ -32,6 +33,9 @@ export default Vue.extend({ }, hideChannelSubscriptions: function () { return this.$store.getters.getHideChannelSubscriptions + }, + currentLocale: function () { + return i18n.locale.replace('_', '-') } }, mounted: function () { @@ -59,7 +63,7 @@ export default Vue.extend({ if (this.data.videos === null) { this.videoCount = 0 } else { - this.videoCount = this.data.videos.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.videoCount = Intl.NumberFormat(this.currentLocale).format(this.data.videos) } this.description = this.data.descriptionShort @@ -81,9 +85,9 @@ export default Vue.extend({ if (this.hideChannelSubscriptions) { this.subscriberCount = null } else { - this.subscriberCount = this.data.subCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.subscriberCount = Intl.NumberFormat(this.currentLocale).format(this.data.subCount) } - this.videoCount = this.data.videoCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.videoCount = Intl.NumberFormat(this.currentLocale).format(this.data.videoCount) this.description = this.data.description } } diff --git a/src/renderer/components/ft-list-video/ft-list-video.js b/src/renderer/components/ft-list-video/ft-list-video.js index 8fd80c14..6b43128a 100644 --- a/src/renderer/components/ft-list-video/ft-list-video.js +++ b/src/renderer/components/ft-list-video/ft-list-video.js @@ -1,6 +1,7 @@ import Vue from 'vue' import FtIconButton from '../ft-icon-button/ft-icon-button.vue' import { mapActions } from 'vuex' +import i18n from '../../i18n/index' export default Vue.extend({ name: 'FtListVideo', @@ -249,6 +250,10 @@ export default Vue.extend({ saveWatchedProgress: function () { return this.$store.getters.getSaveWatchedProgress + }, + + currentLocale: function () { + return i18n.locale.replace('_', '-') } }, mounted: function () { @@ -424,7 +429,7 @@ export default Vue.extend({ if (this.hideVideoViews) { this.hideViews = true } else if (typeof (this.data.viewCount) !== 'undefined' && this.data.viewCount !== null) { - this.parsedViewCount = this.data.viewCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.parsedViewCount = Intl.NumberFormat(this.currentLocale).format(this.data.viewCount) } else if (typeof (this.data.viewCountText) !== 'undefined') { this.parsedViewCount = this.data.viewCountText.replace(' views', '') } else { diff --git a/src/renderer/components/playlist-info/playlist-info.js b/src/renderer/components/playlist-info/playlist-info.js index f6edc105..2243b15b 100644 --- a/src/renderer/components/playlist-info/playlist-info.js +++ b/src/renderer/components/playlist-info/playlist-info.js @@ -1,6 +1,7 @@ import Vue from 'vue' import { mapActions } from 'vuex' import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue' +import i18n from '../../i18n/index' export default Vue.extend({ name: 'PlaylistInfo', @@ -75,6 +76,9 @@ export default Vue.extend({ default: return `https://i.ytimg.com/vi/${this.firstVideoId}/mqdefault.jpg` } + }, + currentLocale: function () { + return i18n.locale.replace('_', '-') } }, mounted: function () { @@ -91,11 +95,11 @@ export default Vue.extend({ // Causes errors if not put inside of a check if (typeof (this.data.viewCount) !== 'undefined') { - this.viewCount = this.hideViews ? null : this.data.viewCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.viewCount = this.hideViews ? null : Intl.NumberFormat(this.currentLocale).format(this.data.viewCount) } if (typeof (this.data.videoCount) !== 'undefined') { - this.videoCount = this.data.videoCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.videoCount = Intl.NumberFormat(this.currentLocale).format(this.data.videoCount) } this.lastUpdated = this.data.lastUpdated diff --git a/src/renderer/components/watch-video-info/watch-video-info.js b/src/renderer/components/watch-video-info/watch-video-info.js index d89da7e5..d199cb4d 100644 --- a/src/renderer/components/watch-video-info/watch-video-info.js +++ b/src/renderer/components/watch-video-info/watch-video-info.js @@ -7,6 +7,7 @@ import FtFlexBox from '../ft-flex-box/ft-flex-box.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' export default Vue.extend({ name: 'WatchVideoInfo', @@ -135,7 +136,7 @@ export default Vue.extend({ }, currentLocale: function () { - return this.$store.getters.getCurrentLocale + return i18n.locale.replace('_', '-') }, profileList: function () { @@ -238,7 +239,7 @@ export default Vue.extend({ if (this.hideVideoViews) { return null } - return this.viewCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + ` ${this.$t('Video.Views').toLowerCase()}` + return Intl.NumberFormat(this.currentLocale).format(this.viewCount) + ` ${this.$t('Video.Views').toLowerCase()}` }, isSubscribed: function () { diff --git a/src/renderer/views/Channel/Channel.js b/src/renderer/views/Channel/Channel.js index ebb899c8..9bc14d82 100644 --- a/src/renderer/views/Channel/Channel.js +++ b/src/renderer/views/Channel/Channel.js @@ -13,6 +13,7 @@ import FtAgeRestricted from '../../components/ft-age-restricted/ft-age-restricte import ytch from 'yt-channel-info' import autolinker from 'autolinker' import { MAIN_PROFILE_ID } from '../../../constants' +import i18n from '../../i18n/index' export default Vue.extend({ name: 'Search', @@ -132,11 +133,15 @@ export default Vue.extend({ ] }, + currentLocale: function () { + return i18n.locale.replace('_', '-') + }, + formattedSubCount: function () { if (this.hideChannelSubscriptions) { return null } - return this.subCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + return Intl.NumberFormat(this.currentLocale).format(this.subCount) }, showFetchMoreButton: function () { diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js index 37ebfa25..eeffc68d 100644 --- a/src/renderer/views/Watch/Watch.js +++ b/src/renderer/views/Watch/Watch.js @@ -14,6 +14,7 @@ import WatchVideoLiveChat from '../../components/watch-video-live-chat/watch-vid import WatchVideoPlaylist from '../../components/watch-video-playlist/watch-video-playlist.vue' import WatchVideoRecommendations from '../../components/watch-video-recommendations/watch-video-recommendations.vue' import FtAgeRestricted from '../../components/ft-age-restricted/ft-age-restricted.vue' +import i18n from '../../i18n/index' export default Vue.extend({ name: 'Watch', @@ -160,6 +161,9 @@ export default Vue.extend({ }, theatrePossible: function () { return !this.hideRecommendedVideos || (!this.hideLiveChat && this.isLive) || this.watchingPlaylist + }, + currentLocale: function () { + return i18n.locale.replace('_', '-') } }, watch: { @@ -354,7 +358,7 @@ export default Vue.extend({ } else if (subCount >= 10000) { this.channelSubscriptionCountText = `${subCount / 1000}K` } else { - this.channelSubscriptionCountText = subCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') + this.channelSubscriptionCountText = Intl.NumberFormat(this.currentLocale).format(subCount) } }