refactor(auth): merge the duplicate login form and localize the auth screens
Gitea Actions Runner Test / test-job (push) Successful in 1s
CI / check (push) Successful in 1m8s
CI / tests-integration (push) Successful in 1m53s
CI / tests-unit (push) Successful in 1m59s
CI / tests-ui (push) Successful in 2m42s
CI / preflight (push) Skipped
CI / deploy (push) Successful in 4m33s

`home-login-form.tsx` and `login-form.tsx` were two ~240-line near-identical
components. Delete the former and give `LoginForm` a `variant` prop:

- `variant="page"`   sr-only labels plus the register/forgot footer (/login)
- `variant="compact"` visible labels, no footer (homepage sidebar)

Field ids now come from `useId()`, so the two usages can never collide, and the
hardcoded "Show"/"Hide"/"Loading" strings are translated.

Localization of the login and register screens:

- `home-login-form.tsx` was entirely hardcoded English.
- `passwordStrength()` returned hardcoded "Weak"/"Fair"/"Good"/"Strong".
- `register.ts` returned only English strings. It now returns a
  locale-independent `code` next to the message, and the form renders
  `t(code)` with the English string as a fallback.
- Backfilled the new keys across all 25 locales, plus the login/register
  strings that were still English in most of them. `ar`, `fi` and `ja` had
  their entire login/register namespace in English and are now filled in.
  Locale parity stays at 0 missing keys, as `i18n:check` requires.

Copy that did not match the enforced rules: the UI advertised "min 8 chars"
(EN) / "min 6 tekens" (NL) while registration requires 12 characters plus an
uppercase, a lowercase, a digit and a special character. Corrected in every
locale. `password-reset.ts` enforced only 6 characters and is raised to 12 to
match registration.

Accessibility: `login-form.tsx` had no `<label>`, no `id` and no `required` on
any field. All three are now present, and error banners are announced with
`role="alert"`.

Adds `src/i18n/auth-messages.test.ts`, which asserts every `RegisterErrorCode`
resolves to a non-empty message in all 25 locales; verified it fails when a key
is removed. The existing register tests now also assert the error `code`.
This commit is contained in:
openhands committed 2026-10-04 18:50:23 +02:00
1 parent 3d828a61ab
commit 6bffc53779
33 files changed
+1756 -842

No files matched your search

+25 -2
View File
@@ -184,6 +184,7 @@ describe("register", () => {
expect(result).toEqual({
error: "Username must be at least 3 characters",
ok: false,
code: "usernameMinLength",
});
expect(state.insert).not.toHaveBeenCalled();
});
@@ -191,6 +192,7 @@ describe("register", () => {
it("rejects usernames containing characters outside the allowed set", async () => {
const result = await register(PREV, buildForm({ username: "bad name!" }));
expect(result.error).toContain("letters, numbers, underscore and hyphen");
expect(result.code).toBe("usernamePattern");
expect(state.insert).not.toHaveBeenCalled();
});
@@ -199,6 +201,7 @@ describe("register", () => {
expect(result).toEqual({
error: "Enter a valid email address",
ok: false,
code: "emailValid",
});
});
@@ -207,6 +210,7 @@ describe("register", () => {
expect(result).toEqual({
error: "Password must be at least 12 characters",
ok: false,
code: "passwordMinLength",
});
expect(state.insert).not.toHaveBeenCalled();
});
@@ -220,6 +224,7 @@ describe("register", () => {
}),
);
expect(result.error).toContain("uppercase");
expect(result.code).toBe("passwordUpper");
});
it("rejects passwords without a digit", async () => {
@@ -231,6 +236,7 @@ describe("register", () => {
}),
);
expect(result.error).toContain("digit");
expect(result.code).toBe("passwordDigit");
});
it("rejects passwords without a special character", async () => {
@@ -242,6 +248,7 @@ describe("register", () => {
}),
);
expect(result.error).toContain("special");
expect(result.code).toBe("passwordSpecial");
});
it("rejects mismatched password confirmations", async () => {
@@ -249,13 +256,18 @@ describe("register", () => {
PREV,
buildForm({ password_confirmation: "Different1" }),
);
expect(result).toEqual({ error: "Passwords do not match", ok: false });
expect(result).toEqual({
error: "Passwords do not match",
ok: false,
code: "passwordsMatch",
});
});
it("throttles sign-ups per IP", async () => {
state.rateLimit.mockResolvedValueOnce({ ok: false, retryAfter: 120 });
const result = await runValidRegistration();
expect(result.error).toContain("Too many sign-up attempts");
expect(result.code).toBe("rateLimited");
expect(state.insert).not.toHaveBeenCalled();
});
@@ -273,6 +285,7 @@ describe("register", () => {
expect(result).toEqual({
error: "Captcha verification failed. Please try again.",
ok: false,
code: "captchaFailed",
});
expect(state.verifyCaptcha).toHaveBeenCalledWith("token", "203.0.113.9");
expect(state.insert).not.toHaveBeenCalled();
@@ -290,6 +303,7 @@ describe("register", () => {
expect(result).toEqual({
error: "You must accept the terms and conditions to register.",
ok: false,
code: "termsRequired",
});
expect(state.insert).not.toHaveBeenCalled();
});
@@ -298,7 +312,11 @@ describe("register", () => {
state.checkVpn.mockResolvedValue({ blocked: true });
state.siteGet.mockResolvedValueOnce("Custom VPN message");
const result = await runValidRegistration();
expect(result).toEqual({ error: "Custom VPN message", ok: false });
expect(result).toEqual({
error: "Custom VPN message",
ok: false,
code: "vpnBlocked",
});
expect(state.insert).not.toHaveBeenCalled();
});
@@ -317,6 +335,7 @@ describe("register", () => {
state.countTotal = 2;
const result = await runValidRegistration();
expect(result.error).toContain("maximum number of accounts");
expect(result.code).toBe("maxAccountsPerIp");
expect(state.insert).not.toHaveBeenCalled();
});
@@ -340,6 +359,7 @@ describe("register", () => {
expect(result).toEqual({
error: "That username is already taken",
ok: false,
code: "usernameTaken",
});
expect(state.insert).not.toHaveBeenCalled();
});
@@ -350,6 +370,7 @@ describe("register", () => {
expect(result).toEqual({
error: "Registration is temporarily unavailable",
ok: false,
code: "unavailable",
});
expect(state.logger.warn).toHaveBeenCalledWith(
"Username uniqueness check failed during registration",
@@ -365,6 +386,7 @@ describe("register", () => {
expect(result).toEqual({
error: "That username is already taken",
ok: false,
code: "usernameTaken",
});
expect(state.logger.error).not.toHaveBeenCalled();
});
@@ -373,6 +395,7 @@ describe("register", () => {
state.insert.mockRejectedValueOnce(new Error("db exploded"));
const result = await runValidRegistration();
expect(result.error).toContain("Could not create the account");
expect(result.code).toBe("createFailed");
expect(state.logger.error).toHaveBeenCalledWith(
"Account creation failed",
expect.objectContaining({ message: "db exploded" }),