MedSecureAI is a healthcare AI assistant I built to demonstrate the three core pillars of Auth0's AI Agents Challenge: Authentication, Token Vault, and Fine-Grained Authorization.
I implemented all three Auth0 AI pillars in a real healthcare context:
- Multi-role authentication (Patient, Doctor, Admin) with role-based UI theming
- Secure session management with proper logout and state management
- Medical safety protocols with AI disclaimers and emergency detection
- AI Actions System - Secure token management for AI operations
- Knowledge Base Integration - Protected access to medical documents
- Secure AI API Management - Safe connections to HuggingFace and healthcare systems
- Role-based content access - Patients, Doctors, and Admins see different content
- Specialization filtering - Cardiologists only see cardiology content
- Document-level permissions - Each medical document has specific access controls
- Dynamic content filtering - Real-time FGA evaluation for all medical resources
- React 18.3 with TypeScript for type safety
- Tailwind CSS with custom dark glassmorphism design
- Lucide React for consistent iconography
- React-Markdown for medical document rendering
- Fine-Grained Authorization Service - Role and specialization-based filtering
- Medical Knowledge Base - Structured markdown content with FGA metadata
- SecureAI Chat - AI agent with protected knowledge base access
- Token Vault Integration - Secure AI operations and API management
- SecureAIChat - AI agent with medical knowledge base integration
- MedicalKnowledgeBrowser - FGA-protected document access system
- Role-based Dashboards - Patient (blue), Doctor (green), Admin (purple) themes
- Medical Knowledge Service - Core FGA implementation with async-safe initialization
# Clone and setup
git clone <your-repo-url>
cd MedSecureAI
npm install
# Start development server
npm run dev
# Visit http://localhost:5174-
Login with different roles to see FGA in action:
- Patient: Access basic health information
- Doctor: Access specialized medical content based on specialization
- Admin: Full system access and user management
-
Test the AI Agent:
- Ask medical questions and see knowledge base integration
- Notice how available documents change based on your role
- Observe secure AI actions and token management
-
Explore the Knowledge Base:
- Browse medical documents with role-based filtering
- See how cardiologists only access cardiology content
- Experience real-time FGA evaluation
Unlike generic demos, I built this for actual healthcare use cases with proper medical safety protocols and HIPAA considerations.
The Fine-Grained Authorization isn't just a token check - it's a complete system that filters medical documents based on roles AND medical specializations.
- Type-safe TypeScript throughout
- Proper error boundaries and fallbacks
- Async-safe service initialization
- Professional UI/UX with glassmorphism design
- All three AI pillars implemented in meaningful ways
- Token Vault managing AI operations securely
- FGA controlling access to sensitive medical content
- Authentication with proper role-based theming
src/
├── components/
│ ├── dashboards/
│ │ ├── PatientDashboard.tsx # Blue-themed patient interface
│ │ ├── DoctorDashboard.tsx # Green-themed doctor interface
│ │ └── AdminDashboard.tsx # Purple-themed admin interface
│ ├── SecureAIChat.tsx # AI agent with knowledge base integration
│ ├── MedicalKnowledgeBrowser.tsx # FGA-protected document browser
│ └── LandingPage.tsx # Modern glassmorphism landing
├── services/
│ ├── medicalKnowledgeService.ts # Core FGA implementation
│ └── aiService.ts # Multi-provider AI integration
├── data/
│ └── medical-knowledge/ # Structured medical content
│ ├── metformin-guide.md # Diabetes medication guide
│ ├── diabetes-management.md # Comprehensive diabetes care
│ ├── hypertension-guide.md # Blood pressure management
│ └── lifestyle-medicine.md # Preventive care guidelines
└── types/
└── medical.ts # TypeScript interfaces
The core innovation is in medicalKnowledgeService.ts - I built a comprehensive FGA system that goes beyond simple role checks:
// Example: Role + Specialization filtering
const availableDocs = documents.filter(doc => {
// Role-based access (Patient, Doctor, Admin)
if (!doc.fga.allowedRoles.includes(user.role)) return false;
// Specialization filtering for doctors
if (user.role === 'doctor' && doc.fga.requiredSpecializations?.length) {
return doc.fga.requiredSpecializations.includes(user.specialization);
}
return true;
});Each medical document includes detailed access controls:
interface MedicalDocument {
title: string;
content: string;
category: 'diabetes' | 'cardiology' | 'general';
fga: {
allowedRoles: UserRole[];
requiredSpecializations?: string[];
clearanceLevel: 'basic' | 'advanced' | 'restricted';
};
}The SecureAIChat component demonstrates Token Vault by:
- Securely managing AI API tokens
- Integrating knowledge base with FGA filtering
- Displaying available documents count based on user permissions
- Processing AI actions with proper security context
Authentication Pillar
- Multi-role authentication with proper session management
- Role-based UI theming (Patient=blue, Doctor=green, Admin=purple)
- Medical safety protocols and emergency detection
Token Vault Pillar
- AI Actions system for secure token management
- Knowledge base integration with protected access
- Secure AI API management and third-party integrations
Fine-Grained Authorization Pillar
- Complete role and specialization-based filtering system
- Document-level permissions with real-time evaluation
- Medical knowledge base with FGA metadata
- Dynamic content filtering based on user context
- Replace remaining mock integrations with Auth0 APIs
- Add comprehensive audit logging
- Implement CIBA flow for critical medical approvals
- Create interactive Auth0 pillars demonstration component
I created 4 comprehensive medical documents with realistic FGA controls:
| Document | Roles | Specializations | Content |
|---|---|---|---|
| Metformin Guide | Doctor, Admin | Endocrinology, Family Medicine | Diabetes medication management |
| Diabetes Management | All | Endocrinology | Comprehensive diabetes care |
| Hypertension Guide | Doctor, Admin | Cardiology, Internal Medicine | Blood pressure management |
| Lifestyle Medicine | All | All | Preventive care and wellness |
Patient Role
- Access: 2/4 documents (Diabetes Management, Lifestyle Medicine)
- UI Theme: Blue glassmorphism
- AI Agent: Basic health information with safety disclaimers
Doctor Role
- Access: 3-4/4 documents (filtered by specialization)
- Cardiologist: Sees hypertension and general content
- Endocrinologist: Sees diabetes and medication guides
- UI Theme: Green glassmorphism
Admin Role
- Access: 4/4 documents (full system access)
- UI Theme: Purple glassmorphism
- Additional: System monitoring and user management features
npm run dev # Start development server (localhost:5174)
npm run build # Build for production
npm run preview # Preview production buildAsync-Safe Service Pattern: Solved React constructor async issues by making medicalKnowledgeService initialization synchronous with lazy loading.
Interface Compatibility Layer: Created MedicalDocument interface to bridge gaps between different component expectations.
FGA-First Architecture: Built authorization into the data layer rather than just UI components for true security.
Glassmorphism Design System: Implemented role-based theming that's both beautiful and functional for accessibility.
Built by Alphonse KAZADI for Auth0 for AI Agents Challenge 2025
Demonstrating the future of secure healthcare AI with Auth0's advanced security pillars
- React Community for excellent tooling and ecosystem
- Healthcare Professionals for medical safety guidance
Built for the Auth0 for AI Agents Challenge 2025 🏆
Secure • Compliant • Intelligent • Trustworthy