Wajibika Mazingira

Empowering Kenyan communities with AI-driven environmental oversight.

Wajibika Mazingira (Swahili for "Be Responsible for the Environment") is a powerful, serverless web application designed to democratize environmental and social impact assessments in Kenya. It leverages the Google Gemini API to provide communities with instant, detailed reports, a secure evidence locker with AI-powered analysis, and an advanced, multi-modal community assistant.

Wajibika Mazingira is built on three core pillars, each designed to empower local communities:

Generate five distinct types of impact assessments. Now featuring a Deep Analysis mode powered by gemini-2.5-pro with a maxed-out thinkingBudget for tackling the most complex project analyses.

Securely store reports and upload photographic evidence. Use the power of gemini-2.5-flash to get an instant AI analysis of your images, identifying potential environmental issues.

Engage with "Mazingira Rafiki," an AI assistant with new capabilities:

• Voice-to-Text: Speak your message directly into the chat for transcription.
• Text-to-Speech: Listen to the AI's responses.
• Multi-Mode Operation:
  • Fast Mode (gemini-2.5-flash-lite): For quick, low-latency answers.
  • Smart Mode (gemini-2.5-flash): For balanced, intelligent conversation.
  • Grounded Mode (gemini-2.5-flash with Google Search): For up-to-date, factual answers on recent topics, complete with citations.
  • Maps Mode (gemini-2.5-flash with Google Maps): For location-based questions like "find recycling centers near me," with links to places on Google Maps.

• Multi-Modal AI Backend: Uses a versatile Netlify Function to securely handle requests for text generation, image analysis, audio transcription, and text-to-speech with various Gemini models.
• Dynamic AI Assessment Generation: Create detailed reports with standard or deep-analysis modes.
• Visual Evidence Analysis: Upload and analyze images for environmental context.
• Multi-Mode Chat: Switch between fast, smart, search-grounded, and map-grounded conversation modes.
• Accessible Communication: Use voice-to-text for input and text-to-speech for output.
• Secure & Private Storage: All data is stored exclusively in the browser via localStorage.
• Fully Responsive: A seamless experience on desktop, tablet, and mobile devices.

• Frontend: React, TypeScript, Vite
• Styling: Tailwind CSS
• AI Models: Google Gemini API (gemini-2.5-pro, gemini-2.5-flash, gemini-2.5-flash-lite, gemini-2.5-flash-preview-tts)
• Backend: Serverless via Netlify Functions
• Client-side Storage: useLocalStorage custom hook
• Deployment: Netlify

This project is now configured with a standard build process.

• Node.js and npm
• A valid Google Gemini API Key. You can get one from Google AI Studio.
• Netlify CLI (for local development)

1. Clone the repository:

   git clone https://github.com/your-username/wajibika-mazingira.git
   cd wajibika-mazingira

2. Install dependencies:

   npm install

3. Set up the API Key: The application requires the API_KEY to be available as an environment variable. For local development with the Netlify CLI, create a .env file in the root of the project:

   # .env
   API_KEY="Your-Gemini-API-Key-Here"
   

4. Run the development server: Use the Netlify CLI to run the Vite dev server and the serverless functions together.

   ntl dev

5. Open your browser and navigate to the local address provided by the CLI (e.g., http://localhost:8888).

1. Push your repository to GitHub, GitLab, or Bitbucket.
2. Connect your Git provider to Netlify.
3. Select the repository. The netlify.toml file in the project will automatically configure the build command (npm run build) and the publish directory (dist).
4. Add your Gemini API key as an environment variable in the Netlify site settings:
   • Go to Site configuration > Environment variables.
   • Add a new variable:
     • Key: API_KEY
     • Value: Your-Gemini-API-Key-Here
5. Trigger a deploy. Your site will be live!