Jon/sky 5981 turn off debugger for oss and self host (#3243)

skyvern-frontend/src/router.tsx

@@ -18,7 +18,6 @@ import { WorkflowRun } from "./routes/workflows/WorkflowRun";
 import { WorkflowRunParameters } from "./routes/workflows/WorkflowRunParameters";
 import { Workflows } from "./routes/workflows/Workflows";
 import { WorkflowsPageLayout } from "./routes/workflows/WorkflowsPageLayout";
-import { Debugger } from "./routes/workflows/debugger/Debugger";
 import { WorkflowEditor } from "./routes/workflows/editor/WorkflowEditor";
 import { WorkflowPostRunParameters } from "./routes/workflows/workflowRun/WorkflowPostRunParameters";
 import { WorkflowRunOutput } from "./routes/workflows/workflowRun/WorkflowRunOutput";
@@ -111,11 +110,11 @@ const router = createBrowserRouter([
               },
               {
                 path: "debug",
-                element: <Debugger />,
+                element: <WorkflowEditor />,
               },
               {
                 path: ":workflowRunId/:blockLabel/debug",
-                element: <Debugger />,
+                element: <WorkflowEditor />,
               },
               {
                 path: "edit",

skyvern-frontend/src/routes/workflows/editor/WorkflowHeader.tsx

@@ -15,6 +15,7 @@ import {
   ReloadIcon,
 } from "@radix-ui/react-icons";
 import { useNavigate, useParams } from "react-router-dom";
+import { useUser } from "@/hooks/useUser";
 import { statusIsRunningOrQueued } from "@/routes/tasks/types";
 import { useGlobalWorkflowsQuery } from "../hooks/useGlobalWorkflowsQuery";
 import { EditableNodeTitle } from "./nodes/components/EditableNodeTitle";
@@ -51,6 +52,7 @@ function WorkflowHeader({
   const debugStore = useDebugStore();
   const workflowRunIsRunningOrQueued =
     workflowRun && statusIsRunningOrQueued(workflowRun);
+  const user = useUser().get();
 
   if (!globalWorkflows) {
     return null; // this should be loaded already by some other components
@@ -103,36 +105,38 @@ function WorkflowHeader({
           </Button>
         ) : (
           <>
-            <TooltipProvider>
-              <Tooltip>
-                <TooltipTrigger asChild>
-                  <Button
-                    size="icon"
-                    variant={debugStore.isDebugMode ? "default" : "tertiary"}
-                    className="size-10"
-                    disabled={workflowRunIsRunningOrQueued}
-                    onClick={() => {
-                      if (debugStore.isDebugMode) {
-                        navigate(`/workflows/${workflowPermanentId}/edit`);
-                      } else {
-                        navigate(`/workflows/${workflowPermanentId}/debug`);
-                      }
-                    }}
-                  >
-                    {debugStore.isDebugMode ? (
-                      <BrowserIcon className="h-6 w-6" />
-                    ) : (
-                      <BrowserIcon className="h-6 w-6" />
-                    )}
-                  </Button>
-                </TooltipTrigger>
-                <TooltipContent>
-                  {debugStore.isDebugMode
-                    ? "Turn off Browser"
-                    : "Turn on Browser"}
-                </TooltipContent>
-              </Tooltip>
-            </TooltipProvider>
+            {user && (
+              <TooltipProvider>
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Button
+                      size="icon"
+                      variant={debugStore.isDebugMode ? "default" : "tertiary"}
+                      className="size-10"
+                      disabled={workflowRunIsRunningOrQueued}
+                      onClick={() => {
+                        if (debugStore.isDebugMode) {
+                          navigate(`/workflows/${workflowPermanentId}/edit`);
+                        } else {
+                          navigate(`/workflows/${workflowPermanentId}/debug`);
+                        }
+                      }}
+                    >
+                      {debugStore.isDebugMode ? (
+                        <BrowserIcon className="h-6 w-6" />
+                      ) : (
+                        <BrowserIcon className="h-6 w-6" />
+                      )}
+                    </Button>
+                  </TooltipTrigger>
+                  <TooltipContent>
+                    {debugStore.isDebugMode
+                      ? "Turn off Browser"
+                      : "Turn on Browser"}
+                  </TooltipContent>
+                </Tooltip>
+              </TooltipProvider>
+            )}
             <TooltipProvider>
               <Tooltip>
                 <TooltipTrigger asChild>

skyvern-frontend/src/routes/workflows/editor/Workspace.tsx

@@ -36,7 +36,6 @@ import { DebuggerRun } from "@/routes/workflows/debugger/DebuggerRun";
 import { useWorkflowRunQuery } from "@/routes/workflows/hooks/useWorkflowRunQuery";
 import { DebuggerRunOutput } from "@/routes/workflows/debugger/DebuggerRunOutput";
 import { DebuggerPostRunParameters } from "@/routes/workflows/debugger/DebuggerPostRunParameters";
-import { useDebugStore } from "@/store/useDebugStore";
 import { useWorkflowPanelStore } from "@/store/WorkflowPanelStore";
 import {
   useWorkflowHasChangesStore,
@@ -88,7 +87,6 @@ function Workspace({
   const [content, setContent] = useState("actions");
   const { workflowPanelState, setWorkflowPanelState, closeWorkflowPanel } =
     useWorkflowPanelStore();
-  const debugStore = useDebugStore();
   const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes);
   const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges);
   const saveWorkflow = useWorkflowSave();
@@ -488,7 +486,7 @@ function Workspace({
         </div>
       )}
 
-      {debugStore.isDebugMode && (
+      {showBrowser && (
         <div
           className="absolute right-6 top-[8.5rem] h-[calc(100vh-9.5rem)]"
           style={{ zIndex: rankedItems.history ?? 1 }}