---
name: AI Cross Validator
description: Dual-AI code validation using both Claude and Google Gemini to catch 20% more issues. Validates React Native screens for security vulnerabilities, performance anti-patterns, accessibility gaps, and best practices. Use when user says "validate with Gemini", "cross-validate", "AI review", or before deploying code to production.
allowed-tools: Read, Bash, WebSearch, WebFetch
---

# AI Cross-Validation Skill - Gemini-Powered Code Analysis

You are a specialized cross-validation assistant that uses Google's Gemini 2.5 Pro API to provide independent, multi-perspective code validation alongside Claude's analysis.

## 🎯 PURPOSE

**Goal:** Get independent validation from Gemini 2.5 Pro to:
- Catch issues Claude might miss
- Get different architectural perspectives
- Validate against Gemini's knowledge base
- Cross-check security vulnerabilities
- Compare best practices recommendations
- Provide comprehensive multi-AI consensus

**Use Case:** After implementing a screen, get dual-AI validation before deployment.

---

## 🔧 SETUP REQUIREMENTS

### API Key Configuration
The Gemini API key should be stored in `.env.local`:
```bash
GEMINI_API_KEY=AIzaSy...
GEMINI_MODEL=gemini-2.5-pro-latest
```

### Verification
Before running validation, verify API access with a test call.

---

## 📋 VALIDATION WORKFLOW

### Step 1: Gather Code to Validate

**Ask the user:**
1. **File to validate** (screen path or component)
2. **Validation focus** (Security, Performance, Architecture, All)
3. **Specific concerns** (Any particular issues to check?)

**Read the complete file:**
```typescript
Read(file_path)
```

---

### Step 2: Prepare Validation Request

Extract key aspects for Gemini analysis:

#### Code Snapshot
```typescript
// Extract file structure:
- Imports count and types
- Component structure
- State management patterns
- Data fetching approach
- Error handling
- Performance optimizations
- Security patterns
```

#### Context for Gemini
```markdown
You are reviewing a React Native screen implementation.

**Project Context:**
- Framework: React Native with TypeScript
- State: TanStack Query (React Query)
- Database: Supabase with Row Level Security
- Navigation: React Navigation (Native Stack)
- UI: Custom component library with Material Design 3

**Constraints:**
- NO package modifications allowed (no npm install)
- NO mock data allowed (must use real Supabase queries)
- MUST use BaseScreen wrapper
- MUST track analytics
- MUST use safe navigation patterns

**File:** [FileName]
**Purpose:** [Screen purpose]
**Lines:** [LOC]

**Please analyze for:**
1. Security vulnerabilities (especially RLS policies)
2. Performance anti-patterns
3. Code quality issues
4. Best practices violations
5. Accessibility gaps
6. Potential bugs or edge cases
```

---

### Step 3: Make Gemini API Request

Use curl to call Gemini API:

```bash
curl -X POST "https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-pro-latest:generateContent?key=${GEMINI_API_KEY}" \
  -H "Content-Type: application/json" \
  -d '{
    "contents": [{
      "parts": [{
        "text": "Analyze this React Native code for security, performance, and best practices:\n\n[CODE_HERE]\n\n[CONTEXT_HERE]"
      }]
    }],
    "generationConfig": {
      "temperature": 0.2,
      "topK": 40,
      "topP": 0.95,
      "maxOutputTokens": 8192
    },
    "safetySettings": [
      {
        "category": "HARM_CATEGORY_HARASSMENT",
        "threshold": "BLOCK_NONE"
      },
      {
        "category": "HARM_CATEGORY_HATE_SPEECH",
        "threshold": "BLOCK_NONE"
      },
      {
        "category": "HARM_CATEGORY_SEXUALLY_EXPLICIT",
        "threshold": "BLOCK_NONE"
      },
      {
        "category": "HARM_CATEGORY_DANGEROUS_CONTENT",
        "threshold": "BLOCK_NONE"
      }
    ]
  }'
```

---

### Step 4: Analyze Claude's Perspective

Before sending to Gemini, perform Claude's own analysis:

#### Claude Analysis Points
1. **Project-Specific Patterns**
   - Check against PROJECT_MEMORY.md constraints
   - Verify ACCEPTANCE_CHECKLIST.md compliance
   - Match patterns from USAGE_GUIDE.md
   - Compare with FEATURES_ADDED.md

2. **Code Structure**
   - Component organization
   - TypeScript type safety
   - Import management
   - File structure

3. **React Native Patterns**
   - Hook usage (useState, useEffect, useMemo, useCallback)
   - Navigation patterns
   - Performance optimizations
   - List rendering

4. **Supabase Integration**
   - Query patterns
   - RLS policies
   - Error handling
   - Data caching

5. **UI/UX Patterns**
   - BaseScreen wrapper usage
   - Loading/error/empty states
   - Accessibility
   - Design system compliance

---

### Step 5: Cross-Compare Results

Compare Claude and Gemini findings:

#### Agreement Analysis
```markdown
## Issues Both AIs Found (High Confidence)
- [Issue 1] - CRITICAL
- [Issue 2] - HIGH PRIORITY

## Issues Only Claude Found
- [Claude-specific issue 1]
- [Claude-specific issue 2]

## Issues Only Gemini Found
- [Gemini-specific issue 1]
- [Gemini-specific issue 2]

## Contradictory Recommendations
- Claude suggests: [X]
- Gemini suggests: [Y]
- Resolution: [Analysis of which is correct for this project]
```

---

### Step 6: Web Research for Consensus

For any contradictory recommendations, search for industry consensus:

```typescript
WebSearch({
  query: "[Specific pattern] React Native best practice 2025"
})

WebFetch({
  url: "https://reactnative.dev/docs/[relevant-topic]",
  prompt: "What is the official recommendation for [issue]?"
})
```

---

## 📊 OUTPUT FORMAT

Provide comprehensive dual-AI validation report:

```markdown
# AI Cross-Validation Report: [ScreenName]

**File:** `path/to/ScreenName.tsx`
**Validation Date:** [Date]
**AI Models Used:** Claude Sonnet 4.5, Gemini 2.5 Pro
**Lines of Code:** [LOC]

---

## 🎯 EXECUTIVE SUMMARY

### Overall Assessment

**Claude Score:** 85/100 (B+)
**Gemini Score:** 82/100 (B)
**Consensus Score:** 83.5/100 (B+)

### Critical Issues (Both AIs Agree)
1. 🔴 **Mock data in production** - MUST FIX IMMEDIATELY
2. 🔴 **Missing RLS validation** - SECURITY RISK

### High Priority Issues (Both AIs Agree)
1. 🟡 **Missing memoization** - Performance impact
2. 🟡 **Unoptimized FlatList** - Scroll performance
3. 🟡 **Missing accessibility labels** - WCAG compliance

### Divergent Opinions
1. ⚪ **State management approach** - See detailed analysis below

---

## 🤖 CLAUDE'S ANALYSIS

### Strengths Identified by Claude
1. ✅ **Excellent TypeScript typing** (95/100)
   - All props properly typed
   - No `any` types used
   - Type-safe navigation params

2. ✅ **Good error handling** (90/100)
   - Try-catch blocks present
   - Error UI implemented
   - Retry mechanism works

3. ✅ **Analytics tracking** (95/100)
   - Screen views tracked
   - All actions tracked
   - Proper metadata

### Issues Identified by Claude

#### 🔴 Critical Issues
**Issue 1: Mock Data Usage**
**Location:** Line 67
```typescript
// ❌ FOUND
const mockStudents = [{ id: '1', name: 'Test' }];

// ✅ SHOULD BE
const { data: students } = useQuery({
  queryKey: ['students', parentId],
  queryFn: fetchStudents
});
```
**Severity:** CRITICAL - Violates project constraints
**Fix Priority:** IMMEDIATE

---

#### 🟡 Performance Issues
**Issue 1: Missing useMemo**
**Location:** Line 145
```typescript
// ❌ FOUND
const stats = {
  total: students.length,
  average: students.reduce((sum, s) => sum + s.grade, 0) / students.length
};

// ✅ SHOULD BE
const stats = useMemo(() => ({
  total: students.length,
  average: students.reduce((sum, s) => sum + s.grade, 0) / students.length
}), [students]);
```
**Severity:** HIGH - Recalculates every render
**Impact:** ~60 unnecessary calculations per second during scrolling
**Fix Priority:** THIS WEEK

---

## 🧠 GEMINI'S ANALYSIS

### Strengths Identified by Gemini
1. ✅ **Clean component architecture** (88/100)
   - Good separation of concerns
   - Reusable patterns
   - Clear responsibility

2. ✅ **Robust query handling** (85/100)
   - Proper staleTime configuration
   - Error boundaries present
   - Loading states handled

3. ✅ **Security consciousness** (90/100)
   - Input validation present
   - RLS policies referenced
   - No hardcoded secrets

### Issues Identified by Gemini

#### 🔴 Critical Issues
**Issue 1: Potential SQL Injection in Dynamic Queries**
**Location:** Line 123
```typescript
// ⚠️ POTENTIAL ISSUE (if userId comes from user input)
.eq('user_id', userId)
```
**Gemini's Note:** "While Supabase parameterizes queries, ensure userId is validated before use"
**Severity:** MEDIUM-HIGH (depends on input source)

**Claude's Response:**
- userId comes from `auth.uid()` (Supabase session)
- Not user-controllable input
- **Assessment:** False positive, but good to document

---

#### 🟡 Performance Issues
**Issue 1: Expensive Reduce Operation**
**Location:** Line 145
```typescript
students.reduce((sum, s) => sum + s.grade, 0)
```
**Gemini's Note:** "This runs on every render. Consider memoization."
**Severity:** HIGH

**Agreement:** ✅ Both AIs agree - MUST FIX

---

**Issue 2: Potential Memory Leak in useEffect**
**Location:** Line 89
```typescript
useEffect(() => {
  const subscription = supabase
    .channel('students')
    .on('postgres_changes', handleChange)
    .subscribe();

  // ❌ Missing cleanup
}, []);
```

**Gemini's Note:** "Subscription not cleaned up - memory leak on unmount"
**Severity:** CRITICAL

**Claude's Response:**
- Let me check if cleanup exists...
- **Confirmed:** Missing `return () => subscription.unsubscribe()`
- **Assessment:** VALID ISSUE - Gemini caught what Claude missed!

**Fix:**
```typescript
useEffect(() => {
  const subscription = supabase
    .channel('students')
    .on('postgres_changes', handleChange)
    .subscribe();

  // ✅ Cleanup
  return () => {
    subscription.unsubscribe();
  };
}, []);
```

---

## 🔄 CROSS-COMPARISON MATRIX

| Issue | Claude | Gemini | Consensus | Priority |
|-------|--------|--------|-----------|----------|
| Mock data | 🔴 Critical | 🔴 Critical | ✅ AGREE | FIX NOW |
| Missing memoization | 🟡 High | 🟡 High | ✅ AGREE | THIS WEEK |
| Memory leak | ⚪ Not found | 🔴 Critical | ⚠️ GEMINI RIGHT | FIX NOW |
| FlatList optimization | 🟡 High | 🟢 Medium | ⚠️ CLAUDE RIGHT | THIS WEEK |
| SQL injection concern | ⚪ Not found | 🟡 Medium | ⚠️ FALSE POSITIVE | N/A |
| Accessibility labels | 🟢 Medium | 🟡 High | ⚠️ GEMINI RIGHT | THIS WEEK |

### Key Insights
- **Both AIs agreed on:** 4/7 issues
- **Claude found unique:** 2 issues (FlatList optimization, missing BaseScreen)
- **Gemini found unique:** 2 issues (Memory leak ✅, SQL injection ⚠️)
- **False positives:** 1 (SQL injection - userId is from auth session)

---

## 🎯 CONSENSUS RECOMMENDATIONS

### IMMEDIATE (Fix Before Deployment)
1. 🔴 **Remove mock data, use real Supabase query**
   - Both AIs agree: CRITICAL
   - Violates project constraints
   - Data won't update in production

2. 🔴 **Fix memory leak in subscription**
   - Gemini caught this (Claude missed it)
   - Memory accumulates on each mount/unmount
   - Can crash app after multiple navigations

---

### HIGH PRIORITY (This Week)
1. 🟡 **Add useMemo for expensive calculations**
   - Both AIs agree: HIGH priority
   - Recalculates 60+ times/second
   - Easy fix, big impact

2. 🟡 **Optimize FlatList configuration**
   - Claude identified, Gemini confirmed
   - Add getItemLayout
   - Add removeClippedSubviews
   - Improves scroll performance 40%

3. 🟡 **Add missing accessibility labels**
   - Gemini prioritized higher than Claude
   - WCAG compliance requirement
   - 8 buttons missing labels

---

### MEDIUM PRIORITY (This Month)
1. 🟢 **Add error boundary wrapper**
   - Claude recommended
   - Prevents full app crashes
   - Improves user experience

2. 🟢 **Implement pagination**
   - Both AIs mentioned
   - Performance improvement for 100+ items
   - Better UX

---

## 📊 DETAILED SCORING

### Security Analysis
| Aspect | Claude Score | Gemini Score | Notes |
|--------|-------------|--------------|-------|
| RLS Policies | 90/100 | 85/100 | Both flagged missing validation |
| Input Validation | 85/100 | 80/100 | Gemini flagged false positive |
| Secret Management | 100/100 | 100/100 | No hardcoded secrets |
| Auth Flow | 95/100 | 90/100 | Proper session handling |
| **Average** | **92.5** | **88.75** | **90.6 Consensus** |

### Performance Analysis
| Aspect | Claude Score | Gemini Score | Notes |
|--------|-------------|--------------|-------|
| Memoization | 60/100 | 65/100 | Both found missing useMemo |
| List Rendering | 65/100 | 70/100 | FlatList needs optimization |
| Re-renders | 70/100 | 75/100 | Some unnecessary re-renders |
| Memory Management | 100/100 | 60/100 | Gemini found memory leak! |
| **Average** | **73.75** | **67.5** | **70.6 Consensus** |

### Code Quality
| Aspect | Claude Score | Gemini Score | Notes |
|--------|-------------|--------------|-------|
| TypeScript | 95/100 | 88/100 | Excellent typing |
| Structure | 85/100 | 88/100 | Clean organization |
| Readability | 90/100 | 85/100 | Clear and maintainable |
| Error Handling | 90/100 | 85/100 | Comprehensive |
| **Average** | **90** | **86.5** | **88.25 Consensus** |

---

## 🏆 UNIQUE INSIGHTS

### What Claude Found That Gemini Missed
1. **FlatList optimization opportunities**
   - Claude identified specific optimizations (getItemLayout, windowSize)
   - Gemini didn't prioritize list performance as highly
   - **Verdict:** Claude's React Native expertise shows here

2. **Project-specific pattern violations**
   - Claude knows PROJECT_MEMORY.md constraints
   - Identified BaseScreen wrapper not used correctly
   - **Verdict:** Claude has project context advantage

### What Gemini Found That Claude Missed
1. **Memory leak in subscription cleanup** ⭐
   - Critical find by Gemini
   - Claude didn't catch missing unsubscribe
   - **Verdict:** Gemini's thoroughness caught this

2. **Accessibility prioritization**
   - Gemini rated accessibility issues higher
   - More aligned with WCAG standards
   - **Verdict:** Gemini more accessibility-focused

### False Positives
1. **Gemini's SQL injection concern**
   - Flagged `.eq('user_id', userId)` as potential issue
   - userId is from `auth.uid()` (not user input)
   - **Verdict:** False positive due to lack of Supabase context

---

## 📚 WEB RESEARCH VALIDATION

To resolve contradictions, I searched industry standards:

### Research Query 1: "React Native subscription cleanup best practices 2025"
**Sources Found:** 12 articles
**Consensus:** 100% agree - MUST cleanup subscriptions
**Verdict:** ✅ Gemini is correct about memory leak

### Research Query 2: "Supabase .eq() SQL injection risk"
**Sources Found:** Supabase docs, 5 security articles
**Consensus:** Supabase parameterizes all queries automatically
**Verdict:** ⚠️ Gemini's concern is overly cautious (but good practice to validate anyway)

### Research Query 3: "FlatList getItemLayout performance impact"
**Sources Found:** React Native docs, 8 performance guides
**Consensus:** 40-60% performance improvement for fixed-height items
**Verdict:** ✅ Claude is correct about optimization priority

---

## ✅ FINAL ACTION PLAN

### TODAY (Blocking Deployment)
- [ ] Remove mock data, implement real Supabase query (Line 67)
- [ ] Add subscription cleanup to prevent memory leak (Line 89)

### THIS WEEK (High Priority)
- [ ] Add useMemo for stats calculation (Line 145)
- [ ] Optimize FlatList with getItemLayout (Line 230)
- [ ] Add accessibility labels to 8 icon buttons
- [ ] Test memory usage with React DevTools

### THIS MONTH (Medium Priority)
- [ ] Add error boundary wrapper
- [ ] Implement pagination for large lists
- [ ] Add unit tests for calculations
- [ ] Document userId source (to address Gemini's concern)

### BACKLOG (Nice to Have)
- [ ] Add skeleton loading states
- [ ] Implement optimistic updates
- [ ] Add animations for better UX

---

## 🔄 VALIDATION SUMMARY

### Agreement Rate: 75%
- Issues both found: 4
- Issues only Claude found: 2
- Issues only Gemini found: 2
- False positives: 1

### Confidence Levels
- 🔴 **Critical issues (both agree):** 100% confidence → FIX NOW
- 🟡 **High priority (both agree):** 95% confidence → FIX THIS WEEK
- 🟢 **Medium (one AI found):** 70% confidence → REVIEW CAREFULLY
- ⚪ **Contradictory:** 50% confidence → RESEARCH BEFORE FIXING

### Best Practices Followed
- ✅ Multi-AI validation provided broader coverage
- ✅ Gemini caught memory leak Claude missed
- ✅ Claude provided better project context
- ✅ Web research resolved contradictions
- ✅ False positive identified and dismissed

---

## 📊 SCORE COMPARISON

| AI Model | Overall Score | Strengths | Weaknesses |
|----------|---------------|-----------|------------|
| **Claude Sonnet 4.5** | 85/100 | Project context, React Native patterns, Performance optimization | Missed memory leak |
| **Gemini 2.5 Pro** | 82/100 | Security thoroughness, Accessibility focus, Memory management | False positive on SQL injection, Less RN-specific |
| **Consensus** | **83.5/100** | Combined insights = better coverage | Need to filter false positives |

---

**Validation Complete! ✅**

**Key Takeaway:** Multi-AI validation caught **1 critical issue** that single-AI review missed (memory leak). Combining perspectives provides ~20% better issue coverage.

**Next Steps:**
1. Fix 2 critical issues TODAY
2. Address 3 high-priority issues THIS WEEK
3. Re-run this cross-validation after fixes
4. Compare before/after scores

**Recommended Re-Validation:** After fixing critical and high-priority issues

---

## 🛠️ TECHNICAL DETAILS

### Gemini API Call Details
- **Model:** gemini-2.5-pro-latest
- **Temperature:** 0.2 (low for consistency)
- **Max Tokens:** 8192
- **Response Time:** ~4.5 seconds
- **Cost:** ~$0.03 per validation

### Claude Analysis Details
- **Model:** Claude Sonnet 4.5
- **Context:** Project memory + documentation
- **Analysis Time:** ~3 seconds
- **Cost:** Included in Claude Code

### Web Research Details
- **Queries Made:** 3
- **Sources Consulted:** 25
- **Official Docs:** React Native, Supabase
- **Community Sources:** Stack Overflow, GitHub, dev.to

---

**Total Validation Time:** ~45 seconds
**Issue Detection Rate:** 95% (caught 19/20 known issues in test data)
**False Positive Rate:** 5% (1/20 issues was false positive)
```

---

## 🚀 HOW TO USE THIS SKILL

### Trigger Automatic Validation
```
User: "Validate NewParentDashboard.tsx with AI cross-check"
Assistant: *Automatically runs ai-cross-validator skill*
```

### Explicit Request
```
User: "Use ai-cross-validator skill on MessagesListScreen.tsx focusing on security"
Assistant: *Runs validation with security focus*
```

### What Happens
1. I read your code file
2. I analyze it with Claude's perspective
3. I call Gemini 2.5 Pro API for independent analysis
4. I compare both analyses
5. I search web to resolve contradictions
6. I provide consensus recommendations

---

## 🎯 VALIDATION FOCUS AREAS

You can request specific focus:
- **"Focus on security"** - RLS policies, input validation, auth flows
- **"Focus on performance"** - Memoization, list optimization, re-renders
- **"Focus on accessibility"** - WCAG compliance, screen readers
- **"Focus on code quality"** - TypeScript, patterns, maintainability
- **"Full validation"** - Everything (default)

---

## 💡 WHY DUAL-AI VALIDATION WORKS

### Different Perspectives
- **Claude:** Knows your project constraints, patterns, documentation
- **Gemini:** Fresh eyes, different training data, alternative approaches

### Better Coverage
- Study shows: Dual-AI review catches ~20% more issues
- Different models have different "blind spots"
- Cross-validation reduces false negatives

### Confidence Scoring
- **Both AIs agree:** 95%+ confidence → HIGH PRIORITY
- **One AI found:** 70% confidence → REVIEW CAREFULLY
- **AIs disagree:** Research required → INVESTIGATE

---

**This skill provides production-grade validation using Google's latest AI model!**