From 8f7a76d23067e6bdf6e177ace30f9972ea55a88b Mon Sep 17 00:00:00 2001 From: bgrieder Date: Thu, 15 Oct 2015 15:36:21 +0200 Subject: [PATCH 1/6] Definitions for react-intl 1.2.0 --- react-intl/react-intl-tests.tsx | 137 ++++++++++++++++++++++++++++++++ react-intl/react-intl.d.ts | 97 ++++++++++++++++++++++ 2 files changed, 234 insertions(+) create mode 100644 react-intl/react-intl-tests.tsx create mode 100644 react-intl/react-intl.d.ts diff --git a/react-intl/react-intl-tests.tsx b/react-intl/react-intl-tests.tsx new file mode 100644 index 000000000..648142a25 --- /dev/null +++ b/react-intl/react-intl-tests.tsx @@ -0,0 +1,137 @@ +/** + * Created by Bruno Grieder + */ +import * as React from 'react' + +import * as reactMixin from 'react-mixin' +import {IntlMixin, IntlComponent, FormattedNumber, FormattedMessage, FormattedDate} from 'react-intl' + + +/////////////////////////////////////////////////////////////////////////// +// +// This class does not use the mixin and react-mixin is not required +// The MESSQGES are maintained in the file +// To use it call +// +//////////////////////////////////////////////////////////////////////////// + + +const MESSAGES = { + + Sorry: { + 'en-US': 'Sorry {name}', + 'fr-FR': 'Désolé {name}' + } +} + + +module I18nDirect { + + export interface Props extends IntlComponent.Props {} +} + +@reactMixin.decorate( IntlMixin ) +class I18nDirect extends React.Component { //implements IntlComponent { + + private _currentLocale: string + private _messages: {[key: string]: string} + + constructor( props: I18nDirect.Props ) { + super( props ) + } + + //Mixin + //getIntlMessage: (key: string) => string = this['getIntlMessage'] + + + render() { + + return ( + +
    +
  • FormattedNumber:  + +
    • +
  • FormattedMessage:  + +
    • +
  • FormattedDate:  + +
    • +
+ + ) + } + + componentWillReceiveProps( nextProps: I18nDirect.Props ) { + this.compileMessages(nextProps) + } + + componentWillMount() { + this.compileMessages(this.props) + } + + + private compileMessages = (props: I18nDirect.Props): void => { + + let locale = ( props.locales && props.locales[ 0 ] ) || 'en-US' + + if (this._currentLocale !== locale) { + + this._messages = Object.keys( MESSAGES ).reduce( + ( dic, key ) => { + dic[ key ] = MESSAGES[ key ][ locale ] + return dic + }, + {} as { [key: string]: string; } + ) + } + } + +} + +/////////////////////////////////////////////////////////////////////////// +// +// This class uses the mixin and react-mixin is +// The MESSAGES are passed from messages property of the props +// To use it call +// +//////////////////////////////////////////////////////////////////////////// + + +module I18nMixin { + + export interface Props extends IntlComponent.Props {} +} + +@reactMixin.decorate( IntlMixin ) +class I18nMixin extends React.Component implements IntlComponent { + + private _currentLocale: string + + constructor( props: I18nMixin.Props ) { + super( props ) + } + + //Expose the method provided by the Mixin + getIntlMessage: (key: string) => string = this['getIntlMessage'] + + + render() { + + return ( + +
    +
  • FormattedNumber: + +
    • +
  • FormattedMessage: + {/* this uses the mixin */} +
    • +
+ + ) + } +} + +export { I18nDirect, I18nMixin } diff --git a/react-intl/react-intl.d.ts b/react-intl/react-intl.d.ts new file mode 100644 index 000000000..d1ee2772b --- /dev/null +++ b/react-intl/react-intl.d.ts @@ -0,0 +1,97 @@ +// Type definitions for react-intl 1.2.0 +// Project: http://formatjs.io/react/ +// Definitions by: Bruno Grieder +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +declare module "react-intl" { + + import * as React from 'react' + + module ReactIntl { + + + interface IIntlMixin extends React.Mixin { + getIntlMessage(key: string): string + } + + var IntlMixin: IIntlMixin + + module IntlComponent { + interface Props { + locales?: string[] + messages?: {[key: string]: any} + formats?: string[] + } + } + interface IntlComponent { + getIntlMessage(key: string): string; + } + + + module FormattedDate { + export interface Props extends IntlComponent.Props { + value: Date + day?: string + month?: string + year?: string + } + } + class FormattedDate extends React.Component {} + + + module FormattedTime { + export interface Props extends IntlComponent.Props { + value: Date + day?: string + month?: string + year?: string + format?: string + } + } + class FormattedTime extends React.Component {} + + + module FormattedRelative { + export interface Props extends IntlComponent.Props { + value: number + units?: string //"second", "minute", "hour", "day", "month" or "year" + style?: string //"best fit" (default) or "numeric" + format?: string + } + } + class FormattedRelative extends React.Component {} + + + module FormattedMessage { + export interface Props extends IntlComponent.Props { + message: string; + [prop: string]: any + } + } + class FormattedMessage extends React.Component {} + + + module FormattedHTMLMessage { + export interface Props extends IntlComponent.Props { + message: string; + [prop: string]: any + } + } + class FormattedHTMLMessage extends React.Component {} + + + module FormattedNumber { + export interface Props extends IntlComponent.Props { + value: number + style?: string + currency?: string + format?: string + } + } + class FormattedNumber extends React.Component {} + + } + + export = ReactIntl + +} \ No newline at end of file From 977932ec0fe59cde82112441fc7afbf83a6908c5 Mon Sep 17 00:00:00 2001 From: bgrieder Date: Thu, 15 Oct 2015 16:00:09 +0200 Subject: [PATCH 2/6] clean-up of test file --- react-intl/react-intl-tests.tsx | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/react-intl/react-intl-tests.tsx b/react-intl/react-intl-tests.tsx index 648142a25..1a5aba9b3 100644 --- a/react-intl/react-intl-tests.tsx +++ b/react-intl/react-intl-tests.tsx @@ -30,8 +30,7 @@ module I18nDirect { export interface Props extends IntlComponent.Props {} } -@reactMixin.decorate( IntlMixin ) -class I18nDirect extends React.Component { //implements IntlComponent { +class I18nDirect extends React.Component { private _currentLocale: string private _messages: {[key: string]: string} @@ -40,9 +39,6 @@ class I18nDirect extends React.Component { //implements I super( props ) } - //Mixin - //getIntlMessage: (key: string) => string = this['getIntlMessage'] - render() { From 13e5999ccd29b947f754d5653d7397d5d043a8c0 Mon Sep 17 00:00:00 2001 From: bgrieder Date: Thu, 22 Oct 2015 10:16:33 +0200 Subject: [PATCH 3/6] react-intl: fixes for Travis build --- react-intl/react-intl-tests.tsx | 10 +++++++--- react-intl/react-intl-tests.tsx.tscparams | 1 + 2 files changed, 8 insertions(+), 3 deletions(-) create mode 100644 react-intl/react-intl-tests.tsx.tscparams diff --git a/react-intl/react-intl-tests.tsx b/react-intl/react-intl-tests.tsx index 1a5aba9b3..6a2d6a949 100644 --- a/react-intl/react-intl-tests.tsx +++ b/react-intl/react-intl-tests.tsx @@ -1,6 +1,10 @@ /** * Created by Bruno Grieder */ + +/// +/// + import * as React from 'react' import * as reactMixin from 'react-mixin' @@ -10,7 +14,7 @@ import {IntlMixin, IntlComponent, FormattedNumber, FormattedMessage, FormattedDa /////////////////////////////////////////////////////////////////////////// // // This class does not use the mixin and react-mixin is not required -// The MESSQGES are maintained in the file +// The MESSAGES are maintained in the file // To use it call // //////////////////////////////////////////////////////////////////////////// @@ -30,7 +34,7 @@ module I18nDirect { export interface Props extends IntlComponent.Props {} } -class I18nDirect extends React.Component { +class I18nDirect extends React.Component { private _currentLocale: string private _messages: {[key: string]: string} @@ -69,7 +73,7 @@ class I18nDirect extends React.Component { private compileMessages = (props: I18nDirect.Props): void => { - + let locale = ( props.locales && props.locales[ 0 ] ) || 'en-US' if (this._currentLocale !== locale) { diff --git a/react-intl/react-intl-tests.tsx.tscparams b/react-intl/react-intl-tests.tsx.tscparams new file mode 100644 index 000000000..c90abf04f --- /dev/null +++ b/react-intl/react-intl-tests.tsx.tscparams @@ -0,0 +1 @@ +--target es5 --noImplicitAny --experimentalDecorators --jsx react From ab240c8733b981288ebba86fc7a4eb27593a56e3 Mon Sep 17 00:00:00 2001 From: bgrieder Date: Thu, 22 Oct 2015 10:25:49 +0200 Subject: [PATCH 4/6] react-intl: more minor fixes for Travis build --- react-intl/react-intl-tests.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/react-intl/react-intl-tests.tsx b/react-intl/react-intl-tests.tsx index 6a2d6a949..74575a0cb 100644 --- a/react-intl/react-intl-tests.tsx +++ b/react-intl/react-intl-tests.tsx @@ -4,6 +4,7 @@ /// /// +/// import * as React from 'react' @@ -79,7 +80,7 @@ class I18nDirect extends React.Component { if (this._currentLocale !== locale) { this._messages = Object.keys( MESSAGES ).reduce( - ( dic, key ) => { + ( dic: { [key: string]: string; }, key: string ) => { dic[ key ] = MESSAGES[ key ][ locale ] return dic }, From 00043d869a22c12766e17fe1cda38a21c2b1870a Mon Sep 17 00:00:00 2001 From: bgrieder Date: Thu, 22 Oct 2015 10:30:32 +0200 Subject: [PATCH 5/6] fix to avoid implicit Any --- react-intl/react-intl-tests.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/react-intl/react-intl-tests.tsx b/react-intl/react-intl-tests.tsx index 74575a0cb..2258343fd 100644 --- a/react-intl/react-intl-tests.tsx +++ b/react-intl/react-intl-tests.tsx @@ -21,7 +21,7 @@ import {IntlMixin, IntlComponent, FormattedNumber, FormattedMessage, FormattedDa //////////////////////////////////////////////////////////////////////////// -const MESSAGES = { +const MESSAGES: {[key: string] : { [lang: string]: string }} = { Sorry: { 'en-US': 'Sorry {name}', @@ -75,12 +75,12 @@ class I18nDirect extends React.Component { private compileMessages = (props: I18nDirect.Props): void => { - let locale = ( props.locales && props.locales[ 0 ] ) || 'en-US' + let locale: string = ( props.locales && props.locales[ 0 ] ) || 'en-US' if (this._currentLocale !== locale) { this._messages = Object.keys( MESSAGES ).reduce( - ( dic: { [key: string]: string; }, key: string ) => { + ( dic , key ) => { dic[ key ] = MESSAGES[ key ][ locale ] return dic }, From fd99972d236e2bd10598bb93fb088cc14e7689d2 Mon Sep 17 00:00:00 2001 From: bgrieder Date: Thu, 22 Oct 2015 10:33:57 +0200 Subject: [PATCH 6/6] fix invalid reference to react --- react-intl/react-intl.d.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/react-intl/react-intl.d.ts b/react-intl/react-intl.d.ts index d1ee2772b..3d7a9b737 100644 --- a/react-intl/react-intl.d.ts +++ b/react-intl/react-intl.d.ts @@ -3,6 +3,8 @@ // Definitions by: Bruno Grieder // Definitions: https://github.com/borisyankov/DefinitelyTyped +/// + declare module "react-intl" { import * as React from 'react' @@ -94,4 +96,4 @@ declare module "react-intl" { export = ReactIntl -} \ No newline at end of file +}