[IMPROVE] Rewrite Call as React component

app/videobridge/client/index.js

@@ -1,9 +1,4 @@
-import './stylesheets/video.css';
-import './views/videoFlexTab.html';
 import './views/bbbLiveView.html';
-import './views/videoFlexTabBbb.html';
-import './views/videoFlexTab';
-import './views/videoFlexTabBbb';
 import './tabBar';
 import './actionLink';
 import '../lib/messageType';

app/videobridge/client/tabBar.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React, { useMemo, lazy } from 'react';
 import { useStableArray } from '@rocket.chat/fuselage-hooks';
 import { Option, Badge } from '@rocket.chat/fuselage';
 
@@ -7,6 +7,8 @@ import { addAction, ToolboxActionConfig } from '../../../client/views/room/lib/T
 import { useTranslation } from '../../../client/contexts/TranslationContext';
 import Header from '../../../client/components/Header';
 
+const templateBBB = lazy(() => import('../../../client/views/room/contextualBar/Call/BBB'));
+
 addAction('bbb_video', ({ room }) => {
 	const enabled = useSetting('bigbluebutton_Enabled');
 	const t = useTranslation();
@@ -28,7 +30,7 @@ addAction('bbb_video', ({ room }) => {
 		id: 'bbb_video',
 		title: 'BBB Video Call',
 		icon: 'phone',
-		template: 'videoFlexTabBbb',
+		template: templateBBB,
 		order: live ? -1 : 0,
 		renderAction: (props): React.ReactNode => <Header.ToolBoxAction {...props}>
 			{live ? <Header.Badge title={t('Started_a_video_call')} variant='primary'>!</Header.Badge> : null}
@@ -37,6 +39,8 @@ addAction('bbb_video', ({ room }) => {
 	} : null), [enabled, groups, live, t]);
 });
 
+const templateJitsi = lazy(() => import('../../../client/views/room/contextualBar/Call/Jitsi'));
+
 addAction('video', ({ room }) => {
 	const enabled = useSetting('Jitsi_Enabled');
 	const t = useTranslation();
@@ -59,7 +63,8 @@ addAction('video', ({ room }) => {
 		id: 'video',
 		title: 'Call',
 		icon: 'phone',
-		template: 'videoFlexTab',
+		template: templateJitsi,
+		full: true,
 		order: live ? -1 : 0,
 		renderAction: (props): React.ReactNode => <Header.ToolBoxAction {...props}>
 			{live && <Header.Badge title={t('Started_a_video_call')} variant='primary'>!</Header.Badge>}

app/videobridge/server/methods/bbb.js

@@ -111,14 +111,12 @@ Meteor.methods({
 		const endApiResult = HTTP.get(endApi);
 
 		if (endApiResult.statusCode !== 200) {
-			// TODO improve error logging
-			console.log({ endApiResult });
-			return;
+			saveStreamingOptions(rid, {});
+			throw new Meteor.Error(endApiResult);
 		}
-
 		const doc = parseString(endApiResult.content);
 
-		if (doc.response.returncode[0] === 'FAILED') {
+		if (['SUCCESS', 'FAILED'].includes(doc.response.returncode[0])) {
 			saveStreamingOptions(rid, {});
 		}
 	},