djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add react-intl

Browse source
This commit is contained in:
dominik-zeglen 2019-08-13 13:26:34 +02:00
parent ab68b39e09
commit 0eaec5e178
4 changed files with 83 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
package-lock.json generated
View file

@ -1225,6 +1225,11 @@
"tslib": "^1"
}
},
"@formatjs/intl-relativetimeformat": {
"version": "2.6.3",
"resolved": "https://registry.npmjs.org/@formatjs/intl-relativetimeformat/-/intl-relativetimeformat-2.6.3.tgz",
"integrity": "sha512-sb3PcbTSNQfnL4HM2XKedt8Oopf2EwaoxyjeMbgvje6x1zQuf1oTAidLHT65Dkox7hfSql8ZjpAqWqnHJsLN9w=="
},
"@heroku-cli/color": {
"version": "1.1.14",
"resolved": "https://registry.npmjs.org/@heroku-cli/color/-/color-1.1.14.tgz",
@ -2826,6 +2831,11 @@
"integrity": "sha512-ZiSCqW8j9/gQCYixz1nMhyCprSGh3rwdyX+FHAzEN+bMCmc7yCYjNutl6jvMYSxSIGeL0CLEXPM8Nlk2lE0t5w==",
"dev": true
},
"@types/invariant": {
"version": "2.2.30",
"resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.30.tgz",
"integrity": "sha512-98fB+yo7imSD2F7PF7GIpELNgtLNgo5wjivu0W5V4jx+KVVJxo6p/qN4zdzSTBWy4/sN3pPyXwnhRSD28QX+ag=="
},
"@types/istanbul-lib-coverage": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.1.tgz",
@ -11103,6 +11113,30 @@
"resolved": "https://registry.npmjs.org/interpret/-/interpret-1.2.0.tgz",
"integrity": "sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw=="
},
"intl-format-cache": {
"version": "4.1.10",
"resolved": "https://registry.npmjs.org/intl-format-cache/-/intl-format-cache-4.1.10.tgz",
"integrity": "sha512-7NqorxPNPuhbtwlXe71Dbjh9NlLvkoUymCI2AS/cyIsG7wYr27x9E/h4P16vftHwsTOjiDIjM/oGukddxgcz3A=="
},
"intl-locales-supported": {
"version": "1.4.5",
"resolved": "https://registry.npmjs.org/intl-locales-supported/-/intl-locales-supported-1.4.5.tgz",
"integrity": "sha512-D7oriM5x46rd7kNlSW0f9noIBegFr3ReIM6xlMpwH4lfIPD/zvBelPlCjR10IK16boGJG9lKccOvRAM8wzpbrA=="
},
"intl-messageformat": {
"version": "6.1.5",
"resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-6.1.5.tgz",
"integrity": "sha512-Ae/3PwnShCkDtnPvx9FLlBj1xiooa5NeeFZBizOQZZ/iaLt8IvgkPCdadkOF3f++FWDOBVtP5RszhMkJQKqmng==",
"requires": {
"intl-format-cache": "^4.1.10",
"intl-messageformat-parser": "^3.0.7"
}
},
"intl-messageformat-parser": {
"version": "3.0.7",
"resolved": "https://registry.npmjs.org/intl-messageformat-parser/-/intl-messageformat-parser-3.0.7.tgz",
"integrity": "sha512-L16VbbV3NFaiZV65XwOIH9fBe52TS2EkOR0k8Y4ratsgTE7KPEbcUCUrz/iEQwJo7BcWY4ohkZbeYZRgAiPR1Q=="
},
"into-stream": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/into-stream/-/into-stream-3.1.0.tgz",
@ -16077,6 +16111,25 @@
"once": "^1.4.0"
}
},
"react-intl": {
"version": "3.1.7",
"resolved": "https://registry.npmjs.org/react-intl/-/react-intl-3.1.7.tgz",
"integrity": "sha512-bsEQETQ9Ihk0a+z0WDdZhFRlP5MhbIfZJFG1D8IeYu7u7Y0tRYjLt2VDHEUBGsi7OIbTOPl2VTMXtRsb6BHP/Q==",
"requires": {
"@formatjs/intl-relativetimeformat": "^2.6.3",
"@types/hoist-non-react-statics": "^3.3.1",
"@types/invariant": "^2.2.30",
"@types/react": "^16.0.0",
"hoist-non-react-statics": "^3.3.0",
"intl-format-cache": "^4.1.10",
"intl-locales-supported": "^1.4.5",
"intl-messageformat": "^6.1.5",
"intl-messageformat-parser": "^3.0.7",
"invariant": "^2.1.1",
"react": "^16.3.0",
"shallow-equal": "^1.1.0"
}
},
"react-is": {
"version": "16.9.0",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.9.0.tgz",
@ -17243,8 +17296,7 @@
"shallow-equal": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-1.2.0.tgz",
"integrity": "sha512-Z21pVxR4cXsfwpMKMhCEIO1PCi5sp7KEp+CmOpBQ+E8GpHwKOw2sEzk7sgblM3d/j4z4gakoWEoPcjK0VJQogA==",
"dev": true
"integrity": "sha512-Z21pVxR4cXsfwpMKMhCEIO1PCi5sp7KEp+CmOpBQ+E8GpHwKOw2sEzk7sgblM3d/j4z4gakoWEoPcjK0VJQogA=="
},
"shallowequal": {
"version": "1.1.0",

1
package.json
View file

@ -56,6 +56,7 @@
"react-helmet": "^5.2.1",
"react-infinite-scroller": "^1.2.4",
"react-inlinesvg": "^0.8.4",
"react-intl": "^3.1.7",
"react-jss": "^8.6.1",
"react-moment": "^0.7.9",
"react-router": "^5.0.1",

12
src/components/Locale/Locale.tsx
View file

@ -1,11 +1,19 @@
import React from "react";
import { IntlProvider } from "react-intl";
export const LocaleContext = React.createContext<string>("en");
export type LocaleContextType = string;
export const LocaleContext = React.createContext<LocaleContextType>("en");
const { Consumer: LocaleConsumer, Provider } = LocaleContext;
const LocaleProvider = ({ children }) => {
return <Provider value={navigator.language}>{children}</Provider>;
const [locale] = React.useState(navigator.language);
return (
<IntlProvider locale={locale}>
<Provider value={navigator.language}>{children}</Provider>
</IntlProvider>
);
};
export { LocaleConsumer, LocaleProvider };

33
src/storybook/Decorator.tsx
View file

@ -1,25 +1,28 @@
import React from "react";
import { LocaleProvider } from "@saleor/components/Locale";
import { Provider as DateProvider } from "../components/Date/DateContext";
import { MessageManager } from "../components/messages";
import ThemeProvider from "../components/Theme";
import { TimezoneProvider } from "../components/Timezone";
export const Decorator = storyFn => (
<DateProvider value={+new Date("2018-08-07T14:30:44+00:00")}>
<TimezoneProvider value="America/New_York">
<ThemeProvider isDefaultDark={false}>
<MessageManager>
<div
style={{
padding: 24
}}
>
{storyFn()}
</div>
</MessageManager>
</ThemeProvider>
</TimezoneProvider>
</DateProvider>
<LocaleProvider>
<DateProvider value={+new Date("2018-08-07T14:30:44+00:00")}>
<TimezoneProvider value="America/New_York">
<ThemeProvider isDefaultDark={false}>
<MessageManager>
<div
style={{
padding: 24
}}
>
{storyFn()}
</div>
</MessageManager>
</ThemeProvider>
</TimezoneProvider>
</DateProvider>
</LocaleProvider>
);
export default Decorator;