ensure stream continues when switching between stream and recordings (#3865)

This commit is contained in:
Jonathan Dobson
2025-10-30 14:08:54 -04:00
committed by GitHub
parent c55148c228
commit 2191b91519
2 changed files with 18 additions and 9 deletions

View File

@@ -75,6 +75,7 @@ type Props = {
run: WorkflowRunStatusApiResponse; run: WorkflowRunStatusApiResponse;
}; };
resizeTrigger?: number; resizeTrigger?: number;
isVisible?: boolean;
// -- // --
onClose?: () => void; onClose?: () => void;
}; };
@@ -86,6 +87,7 @@ function BrowserStream({
task = undefined, task = undefined,
workflow = undefined, workflow = undefined,
resizeTrigger, resizeTrigger,
isVisible = true,
// -- // --
onClose, onClose,
}: Props) { }: Props) {
@@ -622,7 +624,7 @@ function BrowserStream({
)} )}
ref={setCanvasContainerRef} ref={setCanvasContainerRef}
> >
{isReady && ( {isReady && isVisible && (
<div className="overlay z-10 flex items-center justify-center overflow-hidden"> <div className="overlay z-10 flex items-center justify-center overflow-hidden">
{showControlButtons && ( {showControlButtons && (
<div className="control-buttons pointer-events-none relative flex h-full w-full items-center justify-center"> <div className="control-buttons pointer-events-none relative flex h-full w-full items-center justify-center">

View File

@@ -23,7 +23,6 @@ import { useCredentialGetter } from "@/hooks/useCredentialGetter";
import { useCloseBrowserSessionMutation } from "@/routes/browserSessions/hooks/useCloseBrowserSessionMutation"; import { useCloseBrowserSessionMutation } from "@/routes/browserSessions/hooks/useCloseBrowserSessionMutation";
import { CopyText } from "@/routes/workflows/editor/Workspace"; import { CopyText } from "@/routes/workflows/editor/Workspace";
import { type BrowserSession as BrowserSessionType } from "@/routes/workflows/types/browserSessionTypes"; import { type BrowserSession as BrowserSessionType } from "@/routes/workflows/types/browserSessionTypes";
import { cn } from "@/util/utils";
import { BrowserSessionVideo } from "./BrowserSessionVideo"; import { BrowserSessionVideo } from "./BrowserSessionVideo";
@@ -183,20 +182,28 @@ function BrowserSession() {
{/* Tab Content */} {/* Tab Content */}
<div className="relative min-h-0 w-full flex-1 rounded-lg border p-4"> <div className="relative min-h-0 w-full flex-1 rounded-lg border p-4">
<div <div
className={cn( className="absolute left-0 top-0 z-10 flex h-full w-full items-center justify-center"
"absolute left-0 top-0 z-10 flex h-full w-full items-center justify-center", style={{
{ visibility: activeTab === "stream" ? "visible" : "hidden",
hidden: activeTab !== "stream", pointerEvents: activeTab === "stream" ? "auto" : "none",
}, }}
)}
> >
<BrowserStream <BrowserStream
browserSessionId={browserSessionId} browserSessionId={browserSessionId}
interactive={false} interactive={false}
showControlButtons={true} showControlButtons={true}
isVisible={activeTab === "stream"}
/> />
</div> </div>
{activeTab === "videos" && <BrowserSessionVideo />} <div
className="h-full w-full"
style={{
visibility: activeTab === "videos" ? "visible" : "hidden",
pointerEvents: activeTab === "videos" ? "auto" : "none",
}}
>
<BrowserSessionVideo />
</div>
</div> </div>
</div> </div>
<Toaster /> <Toaster />