File size: 6,464 Bytes
9ce3455 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 | import { useState } from 'react';
import FileUpload from './components/FileUpload';
import AnalysisDashboard from './components/AnalysisDashboard';
import ReportPreview from './components/ReportPreview';
import { FileText, BarChart3, Download } from 'lucide-react';
function App() {
const [currentView, setCurrentView] = useState('upload');
const [analysisData, setAnalysisData] = useState(null);
const [reportData, setReportData] = useState(null);
const handleAnalysisComplete = (data) => {
setAnalysisData(data);
setReportData(data);
setCurrentView('dashboard');
};
return (
<div style={{ minHeight: '100vh', paddingBottom: '2rem' }}>
{/* Header */}
<header style={{
background: 'rgba(255, 255, 255, 0.98)',
backdropFilter: 'blur(30px) saturate(180%)',
borderBottom: '1px solid rgba(102, 126, 234, 0.2)',
boxShadow: '0 8px 32px rgba(0, 0, 0, 0.08)',
position: 'sticky',
top: 0,
zIndex: 100
}}>
<div className="container" style={{ padding: '1.5rem' }}>
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<div style={{
width: '56px',
height: '56px',
background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
borderRadius: '16px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
color: 'white',
fontSize: '1.75rem',
fontWeight: 'bold',
boxShadow: '0 8px 24px rgba(102, 126, 234, 0.4)',
transition: 'transform 0.3s ease'
}}
onMouseEnter={(e) => e.currentTarget.style.transform = 'rotate(10deg) scale(1.1)'}
onMouseLeave={(e) => e.currentTarget.style.transform = 'rotate(0deg) scale(1)'}
>
📊
</div>
<div>
<h1 style={{
fontSize: '1.75rem',
fontWeight: '800',
background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
WebkitBackgroundClip: 'text',
WebkitTextFillColor: 'transparent',
marginBottom: '0.25rem',
letterSpacing: '-0.5px'
}}>
RAG Document Analysis
</h1>
<p style={{
fontSize: '0.9rem',
color: '#6b7280',
fontWeight: '500'
}}>
National Disaster Management Authority
</p>
</div>
</div>
<div className="flex gap-2">
<button
onClick={() => setCurrentView('upload')}
className={`btn ${currentView === 'upload' ? 'btn-primary' : 'btn-secondary'}`}
>
<FileText size={18} />
Upload
</button>
<button
onClick={() => setCurrentView('dashboard')}
className={`btn ${currentView === 'dashboard' ? 'btn-primary' : 'btn-secondary'}`}
disabled={!analysisData}
>
<BarChart3 size={18} />
Dashboard
</button>
<button
onClick={() => setCurrentView('report')}
className={`btn ${currentView === 'report' ? 'btn-primary' : 'btn-secondary'}`}
disabled={!reportData}
>
<Download size={18} />
Report
</button>
</div>
</div>
</div>
</header>
{/* Main Content */}
<main className="container" style={{ marginTop: '2rem' }}>
{currentView === 'upload' && (
<FileUpload onAnalysisComplete={handleAnalysisComplete} />
)}
{currentView === 'dashboard' && analysisData && (
<AnalysisDashboard data={analysisData} />
)}
{currentView === 'report' && reportData && (
<ReportPreview data={reportData} />
)}
</main>
{/* Footer */}
<footer style={{
marginTop: '4rem',
padding: '2.5rem 0',
textAlign: 'center',
color: 'rgba(255, 255, 255, 0.95)',
fontSize: '0.9rem',
background: 'rgba(255, 255, 255, 0.1)',
backdropFilter: 'blur(20px)',
borderTop: '1px solid rgba(255, 255, 255, 0.2)',
fontWeight: '500'
}}>
<p>© 2025 National Disaster Management Authority, Government of India</p>
<p style={{ marginTop: '0.625rem', fontSize: '0.85rem', opacity: 0.9 }}>
Developed by JARVIS GGV | Smart India Hackathon 2025
</p>
</footer>
</div>
);
}
export default App;
|