From 7e2f3c315c60cb72be0a5d1ffb0e50bea763eb96 Mon Sep 17 00:00:00 2001
From: Yuzuki Aida <dev@nzws.me>
Date: Tue, 4 Oct 2022 12:31:22 +0900
Subject: [PATCH] Prevent leave website when broadcasting

---
 .../tenants/[slug]/[id]/broadcast-via-browser.page.tsx | 10 ++++++++++
 apps/web/utils/hooks/api/use-push-via-browser.ts       |  6 +++++-
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/apps/web/pages/app/[locale]/tenants/[slug]/[id]/broadcast-via-browser.page.tsx b/apps/web/pages/app/[locale]/tenants/[slug]/[id]/broadcast-via-browser.page.tsx
index 9c4f0420..c4d5f20d 100644
--- a/apps/web/pages/app/[locale]/tenants/[slug]/[id]/broadcast-via-browser.page.tsx
+++ b/apps/web/pages/app/[locale]/tenants/[slug]/[id]/broadcast-via-browser.page.tsx
@@ -58,6 +58,7 @@ import { useRouter } from 'next/router';
 import { useWakeLock } from '~/utils/hooks/use-wake-lock';
 import { TimeCounter } from '~/atoms/time-counter';
 import { useConvertLiveId } from '~/utils/hooks/api/use-convert-live-id';
+import { useBeforeUnload } from 'react-use';
 
 type Params = { slug: string; id: string };
 
@@ -68,6 +69,7 @@ const Page: NextPage<PageProps<Props, Params & PathProps>> = ({
   const toast = useToast();
   const router = useRouter();
   const isInitializedRef = useRef(false);
+  const liveEndedRef = useRef(false);
   const commentsRef = useRef<HTMLDivElement>(null);
   const [liveId] = useConvertLiveId(slug, id);
   const [stream, mutate] = useStream(liveId);
@@ -104,6 +106,13 @@ const Page: NextPage<PageProps<Props, Params & PathProps>> = ({
     onOpen: onOpenLiveEdit,
     onClose: onCloseLiveEdit
   } = useDisclosure();
+  useBeforeUnload(
+    useCallback(
+      () => !!(live?.isPushing && !live?.endedAt && !liveEndedRef.current),
+      [live]
+    ),
+    'ページを離れると、配信が切断されます'
+  );
 
   const {
     isWakeLockSupported,
@@ -129,6 +138,7 @@ const Page: NextPage<PageProps<Props, Params & PathProps>> = ({
           });
 
           if (!isStart) {
+            liveEndedRef.current = true;
             void router.push('/');
           }
         } catch (e) {
diff --git a/apps/web/utils/hooks/api/use-push-via-browser.ts b/apps/web/utils/hooks/api/use-push-via-browser.ts
index 3d2b8e03..65e2e5c2 100644
--- a/apps/web/utils/hooks/api/use-push-via-browser.ts
+++ b/apps/web/utils/hooks/api/use-push-via-browser.ts
@@ -121,7 +121,11 @@ export const usePushViaBrowser = (liveId?: number) => {
     void (async () => {
       try {
         const media = await navigator.mediaDevices.getUserMedia({
-          audio: true
+          audio: {
+            echoCancellation: false,
+            noiseSuppression: false,
+            autoGainControl: false
+          }
         });
 
         audioStream = new MediaStream();