# 🚀 ClaimFlow – AI-Powered Insurance Claim Dashboard

ClaimFlow is a frontend-driven simulation of a real-world insurance claim processing system. It combines a modern dashboard interface with backend automation (via n8n) to demonstrate how claims can be submitted, tracked, and analyzed in a structured workflow.

This project focuses on bridging user interaction → backend automation → operational insights, while keeping the experience intuitive and responsive.

## 🧩 What this project actually does

Instead of being just a static dashboard, ClaimFlow models a simplified version of how insurance companies handle claims:

• A user submits a claim through a dynamic intake form
• The data is sent to an n8n webhook
• The backend processes and returns structured claim data
• The dashboard updates instantly with the new claim
• Claims can be monitored, filtered, and analyzed

The idea is to show how automation + UI + data flow come together in a real product.

## ✨ Key Features

**### 📊 1. Live Claims Dashboard

• Displays all claims with details like status, priority, department, and duration
• Helps identify delays and bottlenecks quickly
• Includes filtering (status, department, search)

🧠 2. AI Insight Panel

• Each claim includes a recommendation field
• Simulates how AI could assist in decision-making
• Highlights inefficiencies in workflows

📝 3. Dynamic Claim Intake

• Form adapts based on insurance type
• Required documents are automatically determined
• Missing documents are flagged before submission
• Prevents incomplete claim submissions

🔗 4. n8n Webhook Integration

• Real-time data exchange using webhook endpoints
• Claim submission triggers backend automation
• Structured response updates the UI immediately

📈 5. Operational Analytics

• Department-wise workload visualization
• Claim status distribution
• Average processing time insights

🔍 6. Claim Tracking View

• Users can track claims using a reference ID
• Displays current step, status, and progress
• Simulates real-world claim lifecycle visibility

⚙️ Tech Stack

• Frontend: React + Vite
• Language: TypeScript
• Styling: Custom CSS (focus on clean, minimal UI)
• Backend Automation: n8n (Webhook-based workflows)
• Deployment: Vercel

🔄 How the flow works

1. User fills out the claim form
2. Data is sent to an n8n webhook
3. n8n processes and returns structured JSON
4. The frontend normalizes and displays the data
5. Dashboard updates instantly

This mimics how real systems handle event-driven workflows.

📂 Project Structure

src/
 ├── App.tsx        // Main application logic
 ├── ClaimTracker   // Tracking UI
 ├── assets/        // Images / static assets
 ├── styles/        // CSS files

**## 🧪 Running Locally **

npm install
npm run dev

---

🌐 Live Demo

https://ai-insurance-operations-claim-flow.vercel.app/

💡 What I focused on while building this

• Keeping the UI clean and not overwhelming
• Making the data flow feel real (not static/mock only)
• Simulating real-world workflows instead of just visuals
• Ensuring the system is extendable (tracking, analytics, etc.)

🚧 Possible Improvements

• Authentication & role-based access
• Real document upload instead of simulated toggles
• Persistent backend (database instead of webhook-only flow)
• Notification system (email / alerts)
• AI-based fraud detection logic

👤 Author

Varnika AI & ML Student | Interested in building systems that combine data, automation, and user experience

⭐ Final Note

This project is less about “just a dashboard” and more about exploring how frontend systems interact with automated workflows in real-world scenarios.

It’s a step towards building products that are not just functional, but also operationally meaningful.