Polaris translations should be initialized based on the locale of the request #139
Description
Issue summary
Right now, PolarisProvider.jsx imports the en translations, regardless of the locale of the request.
Expected behavior
Which translations are used in the Polaris components should depend on the locale of the request, and should fallback to en only when no appropriate translations could be found.
Actual behavior
en.json is used regardless. See hard-coded import statement.
Steps to reproduce the problem
Add a Polaris DatePicker to your app:
const [{month, year}, setDate] = useState({month: 1, year: 2018});
const [selectedDates, setSelectedDates] = useState({
start: new Date('Wed Feb 07 2018 00:00:00 GMT-0500 (EST)'),
end: new Date('Wed Feb 07 2018 00:00:00 GMT-0500 (EST)'),
});
return (
<>
<DatePicker
month={month}
year={year}
onChange={setSelectedDates}
// onMonthChange={handleMonthChange}
selected={selectedDates}
/>Then set your Shopify Admin/Identity account prefered language to something other than English (e.g., nb-NO)
Expected:
Actual:
Potential solution
Shopify provides the merchant's chosen locale in the locale query parameter. As a first step, PolarisProvider could be changed to allow the locale to be passed in.
Then it could load the corresponding translations based on an exact match of the locale. This would work for locales like fr, but not those like nb-NO, since there is no nb-NO.json in Polaris, just a nb.json.
As a next better step, it would follow the parentLocales data from CLDR to determine a fallback chain for the locale (e.g., nb-NO -> nb -> no), checking each locale in the fallback chain until finally defaulting to en.