Phase 3-4: Goals AI planner, Team tasks, Push notifications, i18n (CZ/HE/RU/UA)

- Goals CRUD API + AI study plan generator + progress reports
- Goals frontend page with progress bars
- Team tasks: assign, transfer, collaborate endpoints
- Push notifications: web-push, VAPID, subscribe/send
- i18n: 4 languages (cs, he, ru, ua) translation files
- notifications.js + goals.js routes

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/tasks/app/settings/page.tsx

@@ -4,19 +4,14 @@ import { useState, useEffect } from "react";
 import { useRouter } from "next/navigation";
 import { useAuth } from "@/lib/auth";
 import { useTheme } from "@/components/ThemeProvider";
-
-const LANGUAGES = [
-  { code: "cs", label: "Čeština", flag: "🇨🇿" },
-  { code: "he", label: "עברית", flag: "🇮🇱" },
-  { code: "ru", label: "Русский", flag: "🇷🇺" },
-  { code: "ua", label: "Українська", flag: "🇺🇦" },
-];
+import { useTranslation, LOCALES } from "@/lib/i18n";
+import type { Locale } from "@/lib/i18n";
 
 export default function SettingsPage() {
   const { token, user, logout } = useAuth();
   const { theme, toggleTheme } = useTheme();
+  const { t, locale, setLocale } = useTranslation();
   const router = useRouter();
-  const [language, setLanguage] = useState("cs");
   const [notifications, setNotifications] = useState({
     push: true,
     email: false,
@@ -31,8 +26,6 @@ export default function SettingsPage() {
     }
     // Load saved preferences
     if (typeof window !== "undefined") {
-      const savedLang = localStorage.getItem("taskteam_language");
-      if (savedLang) setLanguage(savedLang);
       const savedNotifs = localStorage.getItem("taskteam_notifications");
       if (savedNotifs) {
         try {
@@ -46,7 +39,6 @@ export default function SettingsPage() {
 
   function handleSave() {
     if (typeof window !== "undefined") {
-      localStorage.setItem("taskteam_language", language);
       localStorage.setItem("taskteam_notifications", JSON.stringify(notifications));
     }
     setSaved(true);
@@ -62,17 +54,17 @@ export default function SettingsPage() {
 
   return (
     <div className="max-w-lg mx-auto space-y-6 px-4 pb-24 sm:pb-8">
-      <h1 className="text-xl font-bold">Nastavení</h1>
+      <h1 className="text-xl font-bold">{t("settings.title")}</h1>
 
       {/* Profile section */}
       <div className="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-2xl p-5">
-        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">Profil</h2>
+        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">{t("settings.profile")}</h2>
         <div className="flex items-center gap-4">
           <div className="w-14 h-14 bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300 rounded-full flex items-center justify-center text-xl font-bold">
             {(user?.name || user?.email || "?").charAt(0).toUpperCase()}
           </div>
           <div className="min-w-0">
-            <p className="font-semibold text-lg">{user?.name || "Uživatel"}</p>
+            <p className="font-semibold text-lg">{user?.name || t("settings.user")}</p>
             <p className="text-sm text-muted truncate">{user?.email}</p>
           </div>
         </div>
@@ -80,7 +72,7 @@ export default function SettingsPage() {
 
       {/* Appearance */}
       <div className="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-2xl p-5">
-        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">Vzhled</h2>
+        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">{t("settings.appearance")}</h2>
 
         {/* Theme toggle */}
         <div className="flex items-center justify-between py-3">
@@ -95,7 +87,7 @@ export default function SettingsPage() {
               </svg>
             )}
             <span className="text-sm font-medium">
-              {theme === "dark" ? "Tmavý režim" : "Světlý režim"}
+              {theme === "dark" ? t("settings.dark") : t("settings.light")}
             </span>
           </div>
           <button
@@ -103,7 +95,7 @@ export default function SettingsPage() {
             className={`relative w-12 h-7 rounded-full transition-colors ${
               theme === "dark" ? "bg-blue-600" : "bg-gray-300"
             }`}
-            aria-label="Přepnout téma"
+            aria-label={t("common.toggleTheme")}
           >
             <div
               className={`absolute top-0.5 w-6 h-6 bg-white rounded-full shadow transition-transform ${
@@ -116,14 +108,14 @@ export default function SettingsPage() {
 
       {/* Language */}
       <div className="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-2xl p-5">
-        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">Jazyk</h2>
+        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">{t("settings.language")}</h2>
         <div className="grid grid-cols-2 gap-2">
-          {LANGUAGES.map((lang) => (
+          {LOCALES.map((lang) => (
             <button
               key={lang.code}
-              onClick={() => setLanguage(lang.code)}
+              onClick={() => setLocale(lang.code as Locale)}
               className={`flex items-center gap-2 px-4 py-3 rounded-xl text-sm font-medium transition-all ${
-                language === lang.code
+                locale === lang.code
                   ? "bg-blue-600 text-white shadow-md"
                   : "bg-gray-100 dark:bg-gray-800 hover:bg-gray-200 dark:hover:bg-gray-700"
               }`}
@@ -137,13 +129,13 @@ export default function SettingsPage() {
 
       {/* Notifications */}
       <div className="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-2xl p-5">
-        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">Oznámení</h2>
+        <h2 className="text-sm font-semibold text-muted uppercase tracking-wide mb-4">{t("settings.notifications")}</h2>
         <div className="space-y-1">
           {[
-            { key: "push" as const, label: "Push oznámení" },
-            { key: "email" as const, label: "E-mailová oznámení" },
-            { key: "taskReminders" as const, label: "Připomenutí úkolů" },
-            { key: "dailySummary" as const, label: "Denní souhrn" },
+            { key: "push" as const, label: t("settings.push") },
+            { key: "email" as const, label: t("settings.email") },
+            { key: "taskReminders" as const, label: t("settings.taskReminders") },
+            { key: "dailySummary" as const, label: t("settings.dailySummary") },
           ].map((item) => (
             <div key={item.key} className="flex items-center justify-between py-3">
               <span className="text-sm font-medium">{item.label}</span>
@@ -157,7 +149,7 @@ export default function SettingsPage() {
                 className={`relative w-12 h-7 rounded-full transition-colors ${
                   notifications[item.key] ? "bg-blue-600" : "bg-gray-300 dark:bg-gray-600"
                 }`}
-                aria-label={`Přepnout ${item.label}`}
+                aria-label={item.label}
               >
                 <div
                   className={`absolute top-0.5 w-6 h-6 bg-white rounded-full shadow transition-transform ${
@@ -179,7 +171,7 @@ export default function SettingsPage() {
             : "bg-blue-600 hover:bg-blue-700 text-white"
         }`}
       >
-        {saved ? "Uloženo!" : "Uložit nastavení"}
+        {saved ? t("settings.saved") : t("settings.save")}
       </button>
 
       {/* Logout */}
@@ -187,7 +179,7 @@ export default function SettingsPage() {
         onClick={handleLogout}
         className="w-full py-3 rounded-xl font-medium border border-red-300 dark:border-red-800 text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors"
       >
-        Odhlásit se
+        {t("auth.logout")}
       </button>
 
       {/* App info */}