show progress during upload

More explicit feedback of the state of their upload. Also prevents
recording more media at the same time or interacting with the stream
which would feel stale to the human since they just created something
and it's yet to be present in the stream.

js/mobile/src/features/compose/ComposeDock.tsx

@@ -36,7 +36,12 @@ type ComposeUiState =
       uri: string;
       durationMs: number;
     }
-  | { kind: "uploading" };
+  | {
+      kind: "uploading";
+      mode: RecordingMode;
+      uri: string;
+      durationMs: number;
+    };
 
 interface SubmitMediaParams {
   fileUri: string;
@@ -125,7 +130,12 @@ export function ComposeDock({
   const sendReview = useEvent(async () => {
     if (ui.kind !== "review" || !userId) return;
     const captured = ui;
-    setUi({ kind: "uploading" });
+    setUi({
+      kind: "uploading",
+      mode: captured.mode,
+      uri: captured.uri,
+      durationMs: captured.durationMs,
+    });
     try {
       const mimeType =
         captured.mode === "audio" ? "audio/mp4" : "video/mp4";
@@ -251,10 +261,17 @@ export function ComposeDock({
       ) : null}
 
       <ReviewSheet
-        open={ui.kind === "review"}
-        uri={ui.kind === "review" ? ui.uri : null}
-        mode={ui.kind === "review" ? ui.mode : null}
-        durationMs={ui.kind === "review" ? ui.durationMs : 0}
+        open={ui.kind === "review" || ui.kind === "uploading"}
+        uri={
+          ui.kind === "review" || ui.kind === "uploading" ? ui.uri : null
+        }
+        mode={
+          ui.kind === "review" || ui.kind === "uploading" ? ui.mode : null
+        }
+        durationMs={
+          ui.kind === "review" || ui.kind === "uploading" ? ui.durationMs : 0
+        }
+        sending={ui.kind === "uploading"}
         onSend={sendReview}
         onRetake={retake}
         onCancel={cancelReview}