diff --git a/app/.env.development b/app/.env.development index e18d37f..e1e6ab3 100644 --- a/app/.env.development +++ b/app/.env.development @@ -1,2 +1,2 @@ -VITE_DEFAULT_AGENT_ENDPOINT=http://localhost:9988 -VITE_DEFAULT_RUNNER_ENDPOINT=ws://localhost:9988/ws +VITE_DEFAULT_AGENT_ENDPOINT=http://localhost:9977 +VITE_DEFAULT_RUNNER_ENDPOINT=ws://localhost:9977/ws diff --git a/app/package.json b/app/package.json index 8d9ee9f..16cdf42 100644 --- a/app/package.json +++ b/app/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "dev": "vite", + "typecheck": "tsc -p tsconfig.app.json --noEmit", "build": "vite build", "lint": "eslint .", "format": "prettier --ignore-path .prettierignore --write .", diff --git a/app/src/App.tsx b/app/src/App.tsx index d58f2be..fc5c793 100644 --- a/app/src/App.tsx +++ b/app/src/App.tsx @@ -52,6 +52,7 @@ import { Interceptor } from "@connectrpc/connect"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { SidePanelProvider } from "./contexts/SidePanelContext"; import { appState } from "./lib/runtime/AppState"; +import GlobalToast from "./components/Toast"; const queryClient = new QueryClient(); @@ -133,7 +134,12 @@ function App({ branding, initialState = {} }: AppProps) { - + + @@ -179,7 +186,7 @@ function App({ branding, initialState = {} }: AppProps) { ); } -function NotebookStoreInitializer() { +function NotebookStoreInitializer({ agentEndpoint }: { agentEndpoint?: string }) { const { ensureAccessToken } = useGoogleAuth(); const { store, setStore } = useNotebookStore(); const { fsStore, setFsStore } = useFilesystemStore(); @@ -224,8 +231,6 @@ function NotebookStoreInitializer() { return; } - // Use the same agent endpoint for the ContentsService. - const agentEndpoint = import.meta.env.VITE_DEFAULT_AGENT_ENDPOINT; if (!agentEndpoint) { return; } @@ -245,7 +250,7 @@ function NotebookStoreInitializer() { appState.setContentsStore(contentsStoreInstance); contentsInstanceRef.current = contentsStoreInstance; setContentsStore(contentsStoreInstance); - }, [contentsStore, setContentsStore]); + }, [agentEndpoint, contentsStore, setContentsStore]); return null; } diff --git a/app/src/components/Actions/Actions.tsx b/app/src/components/Actions/Actions.tsx index a4cee3a..4eaa0f6 100644 --- a/app/src/components/Actions/Actions.tsx +++ b/app/src/components/Actions/Actions.tsx @@ -9,7 +9,7 @@ import { } from "react"; import { create } from "@bufbuild/protobuf"; -import { Box, ScrollArea, Tabs, Text } from "@radix-ui/themes"; +import { Box, Button, Card, ScrollArea, Tabs, Text } from "@radix-ui/themes"; import { useParams } from "react-router-dom"; import { Cross2Icon } from "@radix-ui/react-icons"; @@ -94,35 +94,17 @@ function RunActionButton({ return "Run code"; }; - const isRunning = exitCode === null && pid !== null; - const isSuccess = exitCode !== null && exitCode === 0; - const isError = exitCode !== null && exitCode > 0; - const isIdle = exitCode === null && pid === null; - return ( - + {exitCode !== null && exitCode === 0 && } + {exitCode !== null && exitCode > 0 && } + ); } @@ -551,7 +533,9 @@ export function Action({ cellData, isFirst }: { cellData: CellData; isFirst: boo // Determine if this cell is a markdown cell (either MARKUP kind or CODE with markdown language) const isMarkdownCell = useMemo(() => { if (!cell) return false; + // Check if cell kind is MARKUP if (cell.kind === parser_pb.CellKind.MARKUP) return true; + // Check if cell is CODE but with markdown language const lang = (cell.languageId ?? "").toLowerCase(); return lang === "markdown" || lang === "md"; }, [cell]); @@ -560,23 +544,23 @@ export function Action({ cellData, isFirst }: { cellData: CellData; isFirst: boo return null; } - // Render markdown cells with in-place rendering (Jupyter-style): - // no run button, no output area – just the markdown rendered in-place. + // Render markdown cells with in-place rendering (Jupyter-style) + // No run button, no output area - just the markdown rendered in-place if (isMarkdownCell) { return (
{!isFirst && ( -
+
)} - +
-
+
- {sequenceLabel.trim() && ( - - {sequenceLabel} - - )} + + [{sequenceLabel}] +
-
+
Language @@ -710,7 +673,7 @@ export function Action({ cellData, isFirst }: { cellData: CellData; isFirst: boo id={languageSelectId} value={selectedLanguage} onChange={handleLanguageChange} - className="cursor-pointer rounded border border-gray-200 bg-white px-2 py-0.5 text-xs text-gray-700 focus:outline-none focus:ring-2 focus:ring-amber-300/50 focus:border-amber-300" + className="cursor-pointer rounded border border-sky-200/70 bg-[#111111] px-2 py-0.5 text-[10px] font-mono text-gray-100 focus:outline-none focus:ring-2 focus:ring-sky-200/50" > {LANGUAGE_OPTIONS.map((option) => (