Module not found: Error [Multiple] about jupyter-ui HOT 10 CLOSED

Thx for reporing.

"Failed to parse source map"

These are warning from the jupyterlab packages, not ideal, the app should not fail because of that. I will look at how to avoid that in the future.

"Module not found: Error... ".

We rely on jupyterlab and lumino alpha versions. Have you setup the resolutions in package.json as described on https://github.com/datalayer/jupyter-react/tree/main/examples/create-react-app#jupyterlab-version-resolutions?

Also, while it somewhat compiles, the library is making a request which looks a default to 'http://localhost:3000/api/jupyter/api', even though I defined a path property on the Notebook component.

Better to fully fix the build failure... then you can update the content of your index.html with the location of your juptyer server https://github.com/datalayer/jupyter-react/blob/main/packages/react/public/index.html

    <script id="datalayer-config-data" type="application/json">
      {
        "jupyterServerHttpUrl": "http://localhost:8686/api/jupyter",
        "jupyterServerWsUrl": "ws://localhost:8686/api/jupyter",
        "jupyterToken": "60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6"
      }
    </script>

Overall, I will work on documentation in the coming days to have easier onboarding for the usage.

from jupyter-ui.

Good to hear your progress.
The machinery for the CORS is there on the javascript side, for the python server, you need something like https://github.com/datalayer/jupyter-react/blob/d3f7f7bc00d8932f4a04d7b1d03ed689ee2778f2/dev/config/jupyter_server_config.py#L37-L64

from jupyter-ui.

I will try the resolutions and I'll report how it went

from jupyter-ui.

After adding react and jupyterlab resolutions, I ran npm ci but I am still getting the same warnings/errors.

EDIT: After adding the file .env with the GENERATE_SOURCEMAP=false, the warning disappeared. Only the errors remain.

with this

from jupyter-ui.

EDIT: After adding the file .env with the GENERATE_SOURCEMAP=false, the warning disappeared.

I will add that to the doc.

Only the errors remain.

Can you try with yarn, npm does not take resolutions into account I think, and last time I tested with npm gave errors indeed.

from jupyter-ui.

It did work with yarn.
I also gave the prop jupyterServerHttpUrl to Jupyter component and it kinda worked. Now I just need to handle Auth and CORS with my localhost and my Jupyter server.

Thanks 👍

from jupyter-ui.

Hello @echarles ,
Do you know how do I get the Jupyter token dynamically?

I am putting one directly on the Jupyter component, alongside the JupyterServerHttpUrl. Is there a way to retrieve the token beforehand?

from jupyter-ui.

@rubenbarroshv The props you give to the Notebook component are optional. If you don't provide them, jupyter-react will fall back to the information present in the HTML page shipped by the jupyter server.

In JupyterLab world, the token is injected by the jupter-server in the HTML shipped to the browser via a json script tag (you can see that looking at the source of your default JupyterLab page.

<script id="jupyter-config-data" type="application/json">
{
...  
  "token": "56f13426e36de5e1f9fa69ab471de2d1a9a47....", 
...
  }
</script>

Now, if your token needs to be retrieved from somewhere else (eg. via a REST API and not shipped in the HTML...), you could achieve that with a simple React hook, and only create your Notebook component when you get that token in your react app.

from jupyter-ui.

Yes, I am trying to do the react hook but I didn't find the endpoint to obtain the token yet.

If you have any tip send me a dm or something. I am closing the issue since this is out of scope already. :)

from jupyter-ui.

Yes, I am trying to do the react hook but I didn't find the endpoint to obtain the token yet.

Well, there is no such endpoint in the standard Jupyter server API to get the secured token. It is a bit chicken and egg issue. Normally, you provide the token via the first URL you ask to the server. Jupyter Server 2 has now a new feature to have custom Identity Providers https://jupyter-server.readthedocs.io/en/latest/operators/security.html Using those identity providers are to be considered in other libraries I am working on, but I am interested to discuss how to better support them from jupyter-react.

If you have any tip send me a dm or something. I am closing the issue since this is out of scope already. :)

Sounds good. I have just sent you a linkedin connection request.

from jupyter-ui.