diff --git a/frontend/src/components/notebook/NotebookDescriptionBox.tsx b/frontend/src/components/notebook/NotebookDescriptionBox.tsx
index 10613d9..962396f 100644
--- a/frontend/src/components/notebook/NotebookDescriptionBox.tsx
+++ b/frontend/src/components/notebook/NotebookDescriptionBox.tsx
@@ -1,9 +1,11 @@
import {faBook} from "@fortawesome/free-solid-svg-icons"
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
-import {Box, BringAttention as B, Code, Heading, Idiomatic as I} from "@steffo/bluelib-react"
+import {Box, BringAttention as B, Code, Form, Heading, Idiomatic as I} from "@steffo/bluelib-react"
import * as React from "react"
import {useCacheContext} from "../../contexts/cache"
import {useNotebookContext} from "../../contexts/notebook"
+import {NotebookLabButton} from "./NotebookLabButton"
+import {NotebookLegacyButton} from "./NotebookLegacyButton"
export function NotebookDescriptionBox(): JSX.Element | null {
@@ -40,6 +42,12 @@ export function NotebookDescriptionBox(): JSX.Element | null {
A {notebook.value.is_running ? "running" : "stopped"} notebook using {notebook.value.container_image}
{locked_text}.
+
+
+
+
+
)
}
diff --git a/frontend/src/components/notebook/NotebookLabButton.tsx b/frontend/src/components/notebook/NotebookLabButton.tsx
new file mode 100644
index 0000000..695ef98
--- /dev/null
+++ b/frontend/src/components/notebook/NotebookLabButton.tsx
@@ -0,0 +1,37 @@
+import {faFlask} from "@fortawesome/free-solid-svg-icons"
+import * as React from "react"
+import {useAuthorizationContext} from "../../contexts/authorization"
+import {useNotebookContext} from "../../contexts/notebook"
+import {IconText} from "../elements/IconText"
+import {NavigateButton} from "../elements/NavigateButton"
+
+
+export function NotebookLabButton(): JSX.Element | null {
+ const authorization = useAuthorizationContext()
+ const notebook = useNotebookContext()
+
+ const canOpen =
+ React.useMemo(
+ () => authorization &&
+ notebook &&
+ (
+ notebook.value.locked_by === null || notebook.value.locked_by === authorization?.state.user?.id
+ ),
+ [notebook, authorization],
+ )
+
+ if(!notebook) {
+ return null
+ }
+ if(!notebook.value.lab_url) {
+ return null
+ }
+
+ return (
+
+
+ Open JupyterLab
+
+
+ )
+}
diff --git a/frontend/src/components/notebook/NotebookLegacyButton.tsx b/frontend/src/components/notebook/NotebookLegacyButton.tsx
new file mode 100644
index 0000000..154cd17
--- /dev/null
+++ b/frontend/src/components/notebook/NotebookLegacyButton.tsx
@@ -0,0 +1,37 @@
+import {faBook} from "@fortawesome/free-solid-svg-icons"
+import * as React from "react"
+import {useAuthorizationContext} from "../../contexts/authorization"
+import {useNotebookContext} from "../../contexts/notebook"
+import {IconText} from "../elements/IconText"
+import {NavigateButton} from "../elements/NavigateButton"
+
+
+export function NotebookLegacyButton(): JSX.Element | null {
+ const authorization = useAuthorizationContext()
+ const notebook = useNotebookContext()
+
+ const canOpen =
+ React.useMemo(
+ () => authorization &&
+ notebook &&
+ (
+ notebook.value.locked_by === null || notebook.value.locked_by === authorization?.state.user?.id
+ ),
+ [notebook, authorization],
+ )
+
+ if(!notebook) {
+ return null
+ }
+ if(!notebook.value.legacy_notebook_url) {
+ return null
+ }
+
+ return (
+
+
+ Open legacy Jupyter Notebook
+
+
+ )
+}