feat: Open zoom meetings in a new tab (#663)

## Ticket corona-school/project-user#1229
corona-school · Sep 18, 2024 · 3d27423 · 3d27423
1 parent 077c275
commit 3d27423
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 5 deletions.
diff --git a/src/modals/AdHocMeetingModal.tsx b/src/modals/AdHocMeetingModal.tsx
@@ -53,7 +53,7 @@ const AdHocMeetingModal = ({ isOpen, onOpenChange, matchId }: ModalProps) => {
         setIsBrowserMeeting(true);
         const response = await createMeeting();
         if (response) {
-            navigate(`/video-chat/${response.appointmentId}/${response.appointmentType}`);
+            window.open(`/video-chat/${response.appointmentId}/${response.appointmentType}`);
         }
     };
 
@@ -63,7 +63,7 @@ const AdHocMeetingModal = ({ isOpen, onOpenChange, matchId }: ModalProps) => {
         if (response.zoomUrl) {
             window.open(response.zoomUrl, '_self');
         } else {
-            navigate(`/video-chat/${response.appointmentId}/${response.appointmentType}`);
+            window.open(`/video-chat/${response.appointmentId}/${response.appointmentType}`);
         }
     };
 

diff --git a/src/modals/ZoomMeetingModal.tsx b/src/modals/ZoomMeetingModal.tsx
@@ -1,6 +1,5 @@
 import { Trans, useTranslation } from 'react-i18next';
 import { Lecture_Appointmenttype_Enum } from '../gql/graphql';
-import { useNavigate } from 'react-router-dom';
 import CheckBadge from '../assets/icons/check-badge.svg';
 import CameraIcon from '../assets/icons/camera-icon.svg';
 import { BaseModalProps, Modal, ModalFooter, ModalHeader, ModalTitle } from '@/components/Modal';
@@ -50,7 +49,10 @@ export const ZoomInfoOptions = () => {
 
 const ZoomMeetingModal: React.FC<ZoomMeetingModalProps> = ({ isOpen, onOpenChange, appointmentId, appointmentType, zoomUrl }) => {
     const { t } = useTranslation();
-    const navigate = useNavigate();
+
+    const handleOnContinueInBrowser = () => {
+        window.open(`/video-chat/${appointmentId}/${appointmentType}`);
+    };
 
     return (
         <Modal onOpenChange={onOpenChange} isOpen={isOpen}>
@@ -61,7 +63,7 @@ const ZoomMeetingModal: React.FC<ZoomMeetingModalProps> = ({ isOpen, onOpenChang
                 <ZoomInfoOptions />
             </div>
             <ModalFooter>
-                <Button className="w-full" variant="outline" onClick={() => navigate(`/video-chat/${appointmentId}/${appointmentType}`)}>
+                <Button className="w-full" variant="outline" onClick={handleOnContinueInBrowser}>
                     {t('appointment.zoomModal.browser')}
                 </Button>
                 <Button className="w-full" disabled={!zoomUrl} onClick={() => window.open(zoomUrl, '_self')}>