[IMPROVE] Moved call wrap up modal to EE (#25875)

<!-- This is a pull request template, you do not need to uncomment or remove the comments, they won't show up in the PR text. -->

<!-- Your Pull Request name should start with one of the following tags
  [NEW] For new features
  [IMPROVE] For an improvement (performance or little improvements) in existing features
  [FIX] For bug fixes that affect the end-user
  [BREAK] For pull requests including breaking changes
  Chore: For small tasks
  Doc: For documentation
-->

<!-- Checklist!!! If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code. 
  - I have read the Contributing Guide - https://github.com/RocketChat/Rocket.Chat/blob/develop/.github/CONTRIBUTING.md#contributing-to-rocketchat doc
  - I have signed the CLA - https://cla-assistant.io/RocketChat/Rocket.Chat
  - Lint and unit tests pass locally with my changes
  - I have added tests that prove my fix is effective or that my feature works (if applicable)
  - I have added necessary documentation (if applicable)
  - Any dependent changes have been merged and published in downstream modules
-->

## Proposed changes (including videos or screenshots)
<!-- CHANGELOG -->
This PR adds a restriction, enabling the feature to display the call wrap up modal only for Enterprise Edition users.
<!--
  Describe the big picture of your changes here to communicate to the maintainers why we should accept this pull request.
  If it fixes a bug or resolves a feature request, be sure to link to that issue below.
  This description will appear in the release notes if we accept the contribution.
-->

<!-- END CHANGELOG -->

## Issue(s)
<!-- Link the issues being closed by or related to this PR. For example, you can use #594 if this PR closes issue number 594 -->

## Steps to test or reproduce
<!-- Mention how you would reproduce the bug if not mentioned on the issue page already. Also mention which screens are going to have the changes if applicable -->

## Further comments
<!-- If this is a relatively large or complex change, kick off the discussion by explaining why you chose the solution you did and what alternatives you considered, etc... -->

apps/meteor/client/providers/CallProvider/CallProvider.tsx

@@ -20,7 +20,8 @@ import { OutgoingByeRequest } from 'sip.js/lib/core';
 
 import { CustomSounds } from '../../../app/custom-sounds/client';
 import { getUserPreference } from '../../../app/utils/client';
-import { WrapUpCallModal } from '../../components/voip/modal/WrapUpCallModal';
+import { useHasLicense } from '../../../ee/client/hooks/useHasLicense';
+import { WrapUpCallModal } from '../../../ee/client/voip/components/modals/WrapUpCallModal';
 import { CallContext, CallContextValue } from '../../contexts/CallContext';
 import { roomCoordinator } from '../../lib/rooms/roomCoordinator';
 import { QueueAggregator } from '../../lib/voip/QueueAggregator';
@@ -53,6 +54,7 @@ export const CallProvider: FC = ({ children }) => {
 	const result = useVoipClient();
 	const user = useUser();
 	const homeRoute = useRoute('home');
+	const isEnterprise = useHasLicense('voip-enterprise');
 
 	const remoteAudioMediaRef = useRef<HTMLAudioElement>(null); // TODO: Create a dedicated file for the AUDIO and make the controls accessible
 
@@ -61,7 +63,7 @@ export const CallProvider: FC = ({ children }) => {
 	const [roomInfo, setRoomInfo] = useState<{ v: { token?: string }; rid: string }>();
 
 	const closeRoom = useCallback(
-		async (data): Promise<void> => {
+		async (data = {}): Promise<void> => {
 			roomInfo &&
 				(await voipCloseRoomEndpoint({
 					rid: roomInfo.rid,
@@ -86,6 +88,15 @@ export const CallProvider: FC = ({ children }) => {
 
 	const [networkStatus, setNetworkStatus] = useState<NetworkState>('online');
 
+	const handleWrapUp = useCallback(() => {
+		if (isEnterprise) {
+			openWrapUpModal();
+			return;
+		}
+
+		closeRoom();
+	}, [isEnterprise, openWrapUpModal, closeRoom]);
+
 	useEffect(() => {
 		if (!result?.voipClient) {
 			return;
@@ -154,12 +165,14 @@ export const CallProvider: FC = ({ children }) => {
 
 		const handleCallHangup = (_event: { roomId: string }): void => {
 			setQueueName(queueAggregator.getCurrentQueueName());
-			openWrapUpModal();
+
+			handleWrapUp();
+
 			dispatchEvent({ event: VoipClientEvents['VOIP-CALL-ENDED'], rid: _event.roomId });
 		};
 
 		return subscribeToNotifyUser(`${user._id}/call.hangup`, handleCallHangup);
-	}, [openWrapUpModal, queueAggregator, subscribeToNotifyUser, user, voipEnabled, dispatchEvent]);
+	}, [openWrapUpModal, queueAggregator, subscribeToNotifyUser, user, voipEnabled, dispatchEvent, handleWrapUp]);
 
 	useEffect(() => {
 		if (!result.voipClient) {

apps/meteor/ee/app/license/server/bundles.ts

@@ -3,6 +3,7 @@ export type BundleFeature =
 	| 'canned-responses'
 	| 'ldap-enterprise'
 	| 'livechat-enterprise'
+	| 'voip-enterprise'
 	| 'omnichannel-mobile-enterprise'
 	| 'engagement-dashboard'
 	| 'push-privacy'
@@ -21,6 +22,7 @@ const bundles: IBundle = {
 		'canned-responses',
 		'ldap-enterprise',
 		'livechat-enterprise',
+		'voip-enterprise',
 		'omnichannel-mobile-enterprise',
 		'engagement-dashboard',
 		'push-privacy',

apps/meteor/ee/client/hooks/useHasLicense.js → apps/meteor/ee/client/hooks/useHasLicense.ts

 import { useState, useEffect } from 'react';
 
 import { hasLicense } from '../../app/license/client';
+import { BundleFeature } from '../../app/license/server/bundles';
 
-export const useHasLicense = (licenseName) => {
-	const [license, setLicense] = useState('loading');
+export const useHasLicense = (licenseName: BundleFeature): 'loading' | boolean => {
+	const [license, setLicense] = useState<'loading' | boolean>('loading');
 
 	useEffect(() => {
-		hasLicense(licenseName).then((enabled) => {
-			if (enabled) {
-				return setLicense(true);
-			}
-			setLicense(false);
-		});
+		hasLicense(licenseName).then(setLicense);
 	}, [licenseName]);
 
 	return license;

apps/meteor/client/components/voip/modal/WrapUpCallModal.tsx → apps/meteor/ee/client/voip/components/modals/WrapUpCallModal.tsx

@@ -3,7 +3,7 @@ import { useSetModal, useTranslation } from '@rocket.chat/ui-contexts';
 import React, { ReactElement, useEffect } from 'react';
 import { useForm, SubmitHandler } from 'react-hook-form';
 
-import Tags from '../../Omnichannel/Tags';
+import Tags from '../../../../../client/components/Omnichannel/Tags';
 
 type WrapUpCallPayload = {
 	comment: string;
@@ -42,8 +42,6 @@ export const WrapUpCallModal = ({ closeRoom }: WrapUpCallModalProps): ReactEleme
 		closeModal();
 	};
 
-	useEffect(() => closeRoom, [closeRoom]);
-
 	return (
 		<Modal is='form' onSubmit={handleSubmit(onSubmit)}>
 			<Modal.Header>