[Integrate] As a user, I can see Trending coins on the Home screen

[nkhanh44]

Why

• The user should be able to see trending coins on the Home screen.

Acceptance Criteria

In light mode:

In dark mode:

• The section will have the title Trending 🔥.

• The section will have the text see all ->.

• Once the coins have loaded, the user will see coin’s items:

• The coin’s image will be based on the image.
• The coin’s symbol will be based on the uppercased symbol.
• The coin’s name will be based on the name.
• The coin’s price change percentage will be based on the price_change_percentage_24h:
  • price_change_percentage_24h is set to #F15950 with the down indicator when it’s a negative number.
  • price_change_percentage_24h is set to #10DC78 with the up indicator when it’s a positive number.

Note: The fractional part of price_change_percentage_24h is rounded to 2 numbers: 6,2122 to 6,21.

• The response will look as follows:

[
  {
    "id": "bitcoin",
    "symbol": "btc",
    "name": "Bitcoin",
    "image": "https://assets.coingecko.com/coins/images/1/large/bitcoin.png?1547033579",
    "current_price": 16260.95,
    "market_cap": 312693497355,
    "market_cap_rank": 1,
    "fully_diluted_valuation": 341753425839,
    "total_volume": 29961373190,
    "high_24h": 16269.92,
    "low_24h": 15649.4,
    "price_change_24h": 121.5,
    "price_change_percentage_24h": 0.7528,
    "market_cap_change_24h": 2195051889,
    "market_cap_change_percentage_24h": 0.70694,
    "circulating_supply": 19214331,
    "total_supply": 21000000,
    "max_supply": 21000000,
    "ath": 69045,
    "ath_change_percentage": -76.43761,
    "ath_date": "2021-11-10T14:24:11.849Z",
    "atl": 67.81,
    "atl_change_percentage": 23891.79428,
    "atl_date": "2013-07-06T00:00:00.000Z",
    "roi": null,
    "last_updated": "2022-11-22T16:06:32.860Z"
  }
]

Design

• Figma design.