www: move audio/videoEnabled upstream, to requestingDevices

www/atoms/local.ts

@@ -16,6 +16,8 @@ export type Local =
   | {
       status: "requestingDevices";
       name: string;
+      audioEnabled: boolean;
+      videoEnabled: boolean;
     }
   | {
       status: "connecting";
@@ -46,18 +48,23 @@ const setAudioVideoEnabled =
     return { ...local, audioEnabled, videoEnabled };
   };
 
-const setConnecting =
+const setConnecting = (local: Local): Local => {
+  assert(local.status === "requestingDevices");
+  return { ...local, status: "connecting" };
+};
+
+const setRequestingDevices =
   (audioEnabled: boolean, videoEnabled: boolean) =>
   (local: Local): Local => {
-    assert(local.status === "requestingDevices");
-    return { ...local, status: "connecting", audioEnabled, videoEnabled };
+    assert(local.status === "requestingPermissions");
+    return {
+      ...local,
+      status: "requestingDevices",
+      audioEnabled,
+      videoEnabled,
+    };
   };
 
-const setRequestingDevices = (local: Local): Local => {
-  assert(local.status === "requestingPermissions");
-  return { ...local, status: "requestingDevices" };
-};
-
 const setRequestingPermissions =
   (name: string) =>
   (local: Local): Local => {

www/components/room/request-devices.tsx

@@ -25,9 +25,7 @@ export default function RequestDevices() {
   }, []);
 
   const joinRoom = React.useCallback(async () => {
-    const stream = mapGet(streamMap, LocalStreamKey);
-    const { audioEnabled, videoEnabled } = getVideoAudioEnabled(stream);
-    setLocal(localActions.setConnecting(audioEnabled, videoEnabled));
+    setLocal(localActions.setConnecting);
   }, [setLocal]);
 
   const handleDeviceChange = React.useCallback(

www/components/room/request-permission.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { useSetRecoilState } from "recoil";
 import { localActions, localState, LocalStreamKey } from "../../atoms/local";
 import { streamMap } from "../../lib/mesh/maps";
-import { createLocalStream } from "../../lib/mesh/stream";
+import { createLocalStream, getVideoAudioEnabled } from "../../lib/mesh/stream";
 import PreForm from "./pre-form";
 
 export default function RequestPermission() {
@@ -11,7 +11,8 @@ export default function RequestPermission() {
   const requestPermissions = React.useCallback(async () => {
     const stream = await createLocalStream();
     streamMap.set(LocalStreamKey, stream);
-    setLocal(localActions.setRequestingDevices);
+    const { audioEnabled, videoEnabled } = getVideoAudioEnabled(stream);
+    setLocal(localActions.setRequestingDevices(audioEnabled, videoEnabled));
   }, [setLocal]);
 
   return (