diff --git a/ui/packages/portal/src/controls/NotebookEditorControl.tsx b/ui/packages/portal/src/controls/NotebookEditorControl.tsx
index 8deeb481b..5e9e2eb34 100644
--- a/ui/packages/portal/src/controls/NotebookEditorControl.tsx
+++ b/ui/packages/portal/src/controls/NotebookEditorControl.tsx
@@ -24,6 +24,10 @@ export default function NotebookEditorControl({notebook}: NotebookEditorView) {
return (
);
}
diff --git a/ui/packages/portal/src/features/notebook/Elements.tsx b/ui/packages/portal/src/features/notebook/Elements.tsx
index 7dfc47b07..b308c04dc 100644
--- a/ui/packages/portal/src/features/notebook/Elements.tsx
+++ b/ui/packages/portal/src/features/notebook/Elements.tsx
@@ -6,16 +6,14 @@ import { triggerContentWidthChanged } from "./contentWidthEvent";
import { debounce } from "lodash";
import { usePrefixHashFragment } from "../../shared/hooks/usePrefixHashFragment";
import { useNotebookEditorSelector } from "./NotebookEditor";
-import { ControlStarter } from "@open-smc/application/src/ControlStarter";
-import { useProject } from "../project/projectStore/hooks/useProject";
-import { useEnv } from "../project/projectStore/hooks/useEnv";
+import { ControlStarter } from "@open-smc/application/ControlStarter";
export function Elements() {
const permissions = useNotebookEditorSelector("permissions");
const elementIds = useNotebookEditorSelector("elementIds");
const {canEdit} = permissions;
- const {project} = useProject();
- const {envId} = useEnv();
+ const projectId = useNotebookEditorSelector("projectId");
+ const envId = useNotebookEditorSelector("envId");
const notebook = useNotebookEditorSelector("notebook");
usePrefixHashFragment();
@@ -23,7 +21,7 @@ export function Elements() {
const renderedElements = elementIds.map(elementId => {
return (
);
diff --git a/ui/packages/portal/src/features/notebook/NotebookEditor.tsx b/ui/packages/portal/src/features/notebook/NotebookEditor.tsx
index a7a8077f9..735605681 100644
--- a/ui/packages/portal/src/features/notebook/NotebookEditor.tsx
+++ b/ui/packages/portal/src/features/notebook/NotebookEditor.tsx
@@ -27,8 +27,6 @@ import { Elements } from "./Elements";
// import { NotebookSessionDialog } from "./NotebookSessionDialog";
import { useSubscribeToNewElements } from "./documentStore/hooks/useSubscribeToNewElements";
import { NotebookElementDto } from "../../controls/ElementEditorControl";
-import { useProject } from "../project/projectStore/hooks/useProject";
-import { useEnv } from "../project/projectStore/hooks/useEnv";
import { useProjectSelector } from "../project/projectStore/projectStore";
import { useApi } from "../../ApiProvider";
import { makeUseSelector } from "@open-smc/store/src/useSelector";
@@ -59,11 +57,13 @@ export function useElementsStore() {
interface NotebookEditorProps {
notebook: NotebookDto;
+ projectId: string;
+ envId: string;
+ canEdit: boolean;
+ canRun: boolean;
}
-export function NotebookEditor({notebook}: NotebookEditorProps) {
- const {project: {id: projectId}} = useProject();
- const {envId} = useEnv();
+export function NotebookEditor({notebook, projectId, envId, canEdit, canRun}: NotebookEditorProps) {
const {path: notebookPath} = useProjectSelector("activeFile");
const [contextValue, setContextValue] = useState();
const {EnvAccessControlApi} = useApi();
@@ -71,8 +71,6 @@ export function NotebookEditor({notebook}: NotebookEditorProps) {
useEffect(() => {
(async function () {
const {elementIds} = notebook;
- const canEdit = await EnvAccessControlApi.getPermission(projectId, 'Edit', envId, notebook.id);
- const canRun = await EnvAccessControlApi.getPermission(projectId, 'Session', envId, notebook.id);
const elementModels = elementIds.map(elementId => getElementModel(elementId));
const elementsById = keyBy(elementModels, c => c.elementId);
// const markdown = getDocumentMarkdown(elementIds, elementsById, projectId, envId, notebookPath);
@@ -84,6 +82,8 @@ export function NotebookEditor({notebook}: NotebookEditorProps) {
const initialState = {
notebook,
+ projectId,
+ envId,
elementIds,
selectedElementIds,
activeElementId,
diff --git a/ui/packages/portal/src/features/notebook/SessionButton.tsx b/ui/packages/portal/src/features/notebook/SessionButton.tsx
index a86294d2d..497eba561 100644
--- a/ui/packages/portal/src/features/notebook/SessionButton.tsx
+++ b/ui/packages/portal/src/features/notebook/SessionButton.tsx
@@ -10,9 +10,7 @@ import { useEffect, useState } from "react";
import { isEmpty, round } from "lodash";
import { SessionSpecification } from "../../app/notebookFormat";
import { SessionTierOverlay } from "./SessionTierOverlay";
-import { useProject } from "../project/projectStore/hooks/useProject";
-import button from "@open-smc/ui-kit/src/components/buttons.module.scss"
-import { useEnv } from "../project/projectStore/hooks/useEnv";
+import button from "@open-smc/ui-kit/src/components/buttons.module.scss";
import { ImageSettingsDto, SessionTierSpecificationDto } from "../project/projectSessionApi";
import { rcTooltipOptions } from "../../shared/tooltipOptions";
import { useNotebookEditorSelector } from "./NotebookEditor";
@@ -27,8 +25,8 @@ export function SessionButton() {
const [specification, setSpecification] = useState();
const [availableTiers, setAvailableTiers] = useState();
const [availableImages, setAvailableImages] = useState();
- const {project} = useProject();
- const {env} = useEnv();
+ const projectId = useNotebookEditorSelector("projectId");
+ const envId = useNotebookEditorSelector("envId");
const {canRun} = useNotebookEditorSelector("permissions");
const [overlayOpen, setOverlayOpen] = useState(false);
const {ProjectSessionApi, EnvSessionApi} = useApi();
@@ -44,7 +42,7 @@ export function SessionButton() {
if (sessionStatus === "Running") {
setSpecification(notebook?.currentSession?.specification);
} else if (!isEmpty(tiers)) {
- const settings = await EnvSessionApi.getSessionSettings(project.id, env.id, notebook.id);
+ const settings = await EnvSessionApi.getSessionSettings(projectId, envId, notebook.id);
const defaultTier = tiers[0];
const defaultImage = images[0];
const {cpu, memory, systemName: tier} = (settings.tier ?? defaultTier);
@@ -53,7 +51,7 @@ export function SessionButton() {
}
}
)()
- }, [env.id, project.id, notebook.id])
+ }, [envId, projectId, notebook.id])
const getText = () => {
if (sessionStatus === 'Starting' || sessionStatus === 'Initializing') {
diff --git a/ui/packages/portal/src/features/notebook/documentStore/documentState.ts b/ui/packages/portal/src/features/notebook/documentStore/documentState.ts
index 18d955db2..ad84752e4 100644
--- a/ui/packages/portal/src/features/notebook/documentStore/documentState.ts
+++ b/ui/packages/portal/src/features/notebook/documentStore/documentState.ts
@@ -20,6 +20,8 @@ export interface NotebookEditorState {
readonly permissions: NotebookPermissions,
readonly notebook: NotebookDto;
readonly elementIds: string[];
+ readonly projectId: string;
+ readonly envId: string;
readonly markdown?: Record;
readonly updateMarkdownDebouncedFunc: DebouncedFunc<(func: () => void) => void>;
readonly activeElementId?: string;
diff --git a/ui/packages/portal/src/features/notebook/documentStore/hooks/useUpdateMarkdown.ts b/ui/packages/portal/src/features/notebook/documentStore/hooks/useUpdateMarkdown.ts
index 36229aa1f..e6f891396 100644
--- a/ui/packages/portal/src/features/notebook/documentStore/hooks/useUpdateMarkdown.ts
+++ b/ui/packages/portal/src/features/notebook/documentStore/hooks/useUpdateMarkdown.ts
@@ -1,22 +1,20 @@
-import { useElementsStore, useNotebookEditorStore } from "../../NotebookEditor";
+import {useElementsStore, useNotebookEditorSelector, useNotebookEditorStore} from "../../NotebookEditor";
import { getCompiler, getParser } from "../../markdownParser";
import { ElementMarkdown } from "../documentState";
-import { useProject } from "../../../project/projectStore/hooks/useProject";
-import { useEnv } from "../../../project/projectStore/hooks/useEnv";
import { useProjectSelector } from "../../../project/projectStore/projectStore";
import { useCallback } from "react";
export function useUpdateMarkdown() {
const notebookEditorStore = useNotebookEditorStore();
const elementsStore = useElementsStore();
- const {env} = useEnv();
- const {project: {id: projectId}} = useProject();
+ const projectId = useNotebookEditorSelector("projectId");
+ const envId = useNotebookEditorSelector("envId");
const activeFile = useProjectSelector("activeFile");
return useCallback((updatedElementIds?: string[]) => {
const {elementIds, markdown} = notebookEditorStore.getState();
const models = elementsStore.getState();
- const parse = getParser(true, projectId, env.id, activeFile.path);
+ const parse = getParser(true, projectId, envId, activeFile.path);
const compile = getCompiler(true);
notebookEditorStore.setState(state => {
@@ -42,5 +40,5 @@ export function useUpdateMarkdown() {
state.markdown = newMarkdown;
});
- }, [notebookEditorStore, elementsStore, env, projectId, activeFile]);
+ }, [notebookEditorStore, elementsStore, envId, projectId, activeFile]);
}
\ No newline at end of file