diff --git a/skyvern-frontend/src/components/FloatingWindow.tsx b/skyvern-frontend/src/components/FloatingWindow.tsx index 37988744..03dceeda 100644 --- a/skyvern-frontend/src/components/FloatingWindow.tsx +++ b/skyvern-frontend/src/components/FloatingWindow.tsx @@ -145,6 +145,7 @@ function getOs(): OS { function FloatingWindow({ bounded, children, + initialPosition, initialWidth, initialHeight, maximized, @@ -162,6 +163,7 @@ function FloatingWindow({ bounded?: boolean; children: React.ReactNode; initialHeight?: number; + initialPosition?: { x: number; y: number }; initialWidth?: number; maximized?: boolean; showCloseButton?: boolean; @@ -177,22 +179,22 @@ function FloatingWindow({ }) { const [reloadKey, setReloadKey] = useState(0); const [isReloading, setIsReloading] = useState(false); - const [position, setPosition] = useState({ x: 0, y: 0 }); + const [position, setPosition] = useState(initialPosition ?? { x: 0, y: 0 }); const [size, setSize] = useState({ - left: 0, - top: 0, + left: initialPosition?.x ?? 0, + top: initialPosition?.y ?? 0, height: initialHeight ?? Constants.MinHeight, width: initialWidth ?? Constants.MinWidth, }); const [lastSize, setLastSize] = useState({ - left: 0, - top: 0, + left: initialPosition?.x ?? 0, + top: initialPosition?.y ?? 0, height: initialHeight ?? Constants.MinHeight, width: initialWidth ?? Constants.MinWidth, }); const [restoreSize, setRestoreSize] = useState({ - left: 0, - top: 0, + left: initialPosition?.x ?? 0, + top: initialPosition?.y ?? 0, height: initialHeight ?? Constants.MinHeight, width: initialWidth ?? Constants.MinWidth, }); @@ -286,13 +288,13 @@ function FloatingWindow({ return; } setSize({ - left: 0, - top: 0, + left: initialPosition?.x ?? 0, + top: initialPosition?.y ?? 0, width: initialWidth, height: initialHeight, }); - setPosition({ x: 0, y: 0 }); - }, [initialWidth, initialHeight]); + setPosition({ x: initialPosition?.x ?? 0, y: initialPosition?.y ?? 0 }); + }, [initialWidth, initialHeight, initialPosition]); /** * Forces the sizing to take place after the resize is complete. diff --git a/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx b/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx index 12a83f37..6f375a63 100644 --- a/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx +++ b/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx @@ -186,6 +186,21 @@ function WorkflowDebugger() { const interactor = workflowRun && isFinalized === false ? "agent" : "human"; const browserTitle = interactor === "agent" ? `Browser [🤖]` : `Browser [👤]`; + // ---start fya: https://github.com/frontyardart + const initialBrowserPosition = { + x: 600, + y: 132, + }; + + const windowWidth = window.innerWidth; + const rightPadding = 567; + const initialWidth = Math.max( + 512, + windowWidth - initialBrowserPosition.x - rightPadding, + ); + const initialHeight = (initialWidth / 16) * 9; + // ---end fya + return (