You should fetch a list of Assets
from mockApi
and use it to render a list of Assets
.
- Make a request to the
mockApi
and store the results - Use the
Loading
component to represent the API loading state - Display the
Assets list
using theAssetsList
component- You should display the
name
,value
andside
of each Asset - The
value
should be fixed to 3 decimal places - The side, if
SELL_SIDE
should be displayed asSell
, ifBUY_SIDE
should be displayed asBuy
- You should display the
- The user should be able to search by
name
using theSearch input
- Every time the
Search input
is changed (user types/erases text) a new request to the API should be made - The
Load assets
button should centered on the bottom of the screen - The
Search input
should also centered on the bottom of the screen - The App should be responsive for
xs
,sm
andlg
screens, you can useantd
Col
andRow
component for it
- Your code must be typed
- You can check the api response format on the
api-data.json
file - The
side
attribute is anenum
where the only possible values areBUY_SIDE
andSELL_SIDE
- You should write at least one test
- Edit the
mockApi
function to return a generic typed response (receivesA
and returns data of typeA
, whereA
is a generic type) - Add a debouncer to the
mockApi
call, you can uselodash
orramda
The scoring of this test will be done ONLY based on the code you wrote. If you receive a Hackerrank score after finishing the challenge, please disregard that as it won't be taken into consideration on your hiring process.