Skip to content
AryakostePublic

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Repository files navigation

🌍 EcoLens

AI Carbon Footprint Analyzer with On-Chain Pledges

Next.js Gemini Auth0 Solana TypeScript

Snap a photo of your lunch, describe your commute, or upload a receipt — EcoLens uses Google Gemini Vision to instantly reveal the hidden CO₂ cost of your daily choices. Then pledge to do better on the Solana blockchain — a permanent, public, verifiable commitment.


✨ Features

Feature Description
📸 Vision Analysis Upload any photo — Gemini Vision identifies items and calculates CO₂
✍️ Text Analysis Describe any activity and get an accurate, sourced emission estimate
🎙️ Voice Input Speak your description using the browser's Speech API
⚖️ Compare Mode Race two options side by side — see the greener choice with a winner crown
◎ Solana Pledges Sign an on-chain pledge with Phantom — permanent, immutable, verifiable
🤖 Streaming AI Chat Gemini-powered eco-agent that streams responses token-by-token
📊 Carbon Budget Set a weekly CO₂ goal and track it against a live circular meter
📋 Analysis History Every scan saved locally — expandable, searchable, clearable
🎉 Confetti Green confetti fires when your result comes back Low Impact
📤 Shareable Cards Download your result as a PNG image to share on social media

🔗 The Core Loop

📸 Photo / 📝 Text / 🎙️ Voice
        ↓
  Gemini 2.0 Flash
  (vision + emissions data)
        ↓
  CO₂ breakdown + alternatives
        ↓
  ◎ Sign pledge on Solana
  (Phantom wallet + Memo Program)
        ↓
  Permanent on-chain record
  verifiable on Solana Explorer

🚀 Getting Started

1. Clone and install

git clone https://github.com/aryakoste/ecolens
cd ecolens
npm install

2. Configure environment variables

cp .env.local.example .env.local

Open .env.local and fill in:

Google Gemini

  1. Go to Google AI Studio → Create API key
  2. Set GEMINI_API_KEY=your_key

Auth0

  1. Create a Regular Web Application
  2. Set Allowed Callback URLs → http://localhost:3000/api/auth/callback
  3. Set Allowed Logout URLs → http://localhost:3000
  4. Fill in AUTH0_ISSUER_BASE_URL, AUTH0_CLIENT_ID, AUTH0_CLIENT_SECRET
  5. Generate a secret: openssl rand -hex 32 → set as AUTH0_SECRET

Solana — no API key needed. Uses Phantom wallet (browser extension) on Devnet. Install Phantom, open Settings → Developer Settings → Switch to Devnet.

3. Run

npm run dev

Open http://localhost:3000


🛠️ Tech Stack

Layer Technology
Framework Next.js 15 (App Router, server components)
AI Google Gemini 2.0 Flash (@google/generative-ai)
Auth Auth0 for Agents (@auth0/nextjs-auth0 v3)
Blockchain Solana Devnet (@solana/web3.js + Phantom)
Styling Tailwind CSS + custom CSS animations
Animation Framer Motion
Confetti canvas-confetti
Share cards html-to-image
Language TypeScript (strict)
Deployment Vercel

📁 Project Structure

app/
  page.tsx                    ← Landing page with animated Earth globe
  dashboard/
    page.tsx                  ← Server component — Auth0 session guard
    dashboard-client.tsx      ← Client dashboard (Analyze / Compare / History / Chat tabs)
  api/
    analyze/route.ts          ← Gemini vision + text analysis (Auth0 protected)
    chat/route.ts             ← Streaming Gemini chat (Auth0 protected)
    compare/route.ts          ← Side-by-side carbon comparison (Auth0 protected)
    auth/[auth0]/route.ts     ← Auth0 login / callback / logout handler

components/
  earth-globe.tsx             ← CSS animated globe (no Three.js)
  carbon-analyzer.tsx         ← Text + image upload + voice input + confetti
  impact-result.tsx           ← Result card with share button + Solana pledge
  solana-pledge.tsx           ← Phantom wallet connection + Memo Program transaction
  compare-analyzer.tsx        ← Side-by-side comparison UI
  eco-chat.tsx                ← Streaming AI chat interface
  carbon-history.tsx          ← Expandable localStorage history list
  budget-meter.tsx            ← Circular weekly CO₂ budget tracker
  navigation.tsx              ← Top nav with Auth0 user avatar

lib/
  gemini.ts                   ← Gemini client, analysis prompt, streaming generator
  history.ts                  ← useAnalysisHistory hook (localStorage)

◎ How the Solana Pledge Works

After each analysis, EcoLens suggests a greener alternative and offers a Sign pledge with Phantom button.

Clicking it:

  1. Connects to the user's Phantom wallet via window.solana.connect()
  2. Builds a Transaction using the Solana Memo Program (MemoSq4gqABAXKb96qnH8TysNcWxMyWCqXgDLGmfcHr)
  3. Encodes the pledge text, CO₂ saved, and timestamp as UTF-8 memo data
  4. Sends it to Solana Devnet — confirmed in ~400ms, costs < $0.001
  5. Returns a transaction signature linkable on Solana Explorer

The pledge is permanent, public, and tied to the user's wallet address.

const tx = new Transaction().add(
  new TransactionInstruction({
    keys: [{ pubkey: publicKey, isSigner: true, isWritable: false }],
    programId: MEMO_PROGRAM_ID,
    data: Buffer.from(JSON.stringify({
      app: "EcoLens",
      pledge: "I pledge to cycle instead of drive this week",
      carbonKg: 2.4,
      ts: new Date().toISOString(),
    }), "utf-8"),
  })
);
const { signature } = await window.solana.signAndSendTransaction(tx);

🗺️ Roadmap

  • Solana Mainnet pledges with SOL micro-transactions
  • On-chain pledge leaderboard — public wallet rankings
  • NFT certificates when weekly carbon goal is hit
  • Snowflake analytics — anonymized community emissions trends
  • Verified offset recommendations linked to on-chain pledges

Built with 💚 for Earth Day 2025

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages