feat: complete publications and research sections and resolve conflicts

This commit is contained in:
VuHoangThien
2026-04-14 23:51:53 +07:00
51 changed files with 4897 additions and 1769 deletions

View File

@@ -0,0 +1,177 @@
'use client';
import React, { useState } from 'react';
const SORT_OPTIONS = ['Relevance', 'Newest First', 'Most Active', 'Alphabetical'];
const RESULTS = [
{
type: 'Project',
badgeClass: 'pub-badge-open',
badgeIcon: 'fa-flask',
badgeLabel: 'Active Project',
statusClass: 'pub-badge-peer',
statusLabel: 'Environmental Studies',
title: 'Urban Microclimate Modeling',
lead: 'Dr. Alan Turing',
updated: 'Updated 2 days ago',
center: 'Institute for Climate Research',
desc: 'Developing high-resolution predictive models for heat island effects in European metropolitan areas using machine learning and satellite data.',
tags: ['Climate', 'Machine Learning', 'Urban Studies'],
progress: 65,
},
{
type: 'Lab',
badgeClass: 'pub-badge-institutional',
badgeIcon: 'fa-building-user',
badgeLabel: 'Research Lab',
statusClass: 'pub-badge-peer',
statusLabel: 'Cognitive Science',
title: 'Cognitive Sciences Lab',
lead: 'Prof. Marie Curie',
updated: 'Updated 1 week ago',
center: 'Center for Digital Humanities',
desc: 'Exploring the intersection of artificial intelligence and human psychology, with a focus on decision-making processes and behavioral modeling.',
tags: ['AI', 'Psychology', 'Neuroscience'],
progress: null,
},
{
type: 'Project',
badgeClass: 'pub-badge-request',
badgeIcon: 'fa-gavel',
badgeLabel: 'Data Collection',
statusClass: 'pub-badge-peer',
statusLabel: 'Law & Policy',
title: 'Digital Rights in the EU Framework',
lead: 'Dr. Elena Rostova',
updated: 'Updated 1 week ago',
center: 'Institute for Advanced European Studies',
desc: 'A comparative analysis of member state implementation of digital privacy directives and their impact on civil liberties across the EU.',
tags: ['Digital Rights', 'EU Law', 'Privacy'],
progress: 30,
},
];
const ResearchSearchResults = () => {
const [isSortOpen, setIsSortOpen] = useState(false);
const [selectedSort, setSelectedSort] = useState('Relevance');
return (
<div className="pub-results">
{/* Toolbar */}
<div className="pub-results-toolbar">
<p className="pub-results-count">
Showing <strong>110</strong> of <strong>340</strong> results
</p>
<div className="pub-sort-wrap">
<label>Sort by:</label>
<div className="pub-sort-dropdown">
<button
className={`pub-sort-dropdown-btn ${isSortOpen ? 'open' : ''}`}
onClick={() => setIsSortOpen(!isSortOpen)}
>
<span>{selectedSort}</span>
<i className="fa-solid fa-chevron-down"></i>
</button>
{isSortOpen && (
<div className="pub-sort-dropdown-menu">
{SORT_OPTIONS.map((opt) => (
<div
key={opt}
className={`pub-sort-dropdown-option ${selectedSort === opt ? 'selected' : ''}`}
onClick={() => { setSelectedSort(opt); setIsSortOpen(false); }}
>
{opt}
</div>
))}
</div>
)}
</div>
</div>
</div>
{/* Result cards */}
<div className="pub-card-list">
{RESULTS.map((item, idx) => (
<div key={idx} className="pub-card">
<div className="pub-card-top">
<h3 className="pub-card-title">
<a href="#">{item.title}</a>
</h3>
<div className="pub-badges">
<span className={`pub-badge ${item.badgeClass}`}>
<i className={`fa-solid ${item.badgeIcon}`}></i> {item.badgeLabel}
</span>
<span className="pub-badge pub-badge-peer">{item.statusLabel}</span>
</div>
</div>
<div className="pub-card-meta">
<div className="pub-meta-item">
<i className="fa-solid fa-user"></i>
<strong>{item.lead}</strong>
</div>
<div className="pub-meta-item">
<i className="fa-regular fa-clock"></i> {item.updated}
</div>
<div className="pub-meta-item">
<i className="fa-solid fa-building-columns"></i> {item.center}
</div>
</div>
<p className="pub-card-abstract">{item.desc}</p>
<div className="pub-keywords">
<span className="pub-keywords-label">Tags:</span>
{item.tags.map((tag) => (
<span key={tag} className="pub-keyword-tag">{tag}</span>
))}
</div>
{item.progress !== null && (
<div style={{ marginBottom: '1rem' }}>
<div className="flex justify-between text-xs mb-1" style={{ color: 'var(--pub-muted)' }}>
<span>Progress</span>
<span style={{ fontWeight: 600, color: 'var(--pub-text)' }}>{item.progress}%</span>
</div>
<div style={{ width: '100%', height: '6px', backgroundColor: 'var(--pub-bg)', borderRadius: '9999px' }}>
<div style={{ width: `${item.progress}%`, height: '6px', backgroundColor: 'var(--pub-blue)', borderRadius: '9999px' }}></div>
</div>
</div>
)}
<div className="pub-card-actions">
<button className="pub-action-btn pub-action-btn-primary">
<i className="fa-solid fa-arrow-right"></i> View Details
</button>
<button className="pub-action-btn pub-action-btn-secondary">
<i className="fa-regular fa-bookmark"></i> Save
</button>
</div>
</div>
))}
</div>
{/* Pagination */}
<div className="pub-pagination">
<button className="pub-page-btn" disabled>
<i className="fa-solid fa-arrow-left"></i> Previous
</button>
<div className="pub-page-numbers">
<button className="pub-page-num active">1</button>
<button className="pub-page-num">2</button>
<button className="pub-page-num">3</button>
<span className="pub-page-ellipsis">...</span>
<button className="pub-page-num">34</button>
</div>
<button className="pub-page-btn">
Next <i className="fa-solid fa-arrow-right"></i>
</button>
</div>
</div>
);
};
export default ResearchSearchResults;