Updated readme and example

Author: João Moura

.vscode/settings.json

@@ -0,0 +1,10 @@
+{
+  "spellright.language": [
+    "en"
+  ],
+  "spellright.documentTypes": [
+    "markdown",
+    "latex",
+    "plaintext"
+  ]
+}

README.md

@@ -1,6 +1,6 @@
 # react-multi-lang
 
-React Multilanguage Higher Order Component.
+React Multi-language component.
 
 Works with React and React Native
 
@@ -10,15 +10,42 @@ Works with React and React Native
 
 ## Usage
 
+### Hook
+
 See the example folder for better understanding
 
-```javascript
-// @flow
+```tsx
+import React from 'react'
+
+// Translation Hook
+import { setTranslations, setDefaultLanguage, useTranslation } from 'react-multi-lang'
+import pt from 'pt.json'
+import en from 'en.json'
+
+// Do this two lines only when setting up the application
+setTranslations({pt, en})
+setDefaultLanguage('en')
+
+const App: React.FC = () => {
+  const t = useTranslation()
+  return (
+    <div>
+      {t('home.Title')}
+      {t('Hello', {name: 'João'})}
+    </div>
+  )
+}
+
+export default App
+```
+
+### Higher order component
 
-import * as React from 'react'
+```tsx
+import React from 'react'
 
 // Translation Higher Order Component
-import { setTranslations, setDefaultLanguage, translate } from 'react-multi-lang'
+import { setTranslations, setDefaultLanguage, withTranslation } from 'react-multi-lang'
 import pt from 'pt.json'
 import en from 'en.json'
 import type { T } from 'react-multi-lang'
@@ -31,11 +58,9 @@ type Props = {
   t: T
 }
 
-type State = {}
-
-class SomeComponent extends React.Component<Props, State> {
+class SomeComponent extends React.Component<Props> {
   render () {
-    const { translate } = this.props
+    const { t } = this.props
     return (
       <div>
         {t('home.Title')}
@@ -45,14 +70,10 @@ class SomeComponent extends React.Component<Props, State> {
   }
 }
 
-export default translate(SomeComponent)
+export default withTranslation(SomeComponent)
 ```
 
-## Injected Method
-
-If using the Higher Order Component `translate(SomeComponent)`
-
-### t(path, params)
+## Translation Method t(path, params)
 
 Params | Type   | Description
 ------ | ------ | ------------------------------------------------------------------------------------

example/src/App.tsx

@@ -1,21 +1,21 @@
 import React from 'react';
-import logo from './logo.svg';
+import { getLanguage, setLanguage, useTranslation } from 'react-multi-lang'
 import './App.css';
-import { useTranslation, setLanguage, getLanguage } from 'react-multi-lang'
+import logo from './logo.svg';
 
 const App: React.FC = () => {
 
   const t = useTranslation()
 
   return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <h1 className="App-title">
+    <div className='App'>
+      <header className='App-header'>
+        <img src={logo} className='App-logo' alt='logo' />
+        <h1 className='App-title'>
           {t('home.Title', {param: 'react'})}
         </h1>
       </header>
-      <p className="App-intro">
+      <p className='App-intro'>
         To change language just press the buttons beneath
       </p>
       <div>Selected lang <b>{getLanguage()}</b></div>

example/src/index.tsx

@@ -1,18 +1,16 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
+import React from 'react'
+import ReactDOM from 'react-dom'
+import App from './App'
+import './index.css'
+import * as serviceWorker from './serviceWorker'
 
-
-import { setDefaultTranslations, setDefaultLanguage } from 'react-multi-lang'
-import pt from './translations/pt.json'
+import { setDefaultLanguage, setDefaultTranslations } from 'react-multi-lang'
 import en from './translations/en.json'
+import pt from './translations/pt.json'
 
 setDefaultTranslations({pt, en})
 setDefaultLanguage('pt')
 
-
 ReactDOM.render(<App />, document.getElementById('root'));
 
 // If you want your app to work offline and load faster, you can change