From ccb5c172ae10e7e01338d0edb416f8c440c03af1 Mon Sep 17 00:00:00 2001
From: Berkay <karatay.berkay@gmail.com>
Date: Mon, 28 Jul 2025 19:19:13 +0300
Subject: [PATCH] language i18n added and tested for server and client side

---
 .../[locale]/(protected)/dashboard/page.tsx    |  3 ---
 .../app/[locale]/(protected)/office/page.tsx   |  3 +++
 .../app/[locale]/(protected)/venue/page.tsx    |  3 +++
 .../src/components/LocaleSwitcherClient.tsx    | 18 +++++++++++++-----
 .../src/components/LocaleSwitcherServer.tsx    | 18 ++++++++++++------
 5 files changed, 31 insertions(+), 14 deletions(-)
 delete mode 100644 ServicesFrontEnd/frontend/src/app/[locale]/(protected)/dashboard/page.tsx
 create mode 100644 ServicesFrontEnd/frontend/src/app/[locale]/(protected)/office/page.tsx
 create mode 100644 ServicesFrontEnd/frontend/src/app/[locale]/(protected)/venue/page.tsx

diff --git a/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/dashboard/page.tsx b/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/dashboard/page.tsx
deleted file mode 100644
index 31245da..0000000
--- a/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/dashboard/page.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function DashboardPage() {
-  return <div></div>;
-}
diff --git a/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/office/page.tsx b/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/office/page.tsx
new file mode 100644
index 0000000..1944a65
--- /dev/null
+++ b/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/office/page.tsx
@@ -0,0 +1,3 @@
+export default function OfficePage() {
+  return <div></div>;
+}
diff --git a/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/venue/page.tsx b/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/venue/page.tsx
new file mode 100644
index 0000000..8ca801a
--- /dev/null
+++ b/ServicesFrontEnd/frontend/src/app/[locale]/(protected)/venue/page.tsx
@@ -0,0 +1,3 @@
+export default function VenuePage() {
+  return <div></div>;
+}
diff --git a/ServicesFrontEnd/frontend/src/components/LocaleSwitcherClient.tsx b/ServicesFrontEnd/frontend/src/components/LocaleSwitcherClient.tsx
index 3fad438..b6b2d6e 100644
--- a/ServicesFrontEnd/frontend/src/components/LocaleSwitcherClient.tsx
+++ b/ServicesFrontEnd/frontend/src/components/LocaleSwitcherClient.tsx
@@ -6,6 +6,12 @@ import { useTranslations } from 'next-intl';
 import { useParams } from 'next/navigation';
 import { useState } from 'react';
 
+// Map locales to flag emojis
+const flagEmojis: Record<Locale, string> = {
+    en: '🇬🇧',
+    tr: '🇹🇷'
+};
+
 type Props = {
     className?: string;
 };
@@ -37,12 +43,13 @@ export default function LocaleSwitcherClient({ className = '' }: Props) {
             <div>
                 <button
                     type="button"
-                    className="inline-flex justify-between items-center w-24 rounded-md border border-gray-300 px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+                    className="inline-flex justify-center items-center w-12 h-8 rounded-md border border-gray-300 px-2 py-1 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
                     onClick={() => setIsOpen(!isOpen)}
                     aria-expanded={isOpen}
                     aria-haspopup="true"
+                    title={currentLocale.toUpperCase()}
                 >
-                    <span>{currentLocale.toUpperCase()}</span>
+                    <span className="text-lg">{flagEmojis[currentLocale as Locale]}</span>
                     <svg className="-mr-1 ml-2 h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                         <path fillRule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clipRule="evenodd" />
                     </svg>
@@ -51,7 +58,7 @@ export default function LocaleSwitcherClient({ className = '' }: Props) {
 
             {isOpen && (
                 <div
-                    className="origin-top-right  mt-2 w-24 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none z-10"
+                    className="origin-top-right mt-2 w-12 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none z-10"
                     role="menu"
                     aria-orientation="vertical"
                     tabIndex={-1}
@@ -61,10 +68,11 @@ export default function LocaleSwitcherClient({ className = '' }: Props) {
                             <button
                                 key={lang}
                                 onClick={() => handleLocaleChange(lang)}
-                                className="block w-full text-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
+                                className="w-full text-center px-2 py-1 text-lg hover:bg-gray-100 flex items-center justify-center"
                                 role="menuitem"
+                                title={lang.toUpperCase()}
                             >
-                                {lang.toUpperCase()}
+                                {flagEmojis[lang]}
                             </button>
                         ))}
                     </div>
diff --git a/ServicesFrontEnd/frontend/src/components/LocaleSwitcherServer.tsx b/ServicesFrontEnd/frontend/src/components/LocaleSwitcherServer.tsx
index 46a4593..8c10203 100644
--- a/ServicesFrontEnd/frontend/src/components/LocaleSwitcherServer.tsx
+++ b/ServicesFrontEnd/frontend/src/components/LocaleSwitcherServer.tsx
@@ -1,7 +1,12 @@
 import { Link } from '@/i18n/navigation';
 import { locales, Locale } from '@/i18n/locales';
 import { getTranslations } from 'next-intl/server';
-import { headers } from 'next/headers';
+
+// Map locales to flag emojis
+const flagEmojis: Record<Locale, string> = {
+    en: '🇬🇧',
+    tr: '🇹🇷'
+};
 
 type Props = {
     locale: string;
@@ -37,23 +42,24 @@ export default async function LocaleSwitcherServer({ locale, className = '', pat
     return (
         <div className={`relative inline-block ${className}`}>
             <div className="group">
-                <button type="button" className="inline-flex justify-between items-center w-24 rounded-md border border-gray-300 px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
-                    <span>{locale.toUpperCase()}</span>
+                <button type="button" className="inline-flex justify-center items-center w-12 h-8 rounded-md border border-gray-300 px-2 py-1 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500" title={locale.toUpperCase()}>
+                    <span className="text-lg">{flagEmojis[locale as Locale]}</span>
                     <svg className="-mr-1 ml-2 h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                         <path fillRule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clipRule="evenodd" />
                     </svg>
                 </button>
-                <div className="hidden group-hover:block  mt-2 w-24 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none z-10">
+                <div className="hidden group-hover:block mt-2 w-12 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none z-10">
                     <div className="py-1" role="menu" aria-orientation="vertical">
                         {availableLocales.map((lang) => (
                             <Link
                                 key={lang}
                                 href={pathWithoutLocale}
                                 locale={lang}
-                                className="block px-4 py-2 text-sm text-center text-gray-700 hover:bg-gray-100 hover:text-gray-900"
+                                className="flex items-center justify-center px-2 py-1 text-lg hover:bg-gray-100"
                                 role="menuitem"
+                                title={lang.toUpperCase()}
                             >
-                                {lang.toUpperCase()}
+                                {flagEmojis[lang]}
                             </Link>
                         ))}
                     </div>