Polish UI, harden company creation, and add error pages

job-tracker-ui/src/pages/ResetPasswordPage.tsx

@@ -6,6 +6,7 @@ import { useLocation, useNavigate } from "react-router-dom";
 
 import { api } from "../api";
 import { useToast } from "../toast";
+import { useI18n } from "../i18n/I18nProvider";
 
 function useQuery() {
   const { search } = useLocation();
@@ -14,6 +15,7 @@ function useQuery() {
 
 export default function ResetPasswordPage() {
   const { toast } = useToast();
+  const { t } = useI18n();
   const navigate = useNavigate();
   const q = useQuery();
 
@@ -37,10 +39,10 @@ export default function ResetPasswordPage() {
     >
       <Paper sx={{ width: "min(520px, 100%)", p: 3 }}>
         <Typography variant="h5" sx={{ fontWeight: 900, mb: 0.5 }}>
-          Reset password
+          {t("resetPasswordTitle")}
         </Typography>
         <Typography sx={{ color: "text.secondary", mb: 2 }}>
-          Set a new password for your account.
+          {t("resetPasswordBody")}
         </Typography>
 
         <Box
@@ -48,33 +50,33 @@ export default function ResetPasswordPage() {
           onSubmit={(e) => {
             e.preventDefault();
             if (!email || !token) {
-              toast("Missing email/token in link.", "error");
+              toast(t("missingResetLinkInfo"), "error");
               return;
             }
             setLoading(true);
             api
               .post("/auth/reset-password", { email, token, newPassword })
               .then(() => {
-                toast("Password reset. Please sign in.", "success");
+                toast(t("passwordResetSuccess"), "success");
                 navigate("/login", { replace: true });
               })
               .catch((e2: any) => {
-                const msg = e2?.response?.data || e2?.message || "Reset failed.";
+                const msg = e2?.response?.data || e2?.message || t("resetFailed");
                 toast(String(msg), "error");
               })
               .finally(() => setLoading(false));
           }}
           sx={{ display: "flex", flexDirection: "column", gap: 1.5 }}
         >
-          <TextField label="Email" value={email} disabled fullWidth />
-          <TextField label="New password" type="password" value={newPassword} onChange={(e) => setNewPassword(e.target.value)} fullWidth />
+          <TextField label={t("profileEmail")} value={email} disabled fullWidth />
+          <TextField label={t("profileNewPassword")} type="password" value={newPassword} onChange={(e) => setNewPassword(e.target.value)} fullWidth />
 
           <Box sx={{ display: "flex", justifyContent: "flex-end", gap: 1, mt: 1 }}>
             <Button type="button" variant="outlined" onClick={() => navigate("/login")} disabled={loading}>
-              Back to login
+              {t("backToLogin")}
             </Button>
             <Button type="submit" variant="contained" disabled={loading}>
-              Update password
+              {t("updatePassword")}
             </Button>
           </Box>
         </Box>
@@ -82,4 +84,3 @@ export default function ResetPasswordPage() {
     </Box>
   );
 }
-