diff --git a/bigbluebutton-html5/imports/ui/components/common/error-boundary/component.jsx b/bigbluebutton-html5/imports/ui/components/common/error-boundary/component.jsx
index f62521cdf6..c660793326 100644
--- a/bigbluebutton-html5/imports/ui/components/common/error-boundary/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/common/error-boundary/component.jsx
@@ -1,6 +1,8 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import logger, { generateLoggerStreams } from '/imports/startup/client/logger';
+import apolloContextHolder from '/imports/ui/core/graphql/apolloContextHolder/apolloContextHolder';
+import { ApolloLink } from '@apollo/client';
const propTypes = {
children: PropTypes.element.isRequired,
@@ -53,6 +55,27 @@ class ErrorBoundary extends Component {
}
componentDidCatch(error, errorInfo) {
+ window.dispatchEvent(new Event('StopAudioTracks'));
+ const data = JSON.parse((sessionStorage.getItem('clientStartupSettings')) || '{}');
+ const mediaElement = document.querySelector(data?.mediaTag || '#remote-media');
+ if (mediaElement) {
+ mediaElement.pause();
+ mediaElement.srcObject = null;
+ }
+ const apolloClient = apolloContextHolder.getClient();
+
+ if (apolloClient) {
+ apolloClient.stop();
+ }
+
+ const ws = apolloContextHolder.getLink();
+ if (ws) {
+ // delay to termintate the connection, for user receive the end eject message
+ setTimeout(() => {
+ apolloClient.setLink(ApolloLink.empty());
+ ws.close();
+ }, 5000);
+ }
this.setState({
error,
errorInfo,