react-escalade-priceline

Dynamically fetch or prefetch Escalade stock & pricing.

Installation

With npm:

npm install --save react-escalade-priceline

With Yarn:

yarn add react-escalade-priceline

Usage

Fetching price and/or stock

import { Price, Stock, PriceAndStock } from 'react-escalade-priceline'

...

<Price site='goalrilla' id='b6101w'>
    {({ price, loading }) => {
        return (
            <div>
                {loading && 'Loading...'}
                {!loading && price && `${price.toFixed(2)}`}
            </div>
        )
    }}
</Price>

...

<Stock site='goalrilla' id='b6101w'>
    {({ stock, loading }) => {
        return (
            <div>
                {loading && 'Loading...'}
                {!loading && stock && 'In stock'}
                {!loading && !stock && 'Out of stock'}
            </div>
        )
    }}
</Stock>

...

<PriceAndStock site='goalrilla' id='b6101w'>
    {({ stock, price, loading }) => {
        if(loading) return <div>Loading...</div>
        return (
            <div>
                <div>Price: {price}</div>
                <div>Stock: {stock}</div>
            </div>
        )
    }}
</PriceAndStock>

Prefetching price and/or stock

import { PrefetchPrice, PrefetchStock, PrefetchPriceAndStock } from 'react-escalade-priceline'

...

<PrefetchPrice site='goalrilla' id={['b6101w', 'b3101w' ]} />

...

<PrefetchStock site='goalrilla' id={['b6101w', 'b3101w' ]} />

...

<PrefetchPriceAndStock site='goalrilla' id={['b6101w', 'b3101w' ]} />

Switch to testing environment

import { PriceAndStock } from 'react-escalade-priceline'

<PriceAndStock site='goalrilla' id='b6101w' env="testing">
    {({ stock, price, loading }) => {
        if(loading) return <div>Loading...</div>
        return (
            <div>
                <div>Price: {price}</div>
                <div>Stock: {stock}</div>
            </div>
        )
    }}
</PriceAndStock>