Embed CAL-web in an example application

[Gelio]

As part of #41 and #34 we will have to embed the CAL-web frontend in the main BalticLSC's frontend, which is written in Vue. Let's try to recreate that scenario by creating a simple application that embeds Sirius Web as part of it.

The application could be a standalone HTML file that displays a few elements and embeds Sirius Web into one of them. The code for embedding Sirius Web could look like so:

calWeb.render({
  container: document.querySelector('.main'),
  authenticationToken: '1234', // BalticLSC authentication token
  projectId: '1234', // the ID of the project created in Sirius Web backend
});

The render call would then call ReactDOM.render and pass the authenticationToken and projectId as props to the rest of the application.

To do

• Extract the workbench UI and the hooks for fetching the representation into a separate component. It should show the Workbench component and set the authentication token in zustand

• Make sure the change authentication token button (Make it easy to change the BalticLSC authentication token #43) is only shown in the main application (use a prop to toggle its visibility)

• Create this calWeb.render function that calls ReactDOM and renders the application in some HTML element

• Adjust the build options to build one or more JS bundles that could be embedded in another application.

  This could also be done by another build tool, not webpack from Create React App.

• Create an example HTML page that renders CAL-web in one of its HTML elements

Depends on

• Make it easy to change the BalticLSC authentication token #43