SteemDesk—Crypto Price History

The Missing Tool Chain For Steemit Users

SteemDesk is an existing project which provides missing tools for Steemit users.

About The Project

SteemDesk tries to make a Steemit user's life easier by providing the tools missing on Steemit.com.

Existing Features

Dashboard

• exact user reputation
• follower count
• following count

Delegations

• View current delegations of an account with APR calculations
• Make new delegations from one account to another account

Activities

• Display and filter for different transactions on your blockchain
• Load account history incrementally

Features Added In This Update

Price History Feed

On the current delegations page, one can see an overview of the delegations a user has made. The delegations view looks like this:

The annual percentage return (APR) is given in the penultimate column.

The calculation for the APR was not correct because it has been assumed that Steem and SBD have more or less the same value. The assumption was made because the app did not retrieve the current prices for Steem and SBD. Therefore a price feed for cryptos has been added in this update.

The prices for the cryptocurrencies are provided by CryptoCompare. The attribution is given in the About page of the application and the README.

Crypto price support has been added to the Redux store. The relevant code can be found in src/state/crypto/.

The part of the state tree looks like this:

priceHistory: {
  STEEM: {
    inBTC: [1.00],
    inUSD: [1.00]
  },
  SBD: {
    inBTC: [1.00],
    inUSD: [1.00]
  }
},
// EMPTY, LOADED, LOADING
priceHistoryStatus: 'EMPTY'

The operation to request a price history for a cryptocurrency looks like this:

const priceHistoryRequested = (symbol = 'STEEM') => async (dispatch, getState) => { … }

This operation is used in src/App.js to retrieve the prices for Steem and SBD on application startup. When the Redux store holds the prices they will be used on the delegations page and the Dashboard page.

To make the prices easily accesible two selectors have been added:

const steemPrice = cryptoSelectors.selectSteemPrice(state)
const sbdPrice = cryptoSelectors.selectSBDPrice(state)

Improved Calculation Of APR For Current Delegations

With the added support for crypto prices, the calculation of the APR for a delegation has been improved.

The amount of SBD received as a reward for a delegation is now converted to Steem. This amount will be added to the Steem we received for the same delegation on the same day. This sum is the total amount received which then can be used to calculate the APR.

The code can be found in /src/pages/delegation/CurrentDelegations.js.

Minor Changes

• About page with attribution to CryptoCompare.
• Replaced Home page with Dashboard page.
• Prices on Dashboard and improved styling with Level components.

Technology Stack

• Babel—Next generation JavaScript
• React—A JavaScript library for building user interfaces
• Atlaskit—Atlassian's official UI library
• Parcel—Blazing fast, zero configuration web application bundler
• Redux—Predictable state container for JavaScript apps

Roadmap

• Improve display of activity items by replacing the table with dedicated components
• Show APR for transfers to Steem
• Show lifetime author rewards
• Show lifetime curation rewards
• Show upvotes in a list (filterable for a time frame, etc.)
• Show followers in a list (filterable for a time frame, reputation, etc.)
• Improve display of delegation items
• Improve error messages when the network is down

Getting Started

Building the app locally on your computer should be straightforward. Clone the app. Then install the dependencies with yarn. When the installation has finished, you can run the app with yarn start. These are the steps in more detail:

git clone https://github.com/cutemachine/SteemDesk.git
cd SteemDesk
yarn
yarn start

Demo

Check out the live version of SteemDesk.

How To Contribute

Do you want to contribute to this project? Great. You can contact me through my Github profile page or send a pull request.

---

Posted on Utopian.io - Rewarding Open Source Contributors

---