Repository navigation
Dark Themes does not work with React Admin Enterprise #596
Description
API Platform version(s) affected: @api-platform/admin 3.4.9
Description
It is not possible to configure the light and dark themes when using React Admin Enterprise, the Dark Theme parameters are lost in the process and we only get a broken standard dark theme on most parts of the application.
How to reproduce
import {HydraAdmin} from "@api-platform/admin"
import {houseDarkTheme, houseLightTheme} from "react-admin"
import {Admin} from "@react-admin/ra-enterprise"
import {SolarLayout} from "@react-admin/ra-navigation";
const GyroscopsLoader = ({ entrypoint, ...rest }: DashboardLoaderProps) => {
return (
<HydraAdmin
admin={Admin}
dataProvider={dataProvider}
entrypoint={entrypoint}
layout={SolarLayout}
lightTheme={houseLightTheme}
darkTheme={houseDarkTheme}
defaultTheme="light"
{{...rest}}
>
// Resources here
</HydraAdmin>
)
}Possible Solution
In the AdminGuesser.tsx file, the AdminGuesser component does override anything we could set inside the darkTheme prop with the default APIP dark theme. It may be fixed by fixing this forced override.
Additional Context
#403
Activity
[-]Light/Dark Themes does not work with React Admin EE[/-][+]Light/Dark Themes does not work with React Admin Enterprise[/+][-]Light/Dark Themes does not work with React Admin Enterprise[/-][+]Dark Themes does not work with React Admin Enterprise[/+]slax57 commentedon Mar 3, 2025
I believe you're right!
In v3,
<AdminGuesser>does not propagate thedarkThemeprop and instead overrides it with the default dark theme.https://github.com/api-platform/admin/blob/v3.4.9/src/AdminGuesser.tsx
However in v4, this issue was fixed and now the
darkThemeprop is properly forwarded.https://github.com/api-platform/admin/blob/v4.0.4/src/core/AdminGuesser.tsx
So, you can solve this issue by upgrading to
@api-platform/adminv4.