Files
full_encoach_platform/frontend/src/pages/ForgotPassword.tsx
Yamen Ahmad e1f059069f feat(i18n,rtl): full Arabic localization + RTL sweep across all layouts
Frontend
- i18n: install tailwindcss-rtl, Cairo font, RTL-aware direction in index.css.
- Language toggle: localize aria-label / menu label, persist choice, update
  document dir synchronously.
- Sidebar: add `side` prop so the drawer pins to the right in RTL; wire up
  AdminLmsLayout, RoleLayout (student/teacher) and AppSidebar to pass
  side = i18n.dir() === 'rtl' ? 'right' : 'left'.
- AdminLmsLayout: convert every nav item from hard-coded title to titleKey,
  translate group labels (incl. the collapsible Training), breadcrumbs,
  user menu (Profile / Settings / Logout), help button and toggle aria
  labels; replace physical mr-/right- utilities with logical me-/end-.
- AI components (AiTipBanner, AiInsightsPanel, AiAlertBanner, AiSearchBar,
  AiAssistantDrawer): apply dir="auto" at the container level, localize
  titles, loading / error / empty states.
- Dashboards (admin / student / teacher): wrap numeric values in <bdi>,
  localize dates via ar-EG, fix flex direction for KPI and assignment cards.
- UI primitives (breadcrumb, calendar, carousel, dropdown-menu, menubar,
  context-menu, pagination, sidebar): flip chevrons in RTL via a scoped
  CSS rule, swap pl-/pr-/ml-/mr- for ps-/pe-/ms-/me-.
- Add logical-direction helpers and bidirectional isolation classes.

Locales
- Expand en.ts and ar.ts with full `nav`, `sidebarGroup`, `breadcrumb`,
  `userMenu`, `chrome`, `ai`, and dashboard key sets; keep key parity.

API client
- `api-client.ts` reads the active language from localStorage/i18n and sends
  `Accept-Language` on every request so the backend can localize AI output.

Backend (encoach_ai)
- openai_service: add _LANGUAGE_NAMES, normalize_language, language-aware
  system prompt injection for every OpenAI call.
- coach_service + controllers (coach_controller, ai_controller): thread
  the requested language from headers / user locale down to OpenAIService.
- ai_feedback: fix latent registry error by pointing course_id at op.course
  instead of the non-existent encoach.course.

Other
- .gitignore: ignore runtime odoo logs and local caches.

Made-with: Cursor
2026-04-19 18:13:16 +04:00

60 lines
2.5 KiB
TypeScript

import { useState } from "react";
import { Link } from "react-router-dom";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { GraduationCap, ArrowLeft, CheckCircle } from "lucide-react";
export default function ForgotPassword() {
const [sent, setSent] = useState(false);
return (
<div className="min-h-screen flex items-center justify-center bg-background p-4">
<div className="w-full max-w-md">
<div className="flex items-center justify-center gap-2 mb-8">
<div className="h-10 w-10 rounded-xl bg-primary flex items-center justify-center">
<GraduationCap className="h-6 w-6 text-primary-foreground" />
</div>
<h1 className="text-2xl font-bold tracking-tight">EnCoach</h1>
</div>
<Card className="shadow-lg border-0 bg-card">
<CardHeader className="text-center pb-4">
{sent ? (
<>
<div className="mx-auto mb-2 h-12 w-12 rounded-full bg-success/10 flex items-center justify-center">
<CheckCircle className="h-6 w-6 text-success" />
</div>
<CardTitle className="text-xl">Check your email</CardTitle>
<CardDescription>We've sent a password reset link to your email address.</CardDescription>
</>
) : (
<>
<CardTitle className="text-xl">Forgot password?</CardTitle>
<CardDescription>Enter your email and we'll send you a reset link.</CardDescription>
</>
)}
</CardHeader>
<CardContent>
{!sent ? (
<form onSubmit={(e) => { e.preventDefault(); setSent(true); }} className="space-y-4">
<div className="space-y-2">
<Label htmlFor="email">Email</Label>
<Input id="email" type="email" placeholder="your@email.com" />
</div>
<Button type="submit" className="w-full">Send Reset Link</Button>
</form>
) : null}
<div className="mt-6 text-center">
<Link to="/login" className="inline-flex items-center gap-1 text-sm text-primary hover:underline">
<ArrowLeft className="h-3 w-3 rtl:rotate-180" /> Back to sign in
</Link>
</div>
</CardContent>
</Card>
</div>
</div>
);
}