-
-
Notifications
You must be signed in to change notification settings - Fork 738
Description
Describe the bug
On the Dashboard page, the "Daily Active Users" section has a native date picker (<input type="date">). When clicking the browser's native Clear button on this date picker, the date state is set to an empty string "", which causes the API request to become:
GET /api/dashboard/users/active?date=
The backend koaGuard validates date with string().regex(dateRegEx).optional() β .optional() allows undefined but not empty string "". This results in a guard.invalid_input error (400), and the page crashes with an error screen showing:
θ―·ζ±δΈ query ζ ζ
Error in key path "date": (invalid_string) Invalid
Additional note: Directly refreshing the browser on the error page does not log the user out (the page recovers normally). However, clicking the "Retry" (ιθ―) button on the error screen causes the user to be logged out. This suggests the retry button re-triggers the request with the stale empty date state, and the resulting error is handled by a global error handler that forces a session logout.
Affected environments
- Self-hosted (v1.37.1, Docker) β confirmed reproducible
- Logto Cloud (cloud.logto.io) β confirmed reproducible
This issue exists in both self-hosted and Logto's official cloud version.
Expected behavior
Clicking the "Clear" button on the date picker should either:
- Reset the date to today (default behavior), or
- Omit the
datequery parameter so the backend uses its default
It should not cause an API error or crash the page.
How to reproduce?
- Log in to the Admin Console (self-hosted or Logto Cloud)
- Navigate to the Dashboard page
- Click the date picker in the "Daily Active Users" section
- Click the Clear (ζΈ ι€) button at the bottom of the date picker
- Observe: API returns 400 error, page crashes with error screen
- Click the "Retry" (ιθ―) button on the error screen
- Observe: User is logged out
Note: Refreshing the browser instead of clicking "Retry" will recover the page without logging out.
Root cause
In packages/console/src/pages/Dashboard/index.tsx:
const handleDateChange: ChangeEventHandler<HTMLInputElement> = (event) => {
setDate(event.target.value); // value is "" when cleared
};The empty string is passed directly into the SWR request URL api/dashboard/users/active?date=${date}, and backend regex validation (dateRegEx = /^\d{4}(-\d{2}){2}/) rejects the empty string.
Suggested fix
const handleDateChange: ChangeEventHandler<HTMLInputElement> = (event) => {
const { value } = event.target;
setDate(value || format(Date.now(), 'yyyy-MM-dd'));
};Environment
Self-hosted v1.37.1 & Logto Cloud
Screenshots
