feat/graph-coins #6
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| @@ -44,7 +48,10 @@ export default function CarouselCoins() { | |||
| key={coin.id} | |||
| className="sm:basis-1/2 md:basis-1/3 lg:basis-1/4 xl:basis-1/5" | |||
| > | |||
| <div className="h-[88px] dark:bg-[#191925] bg-[#FFFFFF] flex items-center rounded-lg cursor-pointer"> | |||
| <div | |||
| onClick={() => handleCarousel(coin.id)} | |||
There was a problem hiding this comment.
We should not add onClick on a div, it is semantically not correct. You should replace this div with a button and remove the styling if you don't want styling.
src/app/components/PriceChart.tsx
Outdated
| return <div>Error fetching data</div>; | ||
| } | ||
|
|
||
| const coin = selectedCoins.length > 0 ? selectedCoins[0] : null; |
There was a problem hiding this comment.
You can take selectedCoins.length in a variable.
src/app/components/PriceChart.tsx
Outdated
| })) | ||
| : []; | ||
|
|
||
| const handleMouseMove = (e: any) => { |
There was a problem hiding this comment.
Why are we using any in typescript, it should have proper typing.
There was a problem hiding this comment.
I've fixed it. I'll push the code soon.
src/app/components/PriceChart.tsx
Outdated
|
|
||
| <XAxis dataKey="date" axisLine={false} tickLine={false} /> | ||
|
|
||
| <Tooltip content={<></>} /> |
There was a problem hiding this comment.
Why does Tooltip don't have any content?
There was a problem hiding this comment.
I don't want to display anything in Tooltip because I'm displaying updated price outside chart. When I'm hovering over chart it is updating price number outside chart. Tooltip is used to display information inside chart as a box which is displayed when you hover over chart. If I delete content={<></>} inside tooltip i will have the same information presented twice, price will be displayed as a box inside chart and outside chart because I specified to have a price outside chart with the name of coin and date.
…div with button inside CarouselCoins component
added area and bar graph for displaying bitcoin data. It displays bitcoin data on load, it can change currency based on which currency you select in dropdown. You can hover over chart and price and volume will be displayed based on date. It is hardcoded to display bitcoin but in the next PRs it will be implemented to load a chart based on selected coin in carousel component.