adminjs
adminjs copied to clipboard
[Bug]: setCurrentAdmin does not update theme value in session after API response
๐ Contact Details
No response
๐ What happened?
Iโm encountering an issue with the setCurrentAdmin function in AdminJS, specifically when updating the user theme (dark/light mode) via an API call. While the theme update is persisted correctly in the database, the UI does not reflect the change โ because the Redux session state is not updated.
๐ป Code Snippet
const [currentAdmin, setCurrentAdmin] = useCurrentAdmin();
const toggleTheme = useCallback(
async (theme: string) => {
console.log('before toggle theme: ', session.theme);
console.log('changing to theme: ', theme);
const response = await api.getDashboard<APIResponse>({
params: { theme },
});
console.log('response theme: ', response.data.currentAdmin.theme);
setCurrentAdmin(response.data.currentAdmin);
console.log('Updated to theme: ', session.theme); // This still logs the old theme
},
[setCurrentAdmin, session]
);
๐ชต Console Output
before toggle theme: dark
changing to theme: light
response theme: light
Updated to theme: dark // Not updated!
โ Verified
- โ The updated theme is saved correctly in the database.
- โ
response.data.currentAdmin.themecontains the correct value (light). - โ
session.themedoes not update aftersetCurrentAdmin(response.data.currentAdmin).
๐ค Expected Behavior
After calling setCurrentAdmin, the Redux session should reflect the new admin object โ including the updated theme โ so that the UI can react accordingly.
๐ ๏ธ Workaround
A forced page reload updates the UI:
setCurrentAdmin(response.data.currentAdmin);
window.location.reload();
But this is not ideal for user experience and seems unnecessary.
๐งช Bug Prevalence
All the time
๐ฆ AdminJS Dependencies Version
"@adminjs/design-system": "^4.1.1",
"@adminjs/express": "^6.1.0",
"@adminjs/passwords": "^4.0.0",
"@adminjs/prisma": "^5.0.1",
"@adminjs/themes": "^1.0.1",
"@prisma/internals": "^6.12.0",
"adminjs": "^7.7.2"
๐ Browser
- Chrome
๐ Relevant Log Output
before toggle theme: dark
changing to theme: light
response theme: light
Updated to theme: dark // Not updated!
๐งฉ Relevant Code Causing the Issue
const [currentAdmin, setCurrentAdmin] = useCurrentAdmin();
const icon = session.theme === 'dark' ? 'Sun' : 'Moon';
const toggleTheme = useCallback(
async (theme: string) => {
console.log('before toggle theme: ', session.theme);
console.log('changing to theme: ', theme);
const response = await api.getDashboard<APIResponse>({
params: { theme },
});
console.log('response theme: ', response.data.currentAdmin.theme);
setCurrentAdmin(response.data.currentAdmin);
// Reload page to refresh session state (temporary workaround)
// window.location.reload();
console.log('Updated to theme: ', session.theme);
},
[setCurrentAdmin, session]
);