Add storybook-addon-intl

.storybook/main.js

@@ -5,7 +5,7 @@ const railsWebpackEnv = require("../config/webpack/environment");
 
 module.exports = {
   stories: ["../app/javascript/stories/*.[tj]s?(x)"],
-  addons: ['@storybook/addon-actions', '@storybook/addon-links'],
+  addons: ['@storybook/addon-actions', '@storybook/addon-links', 'storybook-addon-intl'],
   webpackFinal: (config) => ({
     // do mutation to the config
     ...config,

.storybook/preview.js

@@ -0,0 +1,13 @@
+import { addDecorator } from '@storybook/react';
+import { withIntl, setIntlConfig } from '../app/javascript/components/tests/intl';
+
+const messages = {
+  'en': { 'button.label': 'Click me!' },
+}
+setIntlConfig({
+  locales: ['en', 'de'],
+  defaultLocale: 'en',
+  getMessages: (locale) => messages[locale]
+});
+
+addDecorator(withIntl)

package.json

@@ -76,6 +76,7 @@
     "resolve-url-loader": "^2.3.0",
     "sass-loader": "^7.0.1",
     "sinon": "^5.0.7",
+    "storybook-addon-intl": "^2.4.1",
     "style-loader": "^0.21.0",
     "ts-jest": "^24.0.0",
     "typescript": "^3.9.5",

types/storybook-addon-intl/index.d.ts

@@ -0,0 +1,5 @@
+
+export declare function setIntlConfig(...unknown)
+export declare function withIntl(...unknown)
+export declare function register(...unknown)
+

types/storybook-addon-intl/shared.d.ts

@@ -0,0 +1,5 @@
+declare module 'storybook-addon-intl/shared' {
+  export declare const EVENT_SET_CONFIG_ID:string;
+  export declare const EVENT_GET_LOCALE_ID:string;
+  export declare const EVENT_SET_LOCALE_ID:string;
+}

yarn.lock

@@ -12905,7 +12905,7 @@ prop-types-exact@^1.2.0:
     object.assign "^4.1.0"
     reflect.ownkeys "^0.2.0"
 
-prop-types@^15.5.10, prop-types@^15.5.6, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15.5.0, prop-types@^15.5.10, prop-types@^15.5.6, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -14766,6 +14766,13 @@ store2@^2.7.1:
   resolved "https://registry.yarnpkg.com/store2/-/store2-2.11.2.tgz#a298e5e97b21b3ce7419b732540bc7c79cb007db"
   integrity sha512-TQMKs+C6n9idtzLpxluikmDCYiDJrTbbIGn9LFxMg0BVTu+8JZKSlXTWYRpOFKlfKD5HlDWLVpJJyNGZ2e9l1A==
 
+storybook-addon-intl@^2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/storybook-addon-intl/-/storybook-addon-intl-2.4.1.tgz#870d990defde87615e490aa4ca18abec3ac19f2c"
+  integrity sha512-07CofbUQcx8axTWd2/x0CNyaNJzRFW+/idHg2W3fnimy9w56A088kJwQzefjVFVSJELFDL2kjG19pP3MJ2A0ng==
+  dependencies:
+    prop-types "^15.5.0"
+
 stream-browserify@^2.0.1:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/stream-browserify/-/stream-browserify-2.0.2.tgz#87521d38a44aa7ee91ce1cd2a47df0cb49dd660b"