-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathApp.jsx
More file actions
126 lines (115 loc) · 7.24 KB
/
App.jsx
File metadata and controls
126 lines (115 loc) · 7.24 KB
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
import React, { useState, useEffect, useCallback } from 'react';
import SearchBar from './components/SearchBar';
import FilterPanel from './components/FilterPanel';
import ResearchTable from './components/ResearchTable';
import StatsPanel from './components/StatsPanel';
import ResearchChart from './components/ResearchChart';
import './App.css';
// Sample data — in production this would come from the Kotlin API
// GET /api/research
const SAMPLE_DATA = [
{ id: 1, title: "AI Safety and Alignment in Large Language Models", author: "Chen, L.", topic: "AI Safety", date: "2024-03-15", citations: 142, status: "Published", impact: "High" },
{ id: 2, title: "Macroeconomic Forecasting Using Neural Networks", author: "Smith, J.", topic: "Economics", date: "2024-01-22", citations: 87, status: "Published", impact: "Medium" },
{ id: 3, title: "Drug Resistance Mechanisms in Oncology", author: "Patel, R.", topic: "Healthcare", date: "2024-05-01", citations: 203, status: "Published", impact: "High" },
{ id: 4, title: "Quantum Computing Applications in Cryptography", author: "Nakamura, Y.", topic: "Technology", date: "2023-11-30", citations: 56, status: "Published", impact: "Medium" },
{ id: 5, title: "ESG Reporting Standards and Corporate Governance", author: "Williams, A.", topic: "Finance", date: "2024-02-14", citations: 31, status: "Review", impact: "Low" },
{ id: 6, title: "Gene Editing CRISPR-Cas9 Clinical Trials", author: "Garcia, M.", topic: "Healthcare", date: "2024-04-08", citations: 178, status: "Published", impact: "High" },
{ id: 7, title: "Distributed Systems Consistency Models", author: "Kim, S.", topic: "Technology", date: "2023-12-05", citations: 94, status: "Published", impact: "Medium" },
{ id: 8, title: "Climate Risk Modelling for Financial Portfolios", author: "Brown, T.", topic: "Finance", date: "2024-03-28", citations: 67, status: "Published", impact: "Medium" },
{ id: 9, title: "mRNA Vaccine Platform Efficacy Studies", author: "Johansson, E.", topic: "Healthcare", date: "2024-06-01", citations: 312, status: "Published", impact: "High" },
{ id: 10, title: "Reinforcement Learning in Robotics Control", author: "Okafor, B.", topic: "AI Safety", date: "2024-01-10", citations: 45, status: "Review", impact: "Medium" },
{ id: 11, title: "Central Bank Digital Currency Design Principles", author: "Martinez, C.", topic: "Finance", date: "2023-10-18", citations: 129, status: "Published", impact: "High" },
{ id: 12, title: "Antibiotic Resistance and Microbiome Research", author: "Singh, P.", topic: "Healthcare", date: "2024-02-28", citations: 88, status: "Published", impact: "Medium" },
{ id: 13, title: "Transformer Architecture Scaling Laws", author: "Thompson, D.", topic: "Technology", date: "2024-05-15", citations: 267, status: "Published", impact: "High" },
{ id: 14, title: "Private Equity Valuation in Emerging Markets", author: "Dubois, F.", topic: "Finance", date: "2024-04-22", citations: 19, status: "Draft", impact: "Low" },
{ id: 15, title: "Neural Correlates of Decision Making Under Risk", author: "Yamamoto, K.", topic: "Healthcare", date: "2024-03-05", citations: 71, status: "Published", impact: "Medium" },
{ id: 16, title: "Edge Computing Architecture for IoT Systems", author: "Andersen, L.", topic: "Technology", date: "2023-09-14", citations: 103, status: "Published", impact: "Medium" },
{ id: 17, title: "Supply Chain Disruption Modelling Post-COVID", author: "Zhao, W.", topic: "Economics", date: "2024-01-30", citations: 156, status: "Published", impact: "High" },
{ id: 18, title: "Explainability Methods for Black-Box ML Models", author: "Rossi, G.", topic: "AI Safety", date: "2024-06-10", citations: 38, status: "Review", impact: "Medium" },
{ id: 19, title: "Sovereign Debt Restructuring Mechanisms", author: "Kowalski, M.", topic: "Economics", date: "2023-08-22", citations: 84, status: "Published", impact: "Medium" },
{ id: 20, title: "Personalised Medicine Genomic Biomarkers", author: "Hassan, N.", topic: "Healthcare", date: "2024-05-28", citations: 241, status: "Published", impact: "High" },
];
const TOPICS = ["All", "AI Safety", "Economics", "Finance", "Healthcare", "Technology"];
const STATUSES = ["All", "Published", "Review", "Draft"];
const IMPACTS = ["All", "High", "Medium", "Low"];
const SORT_OPTIONS = [
{ value: "date_desc", label: "Newest first" },
{ value: "date_asc", label: "Oldest first" },
{ value: "citations_desc",label: "Most cited" },
{ value: "citations_asc", label: "Least cited" },
{ value: "title_asc", label: "Title A–Z" },
];
export default function App() {
const [data] = useState(SAMPLE_DATA);
const [query, setQuery] = useState('');
const [topic, setTopic] = useState('All');
const [status, setStatus] = useState('All');
const [impact, setImpact] = useState('All');
const [sortBy, setSortBy] = useState('date_desc');
const [selected, setSelected] = useState(null);
const filtered = useCallback(() => {
let result = [...data];
if (query.trim()) {
const q = query.toLowerCase();
result = result.filter(r =>
r.title.toLowerCase().includes(q) ||
r.author.toLowerCase().includes(q)
);
}
if (topic !== 'All') result = result.filter(r => r.topic === topic);
if (status !== 'All') result = result.filter(r => r.status === status);
if (impact !== 'All') result = result.filter(r => r.impact === impact);
result.sort((a, b) => {
switch (sortBy) {
case 'date_desc': return new Date(b.date) - new Date(a.date);
case 'date_asc': return new Date(a.date) - new Date(b.date);
case 'citations_desc': return b.citations - a.citations;
case 'citations_asc': return a.citations - b.citations;
case 'title_asc': return a.title.localeCompare(b.title);
default: return 0;
}
});
return result;
}, [data, query, topic, status, impact, sortBy]);
const results = filtered();
return (
<div className="app">
<header className="app-header">
<div className="header-content">
<div className="header-brand">
<span className="brand-icon">◈</span>
<h1>Research Dashboard</h1>
</div>
<span className="header-sub">
{results.length} of {data.length} papers
</span>
</div>
</header>
<main className="app-main">
<aside className="sidebar">
<SearchBar query={query} onChange={setQuery} />
<FilterPanel
topic={topic} setTopic={setTopic} topics={TOPICS}
status={status} setStatus={setStatus} statuses={STATUSES}
impact={impact} setImpact={setImpact} impacts={IMPACTS}
sortBy={sortBy} setSortBy={setSortBy} sortOptions={SORT_OPTIONS}
onReset={() => {
setQuery(''); setTopic('All');
setStatus('All'); setImpact('All');
setSortBy('date_desc');
}}
/>
<StatsPanel data={results} />
</aside>
<section className="content">
<ResearchChart data={results} />
<ResearchTable
data={results}
selected={selected}
onSelect={setSelected}
/>
</section>
</main>
</div>
);
}