Merge branch 'main' into main-undiverge

www/app/transcripts/new/page.tsx

@@ -16,6 +16,7 @@ import { faGear } from "@fortawesome/free-solid-svg-icons";
 import About from "../../(aboutAndPrivacy)/about";
 import Privacy from "../../(aboutAndPrivacy)/privacy";
 import { lockWakeState, releaseWakeState } from "../../lib/wakeLock";
+import { useRouter } from "next/navigation";
 
 const TranscriptCreate = () => {
   const [stream, setStream] = useState<MediaStream | null>(null);
@@ -36,6 +37,7 @@ const TranscriptCreate = () => {
   const transcript = useTranscript(stream, api);
   const webRTC = useWebRTC(stream, transcript?.response?.id, api);
   const webSockets = useWebSockets(transcript?.response?.id);
+  const router = useRouter();
   const {
     loading,
     permissionOk,
@@ -53,6 +55,17 @@ const TranscriptCreate = () => {
       setTranscriptStarted(true);
   }, [webSockets.transcriptText]);
 
+  useEffect(() => {
+    if (transcript?.response?.id) {
+      const newUrl = `/transcripts/${transcript.response.id}`;
+      // Shallow redirection does not work on NextJS 13
+      // https://github.com/vercel/next.js/discussions/48110
+      // https://github.com/vercel/next.js/discussions/49540
+      // router.push(newUrl, undefined, { shallow: true });
+      history.replaceState({}, "", newUrl);
+    }
+  });
+
   useEffect(() => {
     lockWakeState();
     return () => {
@@ -67,7 +80,7 @@ const TranscriptCreate = () => {
           <Recorder
             setStream={setStream}
             onStop={() => {
-              webRTC?.peer?.send(JSON.stringify({ cmd: "STOP" }));
+              webRTC?.send(JSON.stringify({ cmd: "STOP" }));
               setStream(null);
               setHasRecorded(true);
             }}

www/app/transcripts/recorder.tsx

@@ -208,12 +208,6 @@ export default function Recorder(props: RecorderProps) {
     if (!record) return;
 
     return record.on("stopRecording", () => {
-      const link = document.getElementById("download-recording");
-      if (!link) return;
-
-      link.setAttribute("href", record.getRecordedUrl());
-      link.setAttribute("download", "reflector-recording.webm");
-      link.style.visibility = "visible";
       renderMarkers();
     });
   }, [record]);
@@ -322,16 +316,6 @@ export default function Recorder(props: RecorderProps) {
               <FontAwesomeIcon icon={faDownload} className="h-5 w-auto" />
             </a>
           )}
-
-          {!props.transcriptId && (
-            <a
-              id="download-recording"
-              title="Download recording"
-              className="invisible text-center text-blue-400 hover:text-blue-700 ml-2 md:ml:4 p-2 rounded-lg outline-blue-400"
-            >
-              <FontAwesomeIcon icon={faDownload} className="h-5 w-auto" />
-            </a>
-          )}
         </>
       )}
       {!hasRecorded && (

www/app/transcripts/useWebSockets.ts

@@ -177,6 +177,16 @@ export const useWebSockets = (transcriptId: string | null): UseWebSockets => {
           case "FINAL_LONG_SUMMARY":
             if (message.data) {
               setFinalSummary(message.data);
+            }
+            break;
+
+          case "FINAL_TITLE":
+            console.debug("FINAL_TITLE event:", message.data);
+            break;
+
+          case "STATUS":
+            console.log("STATUS event:", message.data);
+            if (message.data.value === "ended") {
               const newUrl = "/transcripts/" + transcriptId;
               router.push(newUrl);
               console.debug(
@@ -186,13 +196,6 @@ export const useWebSockets = (transcriptId: string | null): UseWebSockets => {
                 newUrl,
               );
             }
-            break;
-
-          case "FINAL_TITLE":
-            console.debug("FINAL_TITLE event:", message.data);
-            break;
-
-          case "STATUS":
             setStatus(message.data);
             break;