chore: updated docs with badges, usage, and Acknowledgments

Author: itofarina

README.md

@@ -1,15 +1,20 @@
-# @rsksmart/rif-ui
+<p align="center">
+  <a href="https://rifos.org/" rel="noopener" target="_blank"><img width="150" src="https://www.rifos.org/assets/img/logo.svg" alt="RIF logo"></a></p>
+</p>
+
+<h1 align="center">RIF-UI</h1>
 
 > This is a [React](https://reactjs.org/) library written in [Typescript](https://www.typescriptlang.org/) and based on [Material-UI](https://material-ui.com/). It exposes common components, services and assets to be re used in RIF projects.
 
-<p>
-  <a href="https://github.com/rsksmart/rsk-contract-verifier/blob/master/LICENSE">
-    <img alt="GitHub license" src="https://img.shields.io/badge/license-MIT-blue.svg" />
-  </a>
-  <a href="https://www.npmjs.com/package/@rsksmart/rif-ui">
-    <img alt="npmjs reference" src="https://img.shields.io/npm/v/@rsksmart/rif-ui.svg" />
-  </a>
-</p>
+[![license MIT](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/rsksmart/rsk-contract-verifier/blob/master/LICENSE)
+[![npm package](https://img.shields.io/npm/v/@rsksmart/rif-ui/latest.svg)](https://www.npmjs.com/package/@rsksmart/rif-ui)
+[![CircleCI](https://img.shields.io/circleci/project/github/rsksmart/rif-ui/master.svg)](https://circleci.com/gh/rsksmart/rif-ui/tree/master)
+[![](https://img.shields.io/badge/made%20by-IOVLabs-blue.svg?style=flat-rounded)](http://iovlabs.org)
+[![Managed by tAsEgir](https://img.shields.io/badge/%20managed%20by-tasegir-brightgreen?style=flat-rounded)](https://github.com/auhau/tasegir)
+![](https://img.shields.io/badge/npm-%3E%3D6.0.0-orange.svg?style=flat-rounded)
+![](https://img.shields.io/badge/Node.js-%3E%3D10.0.0-orange.svg?style=flat-rounded)
+[![Follow on Twitter](https://img.shields.io/twitter/follow/rif_os.svg?label=follow+RIF)](https://twitter.com/rif_os)
+[![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=rsksmart/rif-ui)](https://dependabot.com)
 
 **Warning: This project is in alpha state. There might (and most probably will) be changes in the future to its working. Also, no guarantees can be made about its stability, efficiency, and security at this stage.**
 
@@ -56,7 +61,7 @@ import { BrowserRouter } from 'react-router-dom'
 const App = () => (
   <ThemeProvider theme={theme}>
     <BrowserRouter>
-      <Header/>
+      <Header />
       <PageTemplate>
         <Typography color='primary'>Hello world :)</Typography>
       </PageTemplate>
@@ -65,6 +70,23 @@ const App = () => (
 )
 ```
 
+### Web3Provider
+On the Web3Provider you can set the property `requiredNetworkId` and the actions `onConnectedAccountChange`, `onConnectedNetworkChange` that will get triggered once the user wallet is connected and there is a change on the account or network.
+As an example
+
+```
+<Web3Provider.Provider 
+  requiredNetworkId={requiredNetworkId}
+  actions={{
+    onConnectedAccountChange: onConnectedAccountChange,
+    onConnectedNetworkChange: onConnectedNetworkChange
+  }}>
+
+  {/* Your stuff here */}
+  
+</Web3Provider.Provider >
+```
+
 ## Example folder
 
 If you want to try this library without creating a new project you can clone this repo and follow the next steps:
@@ -83,6 +105,21 @@ cd example/ && npm start
 
 3. (Optional) Import the components, assets or services that you want in the `example/src/App.js` file following the [Usage](#usage) section to see them in action.
 
+## Testing
+
+To run unit test and build the library, you can use
+```
+npm run test
+```
+
+If you only want to run the unit test, you can use
+```
+npm run test:unit
+```
+
 ## License
 
 MIT © [rsksmart](https://github.com/rsksmart)
+
+## Acknowledgments
+ - Thanks to [EVM Networks](https://github.com/ethereum-lists/chains) for providing the data source of network objects as a JSON, which inspired us to create the `NetworkInfo` interface