bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/banner-bar/component.jsx
2021-10-26 13:26:32 +00:00

38 lines
896 B
JavaScript

import React, { useEffect } from 'react';
import PropTypes from 'prop-types';
import NotificationsBar from '/imports/ui/components/notifications-bar/component';
import Styled from './styles';
import { ACTIONS } from '../layout/enums';
const BannerBar = ({
text, color, hasBanner: propsHasBanner, layoutContextDispatch,
}) => {
useEffect(() => {
const localHasBanner = !!text;
if (localHasBanner !== propsHasBanner) {
layoutContextDispatch({
type: ACTIONS.SET_HAS_BANNER_BAR,
value: localHasBanner,
});
}
}, [text, propsHasBanner]);
if (!text) return null;
return (
<NotificationsBar color={color}>
<Styled.BannerTextColor>
{text}
</Styled.BannerTextColor>
</NotificationsBar>
);
};
BannerBar.propTypes = {
text: PropTypes.string.isRequired,
color: PropTypes.string.isRequired,
};
export default BannerBar;