scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2025-02-17 08:31:23 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Add @formatjs/relativetimeformat-polyfill

Browse source 
Safari < 14 does not support Intl.RelativeTimeFormat which is used in the moderation messaging. Adding this polyfill to support it. RelativeTimeFormat depends on Locale, which is also not available in Safari <14, and PluralRules, not available in Safari < 13.

There is a trade off between adding locale-data for all users that load the page regardless of what browser they’re using and whether they get muted, and only localizing the most common languages.
In the last 30 days only ~3% of users on scratch use a version of Safari (13.x) that doesn’t support Intl. Of that 3%, these 7 locales would cover over 60% of the users. English will be used by default if the locale data is not available.
This commit is contained in:
Chris Garrity 2021-02-02 08:42:55 -05:00
parent fe1dfaeb82
commit ae2bc24ffd
4 changed files with 3666 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3641
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

5
package.json
View file

@ -54,6 +54,9 @@
"scratch-storage": "^0.5.1"
},
"devDependencies": {
"@formatjs/intl-locale": "^2.4.13",
"@formatjs/intl-pluralrules": "^4.0.6",
"@formatjs/intl-relativetimeformat": "^8.0.3",
"ajv": "6.4.0",
"async": "3.1.0",
"autoprefixer": "6.3.6",
@ -91,6 +94,7 @@
"glob": "5.0.15",
"google-libphonenumber": "3.2.6",
"html-webpack-plugin": "2.22.0",
"i": "^0.3.6",
"iso-3166-2": "0.4.0",
"jest": "^23.6.0",
"json-loader": "0.5.2",
@ -108,6 +112,7 @@
"minilog": "2.0.8",
"node-dir": "0.1.16",
"node-sass": "4.14.1",
"npm": "^6.14.11",
"pako": "0.2.8",
"plotly.js": "1.47.4",
"po2icu": "0.0.2",

2
src/lib/format-time.js
View file

@ -1,6 +1,8 @@
// IMPORTANT: any changes to the time algorithm also need to be made in the corresponding
// scratchr2 file 'lib/format-time.js'
require('./relative-time-polyfill');
/**
Given a timestamp in the future, calculate the largest, closest unit to show.
On the high end we stop at hours. e.g. 15 days is still counted in hours not days or weeks.

18
src/lib/relative-time-polyfill.js Normal file
View file

@ -0,0 +1,18 @@
// this file should only be `required` in the format-time
// when Intl.RelativeTimeFormat is not available (Safari < 14), but
// we're not currently able to do the code splitting in www, and it
// is always included. To reduce the amount of data that's loaded limit
// the number of languages loaded to just the top few that are still using
// safari <14. These seven account for most uses.
// relativetimeformat depends on locale which also needs to be polyfilled in
// safari <14
require('@formatjs/intl-locale/polyfill');
require('@formatjs/intl-pluralrules');
require('@formatjs/intl-relativetimeformat/polyfill');
require('@formatjs/intl-relativetimeformat/locale-data/en');
require('@formatjs/intl-relativetimeformat/locale-data/ar');
require('@formatjs/intl-relativetimeformat/locale-data/es');
require('@formatjs/intl-relativetimeformat/locale-data/fr');
require('@formatjs/intl-relativetimeformat/locale-data/ja');
require('@formatjs/intl-relativetimeformat/locale-data/tr');
require('@formatjs/intl-relativetimeformat/locale-data/zh');