datalayer-examples / jupyter-react-cra-example

🪐 ⚛️ Jupyter Create React App example.
https://jupyter-ui.datalayer.tech
MIT License
7 stars 1 forks source link

Cell Execution feature for Notebooks #3

Open Prahmodh-Raj1 opened 5 days ago

Prahmodh-Raj1 commented 5 days ago

I'm currently unable to run the cells in the Notebook, that is being rendered in the React Application.

Link to the code: https://github.com/Prahmodh-Raj1/Jupyter-UI-Test

Terminal Error (on clicking the Run button of the cell): Requesting cell execution without any cell executor defined. Falling back to default execution.

Kindly help me resolve this issue. cc @echarles

echarles commented 5 days ago

Just tried and have a few questions/comments.

But it looks like you are building and running, so maybe just force reload your browser, it may help to solve the issue you reported.

Prahmodh-Raj1 commented 5 days ago

I'm using npm to install the dependencies, and 'npm start' to start the cra application. @echarles

Prahmodh-Raj1 commented 5 days ago

And is the current content of the App.tsx file enough to get the cells executing? Or should I need to add some other components too?

const App(()=>{

  const [tab, setTab] = useState(0);
  return (
    <>
      <Box>
        <Jupyter startDefaultKernel={true}>
              <Notebook
                path="Documents/Sample.ipynb"
                CellSidebar={CellSidebarRun}
              />
        </Jupyter>
      </Box>
    </>
  );
});
echarles commented 5 days ago

If you see the Notebook, that should be enough. Can you bumpt to 0.11.0? Any errors in the devtools console?

Prahmodh-Raj1 commented 5 days ago

I tried updating to version 0.11.0, but i'm facing the following error when I execute the "npm install" command:

`

npm install
npm notice 
npm notice New minor version of npm available! 10.5.2 -> 10.8.1
npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.8.1
npm notice Run npm install -g npm@10.8.1 to update!
npm notice 
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: react-redux@9.1.2
npm ERR! Found: @types/react@18.0.27
npm ERR! node_modules/@types/react
npm ERR!   dev @types/react@"18.0.27" from the root project
npm ERR!   peerOptional @types/react@"^18.0.0" from @primer/react@36.6.0
npm ERR!   node_modules/@datalayer/primer-addons/node_modules/@primer/react
npm ERR!     @primer/react@"36.6.0" from @datalayer/primer-addons@0.3.0
npm ERR!     node_modules/@datalayer/primer-addons
npm ERR!       @datalayer/primer-addons@"0.3.0" from the root project
npm ERR!       1 more (@datalayer/jupyter-react)
npm ERR!   9 more (@jupyterlab/apputils, @primer/react, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peerOptional @types/react@"^18.2.25" from react-redux@9.1.2
npm ERR! node_modules/react-redux
npm ERR!   react-redux@"^9.1.2" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @types/react@18.3.3
npm ERR! node_modules/@types/react
npm ERR!   peerOptional @types/react@"^18.2.25" from react-redux@9.1.2
npm ERR!   node_modules/react-redux
npm ERR!     react-redux@"^9.1.2" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:
npm ERR! /Users/xyz/.npm/_logs/2024-06-28T08_32_52_492Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: /Users/xyz/.npm/_logs/2024-06-28T08_32_52_492Z-debug-0.log
Prahmodh-Raj1 commented 5 days ago

If you see the Notebook, that should be enough. Can you bumpt to 0.11.0? Any errors in the devtools console?

This is the error in the devtools console: @echarles

Requesting cell execution without any cell executor defined. Falling back to default execution.

echarles commented 4 days ago

@Prahmodh-Raj1 I have release jupyter-react 0.12.0 and pushed https://github.com/datalayer-examples/jupyter-react-cra-example/commit/3e0584724861edd7fc30188702fcfcd2a8330afc to update the example

On my env, the latest example works fine with both yarn and npm.

Can you try that?, hopefully it should fix the issue (which is linked to mixed non-compatible versions of jupyterlab, hence I have removed the constraints on the resolutions).

Prahmodh-Raj1 commented 4 days ago

The cell execution is still failing in spite of updating the application with the latest commit: 3e05847.

The devtools console still produces the same error: Requesting cell execution without any cell executor defined. Falling back to default execution.

It would be great if you could please share another repo where the cell execution has been tested? @echarles

image
echarles commented 4 days ago

It would be great if you could please share another repo where the cell execution has been tested? @echarles

Thx again for tyring @Prahmodh-Raj1 The safest is to clone from zero https://github.com/datalayer-examples/jupyter-react-cra-example and use yarn to build/start (did a check also with npm and worked fine on my side).

If you still have the issue, this will probably come from non coherent juptyerlab packages in your node_modules (you would have to force them via resolutions).