Fix useTheme returns undefined as value

packages/ra-ui-materialui/src/layout/Theme/useTheme.spec.tsx

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import expect from 'expect';
+import { render, screen } from '@testing-library/react';
+import { useTheme } from './useTheme';
+import { CoreAdminContext } from 'ra-core';
+
+const authProvider = {
+    login: jest.fn().mockResolvedValueOnce(''),
+    logout: jest.fn().mockResolvedValueOnce(''),
+    checkAuth: jest.fn().mockResolvedValueOnce(''),
+    checkError: jest.fn().mockResolvedValueOnce(''),
+    getPermissions: jest.fn().mockResolvedValueOnce(''),
+};
+
+const Foo = () => {
+    const [theme] = useTheme();
+    return theme !== undefined ? <div aria-label="has-theme" /> : <></>;
+};
+
+describe('useTheme', () => {
+    it('should return current theme', () => {
+        render(
+            <CoreAdminContext authProvider={authProvider}>
+                <Foo />
+            </CoreAdminContext>
+        );
+        expect(screen.getByLabelText('has-theme')).not.toBeNull();
+    });
+});

packages/ra-ui-materialui/src/layout/Theme/useTheme.ts

@@ -1,8 +1,12 @@
 import { useStore } from 'ra-core';
-import { ThemeOptions } from '@mui/material';
+import { ThemeOptions, useTheme as useThemeMUI } from '@mui/material';
 
 export type ThemeSetter = (theme: ThemeOptions) => void;
 
 export const useTheme = (
     themeOverride?: ThemeOptions
-): [ThemeOptions, ThemeSetter] => useStore('theme', themeOverride);
+): [ThemeOptions, ThemeSetter] => {
+    const themeMUI = useThemeMUI();
+    const [theme, setter] = useStore('theme', themeOverride);
+    return [theme || themeMUI, setter];
+};