From 18a81871ba08e5faf964b29ca82fc2ba4a0c7a60 Mon Sep 17 00:00:00 2001
From: hzt <3061613175@qq.com>
Date: Fri, 20 Feb 2026 12:11:46 +0800
Subject: [PATCH] fix: use error detail for login error message translation

The login form displayed the wrong error message for incorrect
credentials because it read error.message (HTTP status text like
"Unauthorized") instead of error.detail (the actual error reason
like "credentialsSignin").

Updated the catch block in LoginForm to check for ClientError.detail
first, falling back to Error.message when detail is not available.

Fixes #2787
---
 frontend/src/components/LoginForm.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/LoginForm.tsx b/frontend/src/components/LoginForm.tsx
index bec8d3eb41..f2b526a9bf 100644
--- a/frontend/src/components/LoginForm.tsx
+++ b/frontend/src/components/LoginForm.tsx
@@ -8,6 +8,8 @@ import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import Translator, { useTranslation } from 'components/i18n/Translator';
 
+import { ClientError } from '@chainlit/react-client';
+
 import Alert from './Alert';
 import { ProviderButton } from './ProviderButton';
 
@@ -63,7 +65,9 @@ export function LoginForm({
     try {
       await onPasswordSignIn(data.email, data.password, callbackUrl);
     } catch (err) {
-      if (err instanceof Error) {
+      if (err instanceof ClientError && err.detail) {
+        setErrorState(err.detail);
+      } else if (err instanceof Error) {
         setErrorState(err.message);
       }
     } finally {