performance: replace recharts charting lib with Chart.js

[nhsz]

This PR replaces the recharts charting lib with Chart.js, with the goal of providing a lighter alternative and reduce the bundle size.

We currently have 2 types of charts on the site, the /StatsBoxGrid/GridItem on the homepage and EnergyConsumptionChart

Description

• updates src/components/StatsBoxGrid/GridItem.tsx with Chart.js implementation
• updates src/components/EnergyConsumptionChart.tsx with Chart.js implementation
• updates constants.ts
• adds charts.ts to /lib/utils
• updates dependencies
  • removes recharts
  • adds chart.js
  • adds chartjs-plugin-datalabels (required plugin for custom datalabels)
  • adds react-chartjs-2 (React Chart.js wrapper)

Charts location

• StatsBoxGrid
  • https://ethereum.org
• EnergyConsumptionChart
  • https://ethereum.org/en/energy-consumption/
  • https://ethereum.org/en/what-is-ethereum/

TODO

• fix: cramped bars when resizing EnergyConsumptionChart
• review isLangRightToLeft
• add bundle size comparison to PR

[netlify[bot]]

✅ Deploy Preview for ethereumorg ready!

Name	Link
🔨 Latest commit	c4b61d7203ba032593d1763876482e29de70a9d0
🔍 Latest deploy log	https://app.netlify.com/sites/ethereumorg/deploys/664608e7cbbed700084fa3fb
😎 Deploy Preview	https://deploy-preview-12952--ethereumorg.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 31 (🔴 down 25 from production) Accessibility: 93 (🟢 up 1 from production) Best Practices: 92 (🔴 down 6 from production) SEO: 100 (🟢 up 5 from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[wackerow]

https://github.com/ethereum/ethereum-org-website/assets/54227730/7d318e63-6f09-4b23-8405-3c7c51613899

@nhsz Noticing this when playing around. It's a fairly unnatural approach for someone to resize a window like that, but also noticing it starts getting cramped on mobile:

(From a larger iPhone)

[nhsz]

Screen.Recording.2024-05-15.at.09.47.34.mov @nhsz Noticing this when playing around. It's a fairly unnatural approach for someone to resize a window like that, but also noticing it starts getting cramped on mobile:

(From a larger iPhone)

@wackerow Yes, still working on the responsive fixes, thanks