'use client'; import { useState, useEffect } from 'react'; import Image from 'next/image'; import Header from "@/components/Header"; import Footer from "@/components/Footer"; import { dataStore } from '@/lib/dataStore'; import { categories, type NewsItem } from '@/data/news'; export default function News() { const [newsData, setNewsData] = useState([]); const [selectedCategory, setSelectedCategory] = useState('all'); const [selectedNews, setSelectedNews] = useState(null); useEffect(() => { setNewsData(dataStore.getNews()); }, []); const filteredNews = selectedCategory === 'all' ? newsData : newsData.filter(item => item.category === selectedCategory); const selectedNewsItem = newsData.find(item => item.id === selectedNews); return (
{/* Başlık */}

Haberler ve Duyurular

A2 Metro Hattı projesi ile ilgili güncel haberler, duyurular ve etkinlikler

{/* Kategori Filtreleri */}
{categories.map((category) => ( ))}
{/* Haber Grid */}
{filteredNews.map((item) => (
setSelectedNews(item.id)} className="bg-white rounded-2xl shadow-lg overflow-hidden cursor-pointer transform transition-all duration-300 hover:scale-105 hover:shadow-2xl" > {/* Görsel */}
{item.title}
{categories.find(c => c.id === item.category)?.name}
{/* İçerik */}
{item.date}

{item.title}

{item.summary}

{item.author}
))}
{/* Haber Bulunamadı */} {filteredNews.length === 0 && (
📰

Henüz Haber Yok

Bu kategoride henüz haber bulunmuyor.

)}
{/* Haber Detay Modal */} {selectedNewsItem && (
{/* Görsel */}
{selectedNewsItem.title}
{categories.find(c => c.id === selectedNewsItem.category)?.name}
{/* İçerik */}
{selectedNewsItem.date}
{selectedNewsItem.author}

{selectedNewsItem.title}

{selectedNewsItem.content}

{/* Etiketler */}
{selectedNewsItem.tags.map((tag, index) => ( #{tag} ))}
{/* Paylaş */}
Haberi Paylaş:
)}
); }