Update README.md

README.md

@@ -1,127 +1,114 @@
-# DGaze - News Verification Gradio Frontend
-
-A modular Gradio-based frontend for the DGaze news verification system, designed to mirror the functionality of the React frontend while providing a simple, accessible interface.
+---
+title: DGaze News Verification
+emoji: 🔍
+colorFrom: blue
+colorTo: purple
+sdk: gradio
+sdk_version: "4.0.0"
+app_file: spaces_app.py
+pinned: false
+license: mit
+short_description: AI-powered news verification system with free demo
+---
+
+# DGaze - Advanced News Verification System
+
+An advanced AI-powered news verification system with authentication that helps identify potentially misleading or false information.
 
 ## Features
 
-- **News Verification**: Verify news articles and claims using advanced AI
-- **Modular Architecture**: Clean, maintainable code structure similar to the React frontend
-- **Rich Results Display**: Comprehensive verification results with confidence scores, evidence, and sources
-- **Responsive Design**: Clean, modern UI with proper styling and theming
-- **Collapsible Claims**: Interactive claim cards with show/hide evidence functionality
-
-## Architecture
-
-The application follows a modular structure similar to the React frontend:
+- **🔐 Authentication**: Secure Auth0 integration with trial and full access modes
+- **🆓 Free Trial**: 2 free verifications for unauthenticated users  
+- **🔍 Real-time Analysis**: Instant verification of news articles and URLs
+- **📊 Credibility Scoring**: Detailed credibility scores for news content
+- **🌐 Source Verification**: Check the reliability of news sources
+- **📱 Multiple Interfaces**: Trial, login, and authenticated user interfaces
+- **🎨 Beautiful UI**: Professional gradient design with responsive layout
+
+## How to Use
+
+### Free Trial (No Login Required)
+1. Visit the **trial interface** at `/trial`
+2. **Paste news text** or **URL** in the input box
+3. **Click "Verify News"** to analyze the content  
+4. **Get detailed results** including credibility score and analysis
+5. Enjoy **2 free verifications** per session
+
+### Full Access (With Login)
+1. **Click "Sign In"** to authenticate via Auth0
+2. Get **unlimited verifications**
+3. Access to **premium features**
+4. **Session persistence** across visits
 
-```
-frontend_gradio/
-├── config/          # Configuration management
-├── api/             # Backend API client
-├── components/      # UI formatting components  
-├── utils/           # Utility functions
-├── app.py           # Main application
-└── .env            # Environment variables (not in repo)
-```
-
-## Setup Instructions
+## Configuration
 
-### 1. Environment Setup
+This Space requires the following environment variables to be set in the Space settings:
 
-**IMPORTANT**: The backend URL is kept secret and must be configured via environment variables.
+### Required Environment Variables
 
-1. Copy the example environment file:
 ```bash
-cp .env.example .env
-```
+# Backend API Configuration (REQUIRED)
+API_BASE_URL=your-backend-api-url
 
-2. Edit `.env` file and add your backend URL:
-```bash
-# REQUIRED: Add your actual backend URL here
-API_BASE_URL=https://your-actual-backend-url.com
+# Auth0 Configuration (REQUIRED for authentication)
+AUTH0_DOMAIN=your-auth0-domain
+AUTH0_CLIENT_ID=your-auth0-client-id  
+AUTH0_CLIENT_SECRET=your-auth0-client-secret
+AUTH0_AUDIENCE=your-auth0-audience
 
-# Optional: Configure other settings as needed
+# Security
+SECRET_KEY=your-session-secret-key
+
+# Optional: App Configuration
+GRADIO_SERVER_NAME=0.0.0.0
 GRADIO_SERVER_PORT=7860
-GRADIO_SHARE=false
 DEBUG=false
 ```
 
-⚠️ **Security Note**: Never commit the `.env` file to version control. It contains sensitive URLs and credentials.
-
-### 2. Installation
-
-1. Create and activate virtual environment:
-```bash
-python -m venv venv
-source venv/bin/activate  # On Windows: venv\Scripts\activate
-```
-
-2. Install dependencies:
-```bash
-pip install -r requirements.txt
-```
-
-### 3. Running the Application
-
-```bash
-python app.py
-```
-
-The application will start on `http://localhost:7860` (or the port specified in your `.env` file).
-
-## Configuration
-
-All configuration is managed through environment variables in the `.env` file:
-
-- **API_BASE_URL** (REQUIRED): Backend API URL
-- **GRADIO_SERVER_NAME**: Server hostname (default: 0.0.0.0)
-- **GRADIO_SERVER_PORT**: Server port (default: 7860)
-- **GRADIO_SHARE**: Enable Gradio sharing (default: false)
-- **DEBUG**: Enable debug mode (default: false)
-
-See `.env.example` for a complete list of available configuration options.
+### Setting Environment Variables
+1. Go to your **Space Settings**
+2. Find **"Repository secrets"** or **"Variables and secrets"**
+3. Add each variable with **"Private"** visibility for sensitive data
+4. **Restart the Space** after adding variables
 
-## Error Handling
+## Try the Examples
 
-If the `API_BASE_URL` is not set in the `.env` file, the application will exit with a clear error message:
+We've included sample news articles to demonstrate the verification capabilities:
+- Suspicious breakthrough claims with questionable sources
+- Real news with proper sourcing and verification
 
-```
-ERROR: Required environment variable 'API_BASE_URL' not found in .env file!
-Please add 'API_BASE_URL=<your-backend-url>' to your .env file
-```
-
-## Security
+## Architecture
 
-- Backend URLs are never hardcoded in the source code
-- All sensitive configuration is managed through environment variables
-- The `.env` file is excluded from version control via `.gitignore`
-- Use `.env.example` as a template for required variables
+This application uses:
+- **FastAPI**: Backend API framework with Auth0 integration
+- **Gradio**: Interactive web interface with multiple mounted apps
+- **Auth0**: Secure authentication and user management
+- **Session Management**: Trial tracking and user state management
+- **Modular Design**: Clean separation of concerns with api/, config/, and components/ modules
 
-## Development
+## API Integration
 
-The modular structure makes it easy to:
-- Add new UI components in `components/`
-- Extend API functionality in `api/`
-- Add utility functions in `utils/`
-- Modify configuration in `config/`
+The app connects to a backend API for news verification. Make sure your backend API supports:
+- `POST /api/verify` - Main verification endpoint
+- `GET /api/health` - Health check endpoint
 
-## Deployment
+## Local Development
 
-For production deployment:
+To run locally:
+1. Clone this repository
+2. Install dependencies: `pip install -r requirements.txt`
+3. Set up your `.env` file with the required variables
+4. Run: `python app.py`
+5. Access at `http://localhost:3000`
 
-1. Set up your production `.env` file with actual values
-2. Configure proper security settings
-3. Use a production WSGI server instead of the development server
-4. Set `DEBUG=false` in your environment
+## Built With
 
-## Troubleshooting
+- **Gradio**: Interactive web interface
+- **FastAPI**: Modern, fast web framework
+- **Auth0**: Authentication platform
+- **Python**: Backend processing
+- **Hugging Face Spaces**: Hosting platform
 
-**Backend Connection Issues:**
-- Ensure your `API_BASE_URL` in `.env` is correct
-- Check if the backend service is running
-- Verify network connectivity to the backend
+---
 
-**Environment Variable Issues:**
-- Make sure `.env` file exists in the project root
-- Verify all required variables are set
-- Check for typos in variable names 
+*Built with ❤️ for fighting misinformation and promoting media literacy*