expo and timetable pages

src/app/[locale]/ajakava/page.tsx

@@ -1,77 +1,27 @@
-"use client";
-
-import { useState } from "react";
 import { vipnagorgialla } from "@/components/Vipnagorgialla";
-import { scheduleData } from "@/data/timetable";
-import SectionDivider from "@/components/SectionDivider";
-import { useTranslations } from "next-intl";
+import { getTranslations, setRequestLocale } from "next-intl/server";
 
-const tabs = Object.keys(scheduleData);
-
-export default function Timetable() {
-  const [activeTab, setActiveTab] = useState(tabs[0]);
-  const schedule = scheduleData[activeTab];
-  const t = useTranslations();
+export default async function Timetable({
+  params,
+}: {
+  params: Promise<{ locale: string }>;
+}) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+  const t = await getTranslations({ locale });
 
   return (
-    <div>
-      <div className="flex flex-col min-h-[90vh] m-6 mt-16 md:m-16">
-        <h1
-          className={`text-4xl md:text-5xl lg:text-6xl ${vipnagorgialla.className} font-bold italic uppercase text-[#2A2C3F] dark:text-[#EEE5E5] mt-8 md:mt-16 mb-8`}
-        >
-          {t("schedule.title")}
-        </h1>
-
-        {/* Tab menu */}
-        <div className="flex gap-4 mb-8 flex-wrap">
-          {tabs.map((tab) => (
-            <button
-              key={tab}
-              onClick={() => setActiveTab(tab)}
-              className={`${vipnagorgialla.className} cursor-pointer uppercase italic px-4 py-2 text-lg font-semibold ${
-                activeTab === tab
-                  ? "bg-[#00A3E0] text-white"
-                  : "bg-[#007CAB] dark:bg-[#007CAB] text-[#EEE5E5] hover:bg-[#00A3E0] dark:hover:bg-[#007CAB]"
-              } transition-colors`}
-            >
-              {t(`schedule.${tab}`)}
-            </button>
-          ))}
-        </div>
-
-        {/* Schedule entries */}
-        <div className="space-y-6">
-          {schedule.map((item, idx) => (
-            <div
-              key={idx}
-              className="border-l-3 border-[#007CAB] pl-4 flex flex-col sm:flex-row flex-wrap gap-2 sm:gap-5 items-stretch"
-            >
-              <div
-                className={`${vipnagorgialla.className} md:w-[180px] w-30 text-[#00A3E0] text-3xl md:text-4xl font-bold italic flex-shrink-0 flex items-center sm:justify-center`}
-              >
-                {item.time}
-              </div>
-              <div className="flex-1 flex flex-col justify-center min-w-0 sm:min-h-[120px]">
-                <div
-                  className={`${vipnagorgialla.className} text-2xl md:text-3xl italic font-bold text-[#2A2C3F] dark:text-[#EEE5E5] text-balance`}
-                >
-                  {t(item.titleKey)}
-                </div>
-                {item.description && (
-                  <div className="text-xl md:text-2xl text-[#938BA1] dark:text-[#938BA1] text-balance">
-                    {item.description}
-                  </div>
-                )}
-                <div className="text-xl md:text-2xl text-[#938BA1] dark:text-[#938BA1] text-balance">
-                  {t(item.locationKey)}
-                </div>
-              </div>
-            </div>
-          ))}
-        </div>
-      </div>
-
-      <SectionDivider />
+    <div className="bg-[#0E0F19] min-h-screen flex flex-col items-center justify-center">
+      <h1
+        className={`${vipnagorgialla.className} font-bold italic text-4xl md:text-5xl text-[#EEE5E5] uppercase mb-4`}
+      >
+        {t("schedule.title")}
+      </h1>
+      <p
+        className={`${vipnagorgialla.className} font-bold italic text-5xl md:text-7xl text-[#EEE5E5] uppercase`}
+      >
+        {t("schedule.comingSoon")}
+      </p>
     </div>
   );
 }