Skip to content

💵 💴Shows the price of your services in the customer's currency 💶 💷

Notifications You must be signed in to change notification settings

unichat-io/react-local-currency

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

33 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Local Currency

Travis npm package Coveralls

Logo

Installation

First, install the component:

yarn add react-local-currency

or

npm i react-local-currency --save

Usage

  import * as React from 'react'
  import LocalCurrency from 'react-local-currency'

  const ReactLocalCurrency = () => (
   <LocalCurrency
      amount={7}
      base='USD'
      IPDATA_API_KEY={process.env.REACT_APP_IPDATA_API_KEY} // Get the api key from http://ipdata.co
      OXR_API_ID={process.env.REACT_APP_OXR_API_ID} // Get the api id from https://openexchangerates.org
      render={({ data, loading, error }) => {
        if (error) return `Error! ${error.message}`

        if (loading) return 'Loading ...'

        if (!data) return null

        return (
          <div>
            <h3>
              My service price: <strong>7 USD.</strong>
            </h3>
            <h3>
              My currency based on my IP: <strong>{`${data.currency}`}</strong>
            </h3>
            <h3>
              My local price is: <strong>{`${data.amount} ${data.currency}`}</strong>
            </h3>
          </div>
        )
      }}
    />
  )

  export default ReactLocalCurrency

To see a full example, look at the demo and the source 👩🏻‍💻 👨🏻‍💻

Credits

Thanks to Nadia Ilustraciones for donating the logo!

Authors

Sponsored by

License

MIT license. Copyright © 2018.