fix: update email display in UI after email change

The OIDC session token retains the old email after a Logto email
change. Now the server returns the new email in the response and
the frontend optimistically updates the auth cache.

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

src/client/hooks/useAccount.ts

@@ -20,9 +20,13 @@ export function useChangeEmail() {
 	const queryClient = useQueryClient();
 	return useMutation({
 		mutationFn: (data: { newEmail: string }) =>
-			apiPost<{ ok: boolean }>("/api/account/email", data),
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["auth"] });
+			apiPost<{ ok: boolean; email: string }>("/api/account/email", data),
+		onSuccess: (_data, variables) => {
+			// Update auth cache with new email since the OIDC session still has the old one
+			queryClient.setQueryData(["auth"], (old: any) => {
+				if (!old?.user) return old;
+				return { ...old, user: { ...old.user, email: variables.newEmail } };
+			});
 		},
 	});
 }

src/server/routes/account.ts

@@ -70,7 +70,7 @@ app.post("/email", zValidator("json", changeEmailSchema), async (c) => {
 
 	const logtoSub = await getLogtoSub(db, userId);
 	await logtoClient.updateEmail(logtoSub, newEmail);
-	return c.json({ ok: true });
+	return c.json({ ok: true, email: newEmail });
 });
 
 // ── Has Password ────────────────────────────────────────────────────