bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/pads/component.jsx

62 lines
1.3 KiB
JavaScript

import React, { useEffect, useState } from 'react';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl } from 'react-intl';
import Service from './service';
import Styled from './styles';
const intlMessages = defineMessages({
hint: {
id: 'app.pads.hint',
description: 'Label for hint on how to escape iframe',
},
});
const propTypes = {
externalId: PropTypes.string.isRequired,
hasSession: PropTypes.bool.isRequired,
intl: PropTypes.shape({
formatMessage: PropTypes.func.isRequired,
}).isRequired,
isResizing: PropTypes.bool.isRequired,
isRTL: PropTypes.bool.isRequired,
};
const Pad = ({
externalId,
hasSession,
intl,
isResizing,
isRTL,
}) => {
const [padURL, setPadURL] = useState();
useEffect(() => {
Service.getPadId(externalId).then((response) => {
setPadURL(Service.buildPadURL(response));
});
}, [isRTL, hasSession]);
return (
<Styled.Pad>
<Styled.IFrame
title="pad"
src={padURL}
aria-describedby="padEscapeHint"
style={{
pointerEvents: isResizing ? 'none' : 'inherit',
}}
/>
<Styled.Hint
id="padEscapeHint"
aria-hidden
>
{intl.formatMessage(intlMessages.hint)}
</Styled.Hint>
</Styled.Pad>
);
};
Pad.propTypes = propTypes;
export default injectIntl(Pad);