Add "Did You Know?" Environmental Facts Section

[Eshaan-byte]

Description

Create an educational component that displays random environmental facts to help users learn more about carbon emissions and sustainability while using the app!

Task

Create a "Did You Know?" section that shows interesting environmental facts related to carbon emissions.

What You Need to Do

1. Create a new file src/constants/environmentalFacts.ts with an array of facts
2. Create a component EnvironmentalFacts.tsx in src/components/ui/
3. Display a random fact each time the component loads
4. Add a "Next Fact" button to cycle through facts
5. Style it to match the app's eco-friendly theme (green gradients)

Example Facts

export const ENVIRONMENTAL_FACTS = [
  {
    id: 1,
    fact: "Sending 65 emails is roughly equivalent to driving 1 kilometer in a car.",
    icon: "📧",
  },
  {
    id: 2,
    fact: "The internet produces about 900 million tons of CO2 annually - similar to the aviation industry.",
    icon: "🌐",
  },
  {
    id: 3,
    fact: "Streaming video in HD uses about 8x more data than standard definition, resulting in higher emissions.",
    icon: "📺",
  },
  // Add at least 10 facts
];
Example Component Design
┌────────────────────────────────────┐
│  💡 Did You Know?                 
│                                    
│  🌍 The internet produces about   
│  900 million tons of CO2          
│  annually - similar to aviation!  
│                                    
│  [Next Fact →]                    
└────────────────────────────────────┘
Acceptance Criteria
 Create constants file with at least 10 environmental facts
 Component displays random fact on load
 "Next Fact" button shows different fact
 Attractive card design with icon
 Responsive design
 Facts are educational and accurate
Where to Add
You can add this component to the Dashboard or create a dedicated section in the main page.

[dhirajlaulkar]

Please assign me this issue.
working on it

[Eshaan-byte]

@dhirajlaulkar Thanks for the PR! I checked the code and the “Did You Know?” section isn’t present yet.
To meet the issue requirements, could you please:
Create src/constants/environmentalFacts.ts with at least 10 environmental facts
Create src/components/ui/EnvironmentalFacts.tsx that displays a random fact on load
Add a “Next Fact” button to cycle through facts
Style it to match the app’s eco-friendly theme (green gradients)
Add the component to the Dashboard
Suggested structure:
// src/constants/environmentalFacts.ts
export const ENVIRONMENTAL_FACTS = [
{ id: 1, fact: "Sending 65 emails is roughly equivalent to driving 1 kilometer in a car.", icon: "📧" },
// ... at least 10 facts
];
Once that’s in, I’ll review and merge. Thanks! 🌱

[dhirajlaulkar]

I have
created the src/constants/environmentalFacts.ts with 11 environmental facts, with the structure given above.
Created src/components/ui/EnvironmentalFacts.tsx that displays a random fact on load.
Added a “Next Fact” button to cycle through facts
Styled it to match the theme and added the component to dashboard.

Could you please check the files changed.
@Eshaan-byte
I think everything is correct from my end.
could you please tell me whether you see some of the changed/added files or no files at all?
Or is there any other issue