Update src/components/LanguageSwitcher.tsx

src/components/LanguageSwitcher.tsx

@@ -2,24 +2,8 @@
 
 import { useRouter, usePathname } from 'next/navigation';
 import { i18n, Locale } from '@/lib/i18nConfig';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; // Assuming shadcn-ui select component
 import { useState, useEffect } from 'react';
 
-// Placeholder for shadcn-ui select if not available:
-// Replace with your actual UI kit's Select/Dropdown or a simple <select> element.
-// If you don't have shadcn-ui, you might need to create these components or adjust imports.
-// For example, a basic HTML select:
-/*
-const BasicSelect = ({ value, onChange, options, placeholder }) => (
-  <select value={value} onChange={(e) => onChange(e.target.value)}>
-    {placeholder && <option value="" disabled>{placeholder}</option>}
-    {options.map((option) => (
-      <option key={option.value} value={option.value}>{option.label}</option>
-    ))}
-  </select>
-);
-*/
-
 interface LanguageSwitcherProps {
   currentLocale: Locale;
 }
@@ -47,17 +31,16 @@ export function LanguageSwitcher({ currentLocale }: LanguageSwitcherProps) {
   };
 
   return (
-    <Select onValueChange={onSelectChange} defaultValue={currentLocale}>
-      <SelectTrigger className="w-[100px] bg-background-accent text-foreground">
-        <SelectValue placeholder="Language" />
-      </SelectTrigger>
-      <SelectContent className="bg-card text-foreground">
-        {i18n.locales.map((locale) => (
-          <SelectItem key={locale} value={locale}>
-            {locale.toUpperCase()}
-          </SelectItem>
-        ))}
-      </SelectContent>
-    </Select>
+    <select
+      onChange={(e) => onSelectChange(e.target.value as Locale)}
+      value={currentLocale}
+      className="w-[100px] bg-background-accent text-foreground p-2 rounded-md border border-gray-300 dark:border-gray-700"
+    >
+      {i18n.locales.map((locale) => (
+        <option key={locale} value={locale}>
+          {locale.toUpperCase()}
+        </option>
+      ))}
+    </select>
   );
 }