2025-07-02 11:47:23 +05:30

125 lines
4.1 KiB
TypeScript

'use client';
import Layout from '@/components/layout/Layout';
import { tamilculture } from '@/utility/constant.utils';
import Link from 'next/link';
import { useSearchParams } from 'next/navigation';
interface InnerDataItem {
title: string;
image: string;
[key: string]: string | undefined;
}
interface EventData {
image: string;
title: string;
desc?: string;
date?: string;
slug: string;
link?: string;
button?: string;
InnerData?: InnerDataItem[];
}
export default function TamilLanguageData() {
const searchParams = useSearchParams();
const slug = searchParams.get('slug');
const allEvents: EventData[] = Object.values(tamilculture).flat();
const matchedEvent = allEvents.find((event) => event.slug === slug);
return (
<Layout headerStyle={1} footerStyle={1}>
<div
className="inner-page-header"
style={{ backgroundImage: 'url(/assets/img/bg/header-bg11.png)' }}
>
<div className="container">
<div className="row">
<div className="col-lg-6 m-auto">
<div className="heading1 text-center">
<h1>TAMIL LANGUAGE</h1>
<div className="space20" />
<Link href="/">
Home <i className="fa-solid fa-angle-right" />{' '}
<span>TAMIL LANGUAGE</span>
</Link>
</div>
</div>
</div>
</div>
</div>
<div className="about7-section-area sp1">
<div className="container">
{matchedEvent?.InnerData?.map((inner, index) => (
<div key={index}>
<div className="row justify-content-center mb-5">
<div className="col-lg-10 text-center">
<h2 className="text-anime-style-3">{inner.title}</h2>
</div>
</div>
{inner.image && (
<div className="row justify-content-center mb-4">
<div className="col-lg-10">
<div className="image-anime reveal">
<img
src={inner.image}
alt={inner.title}
style={{ width: '100%', height: '500px', objectFit: 'cover' }}
/>
</div>
</div>
</div>
)}
<div className="row justify-content-center">
<div className="col-lg-10">
{Object.entries(inner)
.filter(
([key, value]) =>
key.startsWith('para') && typeof value === 'string' && value.trim() !== ''
)
.sort(([a], [b]) => a.localeCompare(b, undefined, { numeric: true }))
.map(([_, value], i) => (
<p
key={i}
className="mb-4"
style={{ lineHeight: '1.8', fontSize: '1.1rem' }}
>
{value}
</p>
))}
</div>
</div>
<div className="team6-section-area mt-5">
<div className="container">
<div className="row justify-content-end">
<div className="col-lg-5 col-md-6" data-aos="fade-up" data-aos-duration={1200}>
<div className="content-area">
<h4>HISTORY OF TAMIL LITERATURE</h4>
<div className="space12" />
<p>by Mu. Varadarajan, (Translated from Tamil by E.Sa. Viswanathan) Sahitya Akademi, New Delhi, 1988, p. 1- 17</p>
</div>
</div>
</div>
</div>
</div>
</div>
))}
{!matchedEvent?.InnerData?.length && (
<div className="row justify-content-center">
<div className="col-lg-10 text-center">
<p className="text-muted">No detailed content found for this event.</p>
</div>
</div>
)}
</div>
</div>
</Layout>
);
}