[FIX] Rewrite missing webRTC feature (#23172)

Co-authored-by: Tasso Evangelista <tasso.evangelista@rocket.chat>

app/theme/client/imports/general/base_old.css

@@ -3099,154 +3099,6 @@
 	padding-left: 10px;
 }
 
-.webrtc-video {
-	&.webrtc-video-overlay,
-	& .main-video,
-	& .state-overlay::before,
-	& .videos .video-item {
-		color: var(--color-white);
-	}
-
-	&.webrtc-video-overlay {
-		position: fixed;
-		z-index: 1000;
-		top: 0;
-		right: 0;
-		bottom: 0;
-		left: 0;
-
-		display: flex;
-		overflow-y: auto;
-		flex-direction: column;
-
-		padding: var(--default-small-padding);
-
-		background-color: #ffffff;
-
-		& .main-video {
-			display: flex;
-			flex-direction: column;
-
-			min-height: 140px;
-			margin-bottom: 4px;
-			align-items: center;
-			flex-grow: 1;
-
-			.webrtc-video-element {
-				width: auto;
-				max-width: 100%;
-				height: 100%;
-				min-height: 140px;
-			}
-		}
-	}
-
-	& .main-video {
-		text-align: center;
-
-		& .webrtc-video-element {
-			width: 100%;
-			min-height: 299px;
-		}
-
-		& > div {
-			position: relative;
-
-			margin-top: -28px;
-			margin-bottom: 2px;
-			padding: 0 8px;
-
-			text-align: center;
-
-			font-weight: bold;
-			line-height: 25px;
-		}
-	}
-
-	& .video-flip {
-		transform: scaleX(-1);
-		filter: FlipH;
-	}
-
-	& .videos {
-		display: flex;
-		flex-wrap: wrap;
-		justify-content: center;
-
-		& .video-item {
-			position: relative;
-
-			overflow: hidden;
-
-			width: 93px;
-			margin-right: 3px;
-			margin-bottom: 3px;
-
-			text-align: center;
-
-			line-height: 0;
-
-			& &.state-overlay::before {
-				position: absolute;
-				top: 0;
-				right: 0;
-				bottom: 0;
-				left: 0;
-
-				display: flex;
-
-				content: attr(data-state-text);
-
-				font-size: 12px;
-				font-weight: bold;
-				align-items: center;
-				justify-content: center;
-			}
-
-			& .webrtc-video-element {
-				max-width: 100px;
-				height: 70px;
-			}
-
-			& > div {
-				position: relative;
-
-				overflow: hidden;
-
-				margin-top: -16px;
-				padding: 0 2px;
-
-				text-align: center;
-				text-overflow: ellipsis;
-
-				font-size: 12px;
-				font-weight: bold;
-				line-height: 16px;
-			}
-
-			& .video-muted-overlay {
-				position: absolute;
-				top: 16px;
-				right: 0;
-				bottom: 16px;
-				left: 0;
-
-				display: flex;
-
-				text-align: center;
-
-				font-size: 24px;
-				align-items: center;
-				justify-content: center;
-			}
-		}
-	}
-}
-
-.webrtc-video-element {
-	background-color: #000000;
-}
-
 .rc-old .alert-icon {
 	display: block;
 

app/ui-master/client/main.html

@@ -23,7 +23,6 @@
 							</div>
 						</main>
 					{{else}}
-						{{> videoCall overlay=true}}
 						<div id="rocket-chat" class="{{embeddedVersion}} menu-nav">
 							{{#unless removeSidenav}}
 								{{> sideNav }}

app/ui/client/index.js

@@ -17,8 +17,6 @@ import './views/app/pageCustomContainer.html';
 import './views/app/roomSearch.html';
 import './views/app/secretURL.html';
 import './views/app/userSearch.html';
-import './views/app/videoCall/videoButtons.html';
-import './views/app/videoCall/videoCall.html';
 import './views/app/photoswipe.html';
 import './views/cmsPage';
 import './views/404/roomNotFound';
@@ -27,8 +25,6 @@ import './views/app/home';
 import './views/app/roomSearch';
 import './views/app/secretURL';
 import './views/app/invite';
-import './views/app/videoCall/videoButtons';
-import './views/app/videoCall/videoCall';
 import './views/app/photoswipe';
 import './components/icon';
 import './components/table.html';

app/ui/client/views/app/room.js

@@ -28,27 +28,13 @@ import { fileUpload } from '../../lib/fileUpload';
 import './room.html';
 import { getCommonRoomEvents } from './lib/getCommonRoomEvents';
 import { RoomManager as NewRoomManager } from '../../../../../client/lib/RoomManager';
-import { fireGlobalEvent } from '../../../../../client/lib/utils/fireGlobalEvent';
 import { isLayoutEmbedded } from '../../../../../client/lib/utils/isLayoutEmbedded';
 import { handleError } from '../../../../../client/lib/utils/handleError';
 
 export const chatMessages = {};
 
 const userCanDrop = (_id) => !roomTypes.readOnly(_id, Users.findOne({ _id: Meteor.userId() }, { fields: { username: 1 } }));
 
-
-export const openProfileTab = (e, tabBar, username) => {
-	e.stopPropagation();
-
-	if (isLayoutEmbedded()) {
-		fireGlobalEvent('click-user-card-message', { username });
-		e.preventDefault();
-		return;
-	}
-
-	tabBar.openUserInfo(username);
-};
-
 const wipeFailedUploads = () => {
 	const uploads = Session.get('uploading');
 
@@ -979,15 +965,12 @@ Meteor.startup(() => {
 		if (webrtc) {
 			this.autorun(() => {
 				const remoteItems = webrtc.remoteItems.get();
-				if (remoteItems && remoteItems.length > 0) {
-					this.tabBar.open('members-list');
-				}
-
-				if (webrtc.localUrl.get()) {
-					this.tabBar.open('members-list');
+				if ((remoteItems && remoteItems.length > 0) || webrtc.localUrl.get()) {
+					return this.tabBar.openUserInfo();
 				}
 			});
 		}
+
 		callbacks.add('streamNewMessage', (msg) => {
 			if (rid !== msg.rid || msg.editedAt || msg.tmid) {
 				return;