Feature intl.formatMessage() support (#68)

* feat: add support for intl.formatMessage

* docs(readme): update

*  Add @jmarceli as a contributor

.all-contributorsrc

@@ -136,6 +136,16 @@
       "contributions": [
         "code"
       ]
+    },
+    {
+      "login": "jmarceli",
+      "name": "jmarceli",
+      "avatar_url": "https://avatars1.githubusercontent.com/u/4281333?v=4",
+      "profile": "https://github.com/jmarceli",
+      "contributions": [
+        "code",
+        "test"
+      ]
     }
   ],
   "repoType": "github",

readme.md

@@ -5,7 +5,7 @@
 [![Coverage Status](https://coveralls.io/repos/github/akameco/babel-plugin-react-intl-auto/badge.svg?branch=master)](https://coveralls.io/github/akameco/babel-plugin-react-intl-auto?branch=master)
 [![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
 [![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)
-[![All Contributors](https://img.shields.io/badge/all_contributors-13-orange.svg?style=flat-square)](#contributors-)
+[![All Contributors](https://img.shields.io/badge/all_contributors-14-orange.svg?style=flat-square)](#contributors-)
 [![babel-plugin-react-intl-auto Dev Token](https://badge.devtoken.rocks/babel-plugin-react-intl-auto)](https://devtoken.rocks/package/babel-plugin-react-intl-auto)
 
 > i18n for the component age. Auto management react-intl ID.
@@ -120,6 +120,46 @@ $ yarn add --dev @babel/plugin-transform-typescript
 }
 ```
 
+## Example
+
+### with injectIntl
+
+Input:
+
+```js
+import { injectIntl } from 'react-intl'
+
+const MyComponent = (({ intl }) => {
+  const label = intl.formatMessage({ defaultMessage: 'Submit button' })
+  return (
+    <button aria-label={label}>
+      {label}
+    </button>
+  )
+))
+
+injectIntl(MyComponent)
+```
+
+↓ 　 ↓ 　 ↓
+
+Output:
+
+```js
+import { injectIntl } from 'react-intl'
+
+const MyComponent = ({ intl }) => {
+  const label = intl.formatMessage({ id="App.Components.Button.label", defaultMessage: 'Submit button' })
+  return (
+    <button aria-label={label}>
+      {label}
+    </button>
+  )
+}
+
+injectIntl(MyComponent)
+```
+
 ### Options
 
 #### removePrefix
@@ -381,6 +421,7 @@ Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds
     <td align="center"><a href="https://github.com/kuma-kuma"><img src="https://avatars0.githubusercontent.com/u/12218082?v=4" width="100px;" alt="Kouta Kumagai"/><br /><sub><b>Kouta Kumagai</b></sub></a><br /><a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=kuma-kuma" title="Documentation">📖</a> <a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=kuma-kuma" title="Code">💻</a> <a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=kuma-kuma" title="Tests">⚠️</a></td>
     <td align="center"><a href="http://shah.yar.gs"><img src="https://avatars0.githubusercontent.com/u/255846?v=4" width="100px;" alt="Shahyar G"/><br /><sub><b>Shahyar G</b></sub></a><br /><a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=shahyar" title="Code">💻</a></td>
     <td align="center"><a href="https://gitlab.com/remcohaszing"><img src="https://avatars2.githubusercontent.com/u/779047?v=4" width="100px;" alt="Remco Haszing"/><br /><sub><b>Remco Haszing</b></sub></a><br /><a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=remcohaszing" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/jmarceli"><img src="https://avatars1.githubusercontent.com/u/4281333?v=4" width="100px;" alt="jmarceli"/><br /><sub><b>jmarceli</b></sub></a><br /><a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=jmarceli" title="Code">💻</a> <a href="https://github.com/akameco/babel-plugin-react-intl-auto/commits?author=jmarceli" title="Tests">⚠️</a></td>
   </tr>
 </table>
 

src/__tests__/__snapshots__/injection.test.js.snap

@@ -0,0 +1,247 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`default multiple uses: multiple uses 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+intl.formatMessage({ defaultMessage: "hello" });
+intl.formatMessage({ defaultMessage: "some other message" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "src.__fixtures__.613153351"
+});
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "src.__fixtures__.613153351"
+});
+intl.formatMessage({
+  defaultMessage: "some other message",
+  "id": "src.__fixtures__.831373691"
+});
+
+`;
+
+exports[`default some supported use cases: some supported use cases 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+const Component2 = ({ intl }) => {
+  const label = intl.formatMessage({ defaultMessage: "hello" });
+  return (
+    <button aria-label={intl.formatMessage({ defaultMessage: "hello" })}>
+      {intl.formatMessage({ defaultMessage: "hello" })}
+    </button>
+  );
+};
+injectIntl(Components2);
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+
+const Component2 = ({
+  intl
+}) => {
+  const label = intl.formatMessage({
+    defaultMessage: "hello",
+    "id": "src.__fixtures__.613153351"
+  });
+  return <button aria-label={intl.formatMessage({
+    defaultMessage: "hello",
+    "id": "src.__fixtures__.613153351"
+  })}>
+      {intl.formatMessage({
+      defaultMessage: "hello",
+      "id": "src.__fixtures__.613153351"
+    })}
+    </button>;
+};
+
+injectIntl(Components2);
+
+`;
+
+exports[`default with FormattedMessage imported as something else: with FormattedMessage imported as something else 1`] = `
+
+import { injectIntl as i18n } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "i18n" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl as i18n } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "i18n",
+  "id": "src.__fixtures__.94348014"
+});
+
+`;
+
+exports[`default with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "src.__fixtures__.613153351"
+});
+
+`;
+
+exports[`default with a value interpolated in the message: with a value interpolated in the message 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: \`template string 2\` });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: \`template string 2\`,
+  "id": "src.__fixtures__.1045198380"
+});
+
+`;
+
+exports[`default with a variable as the defaultMessage: with a variable as the defaultMessage 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+const message = "variable message";
+
+intl.formatMessage({ defaultMessage: message });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+const message = "variable message";
+intl.formatMessage({
+  defaultMessage: message,
+  "id": "src.__fixtures__.3082794952"
+});
+
+`;
+
+exports[`default with custom properties in formatMessage call: with custom properties in formatMessage call 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "custom prop", other: 123 });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "custom prop",
+  "id": "src.__fixtures__.2983810267",
+  other: 123
+});
+
+`;
+
+exports[`filebase = true with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "src.__fixtures__.messages.613153351"
+});
+
+`;
+
+exports[`removePrefix = "src" with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "__fixtures__.613153351"
+});
+
+`;
+
+exports[`removePrefix = "src.__fixtures__" with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "613153351"
+});
+
+`;
+
+exports[`removePrefix = "src/" -- with slash with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "__fixtures__.613153351"
+});
+
+`;
+
+exports[`removePrefix = /__fixtures__/ with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "src.613153351"
+});
+
+`;
+
+exports[`removePrefix = false with Injection API HOC imported: with Injection API HOC imported 1`] = `
+
+import { injectIntl } from 'react-intl';
+
+intl.formatMessage({ defaultMessage: "hello" });
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+import { injectIntl } from 'react-intl';
+intl.formatMessage({
+  defaultMessage: "hello",
+  "id": "src.__fixtures__.613153351"
+});
+
+`;