[I18n] Update locale data for IntlRelativeFormat and IntlMessageFormat

packages/kbn-i18n/README.md

@@ -259,11 +259,35 @@ import { Header } from './components/header';
 module.directive('headerGlobalNav', (reactDirective) => {
   return reactDirective(injectI18nProvider(Header));
 });
-
 ```
 
 **NOTE:** To minimize the chance of having multiple `I18nProvider` components in the React tree, try to use `injectI18nProvider` or `I18nProvider` only to wrap the topmost component that you render, e.g. the one that's passed to `reactDirective` or `ReactDOM.render`.
 
+### FormattedRelative
+
+`FormattedRelative` expects several attributes (read more [here](https://github.com/yahoo/react-intl/wiki/Components#formattedrelative)), including
+
+- `value` that can be parsed as a date,
+- `formats` that should be one of `'years' | 'months' | 'days' | 'hours' | 'minutes' | 'seconds'` (this options are configured in [`formats.ts`](./src/core/formats.ts))
+-  etc.
+
+If `formats` is not provided then it will be chosen automatically:\
+`x seconds ago` for `x < 60`, `1 minute ago` for `60 <= x < 120`, etc.
+
+```jsx
+<FormattedRelative
+  value={Date.now() - 90000}
+  format="seconds"
+/>
+```
+Initial result: `90 seconds ago`
+```jsx
+<FormattedRelative
+  value={Date.now() - 90000}
+/>
+```
+Initial result: `1 minute ago`
+
 ### Attributes translation in React
 
 React wrapper provides an ability to inject the imperative formatting API into a React component via its props using `injectI18n` Higher-Order Component. This should be used when your React component needs to format data to a string value where a React element is not suitable; e.g., a `title` or `aria` attribute. In order to use it you should wrap your component with `injectI18n` Higher-Order Component. The formatting API will be provided to the wrapped component via `props.intl`.

packages/kbn-i18n/src/core/formats.ts

@@ -83,6 +83,26 @@ export const formats: Formats = {
       timeZoneName: 'short',
     },
   },
+  relative: {
+    years: {
+      units: 'year',
+    },
+    months: {
+      units: 'month',
+    },
+    days: {
+      units: 'day',
+    },
+    hours: {
+      units: 'hour',
+    },
+    minutes: {
+      units: 'minute',
+    },
+    seconds: {
+      units: 'second',
+    },
+  },
 };
 
 interface NumberFormatOptions<TStyle extends string> extends Intl.NumberFormatOptions {
@@ -111,6 +131,12 @@ export interface Formats {
     long: DateTimeFormatOptions;
     full: DateTimeFormatOptions;
   }>;
+  relative?: Partial<{
+    [key: string]: {
+      style?: 'numeric' | 'best fit';
+      units: 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second';
+    };
+  }>;
 }
 
 interface DateTimeFormatOptions extends Intl.DateTimeFormatOptions {

packages/kbn-i18n/src/react/__snapshots__/inject_i18n_provider.test.tsx.snap

@@ -2,7 +2,16 @@
 
 exports[`injectI18nProvider provides with context 1`] = `
 Object {
-  "defaultFormats": Object {
+  "defaultFormats": Object {},
+  "defaultLocale": "en",
+  "formatDate": [Function],
+  "formatHTMLMessage": [Function],
+  "formatMessage": [Function],
+  "formatNumber": [Function],
+  "formatPlural": [Function],
+  "formatRelative": [Function],
+  "formatTime": [Function],
+  "formats": Object {
     "date": Object {
       "full": Object {
         "day": "numeric",
@@ -34,6 +43,26 @@ Object {
         "style": "percent",
       },
     },
+    "relative": Object {
+      "days": Object {
+        "units": "day",
+      },
+      "hours": Object {
+        "units": "hour",
+      },
+      "minutes": Object {
+        "units": "minute",
+      },
+      "months": Object {
+        "units": "month",
+      },
+      "seconds": Object {
+        "units": "second",
+      },
+      "years": Object {
+        "units": "year",
+      },
+    },
     "time": Object {
       "full": Object {
         "hour": "numeric",
@@ -58,15 +87,6 @@ Object {
       },
     },
   },
-  "defaultLocale": "en",
-  "formatDate": [Function],
-  "formatHTMLMessage": [Function],
-  "formatMessage": [Function],
-  "formatNumber": [Function],
-  "formatPlural": [Function],
-  "formatRelative": [Function],
-  "formatTime": [Function],
-  "formats": Object {},
   "formatters": Object {
     "getDateTimeFormat": [Function],
     "getMessageFormat": [Function],

packages/kbn-i18n/src/react/__snapshots__/provider.test.tsx.snap

@@ -2,7 +2,16 @@
 
 exports[`I18nProvider provides with context 1`] = `
 Object {
-  "defaultFormats": Object {
+  "defaultFormats": Object {},
+  "defaultLocale": "en",
+  "formatDate": [Function],
+  "formatHTMLMessage": [Function],
+  "formatMessage": [Function],
+  "formatNumber": [Function],
+  "formatPlural": [Function],
+  "formatRelative": [Function],
+  "formatTime": [Function],
+  "formats": Object {
     "date": Object {
       "full": Object {
         "day": "numeric",
@@ -34,6 +43,26 @@ Object {
         "style": "percent",
       },
     },
+    "relative": Object {
+      "days": Object {
+        "units": "day",
+      },
+      "hours": Object {
+        "units": "hour",
+      },
+      "minutes": Object {
+        "units": "minute",
+      },
+      "months": Object {
+        "units": "month",
+      },
+      "seconds": Object {
+        "units": "second",
+      },
+      "years": Object {
+        "units": "year",
+      },
+    },
     "time": Object {
       "full": Object {
         "hour": "numeric",
@@ -58,15 +87,6 @@ Object {
       },
     },
   },
-  "defaultLocale": "en",
-  "formatDate": [Function],
-  "formatHTMLMessage": [Function],
-  "formatMessage": [Function],
-  "formatNumber": [Function],
-  "formatPlural": [Function],
-  "formatRelative": [Function],
-  "formatTime": [Function],
-  "formats": Object {},
   "formatters": Object {
     "getDateTimeFormat": [Function],
     "getMessageFormat": [Function],

packages/kbn-i18n/src/react/provider.tsx

@@ -78,8 +78,7 @@ export class I18nProvider extends React.PureComponent {
         locale={i18n.getLocale()}
         messages={i18n.getTranslation().messages}
         defaultLocale={i18n.getDefaultLocale()}
-        formats={i18n.getTranslation().formats}
-        defaultFormats={i18n.getFormats()}
+        formats={i18n.getFormats()}
         textComponent={React.Fragment}
       >
         {isPseudoLocale(i18n.getLocale())

src/dev/i18n/serializers/__snapshots__/json.test.js.snap

@@ -56,6 +56,26 @@ exports[`dev/i18n/serializers/json should serialize default messages to JSON 1`]
         \\"second\\": \\"numeric\\",
         \\"timeZoneName\\": \\"short\\"
       }
+    },
+    \\"relative\\": {
+      \\"years\\": {
+        \\"units\\": \\"year\\"
+      },
+      \\"months\\": {
+        \\"units\\": \\"month\\"
+      },
+      \\"days\\": {
+        \\"units\\": \\"day\\"
+      },
+      \\"hours\\": {
+        \\"units\\": \\"hour\\"
+      },
+      \\"minutes\\": {
+        \\"units\\": \\"minute\\"
+      },
+      \\"seconds\\": {
+        \\"units\\": \\"second\\"
+      }
     }
   },
   \\"messages\\": {

src/dev/i18n/serializers/__snapshots__/json5.test.js.snap

@@ -57,6 +57,26 @@ exports[`dev/i18n/serializers/json5 should serialize default messages to JSON5 1
         timeZoneName: 'short',
       },
     },
+    relative: {
+      years: {
+        units: 'year',
+      },
+      months: {
+        units: 'month',
+      },
+      days: {
+        units: 'day',
+      },
+      hours: {
+        units: 'hour',
+      },
+      minutes: {
+        units: 'minute',
+      },
+      seconds: {
+        units: 'second',
+      },
+    },
   },
   messages: {
     'plugin1.message.id-1': 'Message text 1',

src/legacy/core_plugins/kibana/public/home/components/tutorial/__snapshots__/saved_objects_installer.test.js.snap

@@ -5,7 +5,16 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
   bulkCreate={[Function]}
   intl={
     Object {
-      "defaultFormats": Object {
+      "defaultFormats": Object {},
+      "defaultLocale": "en",
+      "formatDate": [Function],
+      "formatHTMLMessage": [Function],
+      "formatMessage": [Function],
+      "formatNumber": [Function],
+      "formatPlural": [Function],
+      "formatRelative": [Function],
+      "formatTime": [Function],
+      "formats": Object {
         "date": Object {
           "full": Object {
             "day": "numeric",
@@ -37,6 +46,26 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
             "style": "percent",
           },
         },
+        "relative": Object {
+          "days": Object {
+            "units": "day",
+          },
+          "hours": Object {
+            "units": "hour",
+          },
+          "minutes": Object {
+            "units": "minute",
+          },
+          "months": Object {
+            "units": "month",
+          },
+          "seconds": Object {
+            "units": "second",
+          },
+          "years": Object {
+            "units": "year",
+          },
+        },
         "time": Object {
           "full": Object {
             "hour": "numeric",
@@ -61,15 +90,6 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
           },
         },
       },
-      "defaultLocale": "en",
-      "formatDate": [Function],
-      "formatHTMLMessage": [Function],
-      "formatMessage": [Function],
-      "formatNumber": [Function],
-      "formatPlural": [Function],
-      "formatRelative": [Function],
-      "formatTime": [Function],
-      "formats": Object {},
       "formatters": Object {
         "getDateTimeFormat": [Function],
         "getMessageFormat": [Function],
@@ -314,7 +334,16 @@ exports[`bulkCreate should display success message when bulkCreate is successful
   bulkCreate={[Function]}
   intl={
     Object {
-      "defaultFormats": Object {
+      "defaultFormats": Object {},
+      "defaultLocale": "en",
+      "formatDate": [Function],
+      "formatHTMLMessage": [Function],
+      "formatMessage": [Function],
+      "formatNumber": [Function],
+      "formatPlural": [Function],
+      "formatRelative": [Function],
+      "formatTime": [Function],
+      "formats": Object {
         "date": Object {
           "full": Object {
             "day": "numeric",
@@ -346,6 +375,26 @@ exports[`bulkCreate should display success message when bulkCreate is successful
             "style": "percent",
           },
         },
+        "relative": Object {
+          "days": Object {
+            "units": "day",
+          },
+          "hours": Object {
+            "units": "hour",
+          },
+          "minutes": Object {
+            "units": "minute",
+          },
+          "months": Object {
+            "units": "month",
+          },
+          "seconds": Object {
+            "units": "second",
+          },
+          "years": Object {
+            "units": "year",
+          },
+        },
         "time": Object {
           "full": Object {
             "hour": "numeric",
@@ -370,15 +419,6 @@ exports[`bulkCreate should display success message when bulkCreate is successful
           },
         },
       },
-      "defaultLocale": "en",
-      "formatDate": [Function],
-      "formatHTMLMessage": [Function],
-      "formatMessage": [Function],
-      "formatNumber": [Function],
-      "formatPlural": [Function],
-      "formatRelative": [Function],
-      "formatTime": [Function],
-      "formats": Object {},
       "formatters": Object {
         "getDateTimeFormat": [Function],
         "getMessageFormat": [Function],