Initial deploy

components/language-toggle.tsx

@@ -0,0 +1,30 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { portfolioContent, type Language } from "@/data/portfolio";
+
+export function LanguageToggle({ language }: { language: Language }) {
+  const pathname = usePathname() ?? `/${language}`;
+  const nextLanguage = language === "en" ? "ar" : "en";
+  const { languageLabel, languageToggleAriaLabel } = portfolioContent[language].ui;
+  const segments = pathname.split("/").filter(Boolean);
+
+  if (segments[0] === "en" || segments[0] === "ar") {
+    segments[0] = nextLanguage;
+  } else {
+    segments.unshift(nextLanguage);
+  }
+
+  const nextPath = `/${segments.join("/")}`;
+
+  return (
+    <Link
+      href={nextPath}
+      className="control-pill"
+      aria-label={languageToggleAriaLabel}
+    >
+      {languageLabel}
+    </Link>
+  );
+}