jiti-meet/react/features/base/ui/components/JitsiThemeProvider.web.tsx

51 lines
1.2 KiB
TypeScript

import { ThemeProvider, StyledEngineProvider } from '@mui/material/styles';
import * as React from 'react';
import { connect } from 'react-redux';
import { IState } from '../../../app/types';
import BaseTheme from './BaseTheme.web';
type Props = {
/**
* The default theme or theme set through advanced branding.
*/
_theme: Object;
/**
* The children of the component.
*/
children: React.ReactNode;
};
/**
* The theme provider for the web app.
*
* @param {Object} props - The props of the component.
* @returns {React.ReactNode}
*/
function JitsiThemeProvider(props: Props) {
return (
<StyledEngineProvider injectFirst = { true }>
<ThemeProvider theme = { props._theme }>{ props.children }</ThemeProvider>
</StyledEngineProvider>
);
}
/**
* Maps part of the Redux state to the props of this component.
*
* @param {Object} state - The Redux state.
* @returns {Props}
*/
function _mapStateToProps(state: IState) {
const { muiBrandedTheme } = state['features/dynamic-branding'];
return {
_theme: muiBrandedTheme || BaseTheme
};
}
export default connect(_mapStateToProps)(JitsiThemeProvider);