Prettify number of issues (#17760)
* Prettify number of issues - Use the PrettyNumber function to add commas in large amount of issues. * Use client-side formatting * prettify on both server and client * remove unused i18n entries * handle more cases, support other int types in PrettyNumber * specify locale to avoid issues with node default locale * remove superfluos argument * introduce template helper, octicon tweaks, js refactor * Update modules/templates/helper.go * Apply some suggestions. * Add comment * Update templates/user/dashboard/issues.tmpl Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
parent
0097fbc2ac
commit
796c4eca0b
14 changed files with 118 additions and 45 deletions
14
web_src/js/features/formatting.js
Normal file
14
web_src/js/features/formatting.js
Normal file
|
@ -0,0 +1,14 @@
|
|||
import {prettyNumber} from '../utils.js';
|
||||
|
||||
const {lang} = document.documentElement;
|
||||
|
||||
export function initFormattingReplacements() {
|
||||
// replace english formatted numbers with locale-specific separators
|
||||
for (const el of document.getElementsByClassName('js-pretty-number')) {
|
||||
const num = Number(el.getAttribute('data-value'));
|
||||
const formatted = prettyNumber(num, lang);
|
||||
if (formatted && formatted !== el.textContent) {
|
||||
el.textContent = formatted;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -84,6 +84,11 @@ import {initRepoBranchButton} from './features/repo-branch.js';
|
|||
import {initCommonOrganization} from './features/common-organization.js';
|
||||
import {initRepoWikiForm} from './features/repo-wiki.js';
|
||||
import {initRepoCommentForm, initRepository} from './features/repo-legacy.js';
|
||||
import {initFormattingReplacements} from './features/formatting.js';
|
||||
|
||||
// Run time-critical code as soon as possible. This is safe to do because this
|
||||
// script appears at the end of <body> and rendered HTML is accessible at that point.
|
||||
initFormattingReplacements();
|
||||
|
||||
// Silence fomantic's error logging when tabs are used without a target content element
|
||||
$.fn.tab.settings.silent = true;
|
||||
|
|
|
@ -90,3 +90,10 @@ export function strSubMatch(full, sub) {
|
|||
}
|
||||
return res;
|
||||
}
|
||||
|
||||
// pretty-print a number using locale-specific separators, e.g. 1200 -> 1,200
|
||||
export function prettyNumber(num, locale = 'en-US') {
|
||||
if (typeof num !== 'number') return '';
|
||||
const {format} = new Intl.NumberFormat(locale);
|
||||
return format(num);
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import {
|
||||
basename, extname, isObject, uniq, stripTags, joinPaths, parseIssueHref, strSubMatch,
|
||||
basename, extname, isObject, uniq, stripTags, joinPaths, parseIssueHref, strSubMatch, prettyNumber,
|
||||
} from './utils.js';
|
||||
|
||||
test('basename', () => {
|
||||
|
@ -85,7 +85,6 @@ test('parseIssueHref', () => {
|
|||
expect(parseIssueHref('')).toEqual({owner: undefined, repo: undefined, type: undefined, index: undefined});
|
||||
});
|
||||
|
||||
|
||||
test('strSubMatch', () => {
|
||||
expect(strSubMatch('abc', '')).toEqual(['abc']);
|
||||
expect(strSubMatch('abc', 'a')).toEqual(['', 'a', 'bc']);
|
||||
|
@ -98,3 +97,14 @@ test('strSubMatch', () => {
|
|||
expect(strSubMatch('aabbcc', 'abc')).toEqual(['', 'a', 'a', 'b', 'b', 'c', 'c']);
|
||||
expect(strSubMatch('the/directory', 'hedir')).toEqual(['t', 'he', '/', 'dir', 'ectory']);
|
||||
});
|
||||
|
||||
test('prettyNumber', () => {
|
||||
expect(prettyNumber()).toEqual('');
|
||||
expect(prettyNumber(null)).toEqual('');
|
||||
expect(prettyNumber(undefined)).toEqual('');
|
||||
expect(prettyNumber('1200')).toEqual('');
|
||||
expect(prettyNumber(12345678, 'en-US')).toEqual('12,345,678');
|
||||
expect(prettyNumber(12345678, 'de-DE')).toEqual('12.345.678');
|
||||
expect(prettyNumber(12345678, 'be-BE')).toEqual('12 345 678');
|
||||
expect(prettyNumber(12345678, 'hi-IN')).toEqual('1,23,45,678');
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue