bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/screenreader-alert/component.jsx
Arthurk12 6cb0e914ab fix(screen-reader): add safeguards for adding alerts
Adds checks for the alert's text and DOM element before adding screen
reader alerts.
2024-04-12 15:09:23 -03:00

19 lines
623 B
JavaScript

import { createPortal } from 'react-dom';
import { useEffect } from 'react';
import { removeAlert } from './service';
const ARIA_ALERT_EXT_TIMEOUT = 15000;
const ScreenReaderAlert = ({ olderAlert }) => {
useEffect(() => {
if (olderAlert) setTimeout(() => removeAlert(olderAlert.id), ARIA_ALERT_EXT_TIMEOUT);
}, [olderAlert?.id]);
const ariaAlertsElement = document.getElementById('aria-polite-alert');
const shouldAddAlert = olderAlert && olderAlert.text && ariaAlertsElement !== null;
return shouldAddAlert ? createPortal(olderAlert.text, ariaAlertsElement) : null;
};
export default ScreenReaderAlert;