This project is the current frontend for the Inmanta service orchestrator.
The eventual goal is to replace the current dashboard entirely.
The console is developed in TypeScript using React and React Query.
Testing is performed using Cypress and Vitest.
The frontend uses (Patternfly)[https://www.patternfly.org/] for its UI components. The choice of the framework is motived by:
- Use by many (mostly RedHat backed) infra products (Cockpit, OpenStack, OpenShift, Keycloak, etc.). The advantage of this is that the scope of the component is similar and the design will have some familiarity.
- There are extensive UX guidelines included with the project both in general and per component.
| Command | Description |
|---|---|
prebuild |
runs yarn clean |
build |
builds the project with Vite in production mode |
start |
starts the development server with Vite over HTTP |
start:https |
starts the development server with Vite over HTTPS (HTTPS=true) |
proxy |
starts a local CORS proxy to http://127.0.0.1:8888/ using local-cors-proxy |
proxy:https |
starts a local CORS proxy to https://127.0.0.1:8888/ using local-cors-proxy |
test |
runs the test suite with Vitest |
test:ci |
runs the test suite with Vitest in CI mode (CI=true, --silent) |
test:ui |
runs Vitest in UI mode |
format |
runs Prettier and formats the code |
format:check |
runs Prettier in check mode without writing changes |
lint |
runs ESLint and generates a report in the command line, failing on any warnings (--max-warnings=0) |
lint:fix |
runs ESLint and attempts to automatically fix possible warnings/errors |
build:bundle-profile |
builds the project with Vite in analyze mode (vite build --mode analyze) |
bundle-profile:analyze |
runs yarn build:bundle-profile to generate a bundle profile |
clean |
runs rimraf dist |
delete:reports |
deletes the Cypress reports in cypress/reports |
precypress-test |
runs yarn run delete:reports before Cypress tests |
cypress-test:oss |
runs the Cypress tests headless for OSS (requires install:orchestrator:oss) |
cypress-test:iso |
runs the Cypress tests headless for ISO (requires install:orchestrator:iso) |
cypress-test:keycloak |
runs the Cypress tests headless for OSS + Keycloak (requires install:orchestrator:keycloak) |
cypress-test:local-auth |
runs the Cypress tests headless for OSS with local authentication (requires install:orchestrator:local-auth) |
package-cleanup |
runs node clean_up_packages |
check-circular-deps |
runs madge --circular ./src/index.tsx |
install:orchestrator:keycloak |
creates a Docker container with an OSS orchestrator configured with Keycloak |
install:orchestrator |
base command to install more specific versions of the orchestrator. The different arguments are: version release branch. For more details, see (local-setup repo)[https://code.inmanta.com/inmanta/local-setup] |
install:orchestrator:iso |
creates a Docker container with the latest ISO orchestrator |
install:orchestrator:pxsdc |
creates a Docker container with an orchestrator for the pxsdc project |
install:orchestrator:oss |
creates a Docker container with the latest dev OSS orchestrator |
install:orchestrator:ci |
CI command to setup the orchestrator on Jenkins. Requires different arguments depending on the needed test suite. See install:orchestrator |
kill-server |
removes the temp-folder and kills the containers |
update:dist |
manual update of the dist folder in the container. Requires a container to run. |
You will need to create a file env.sh in shell-scripts folder containing the variable GITLAB_TOKEN. It should look like so:
export GITLAB_TOKEN=xxxxxxxxxxxxxxxxx
(xxxx equals your PAT token, of course.)
If you want to run the ISO version of the application, you will need to add a npm access token to the JointJS Plus library in your env file.
JOINTJS_NPM_TOKEN=jjs-xxxxxxxxxxxxxx
To enable authentication with keycloak, you can use environment variables, e.g. add the following variable to a dotenv (.env in the root of the project) file (further information on https://github.com/motdotla/dotenv)
VITE_SHOULD_USE_AUTH=true
The keycloak parameters need to be specified in an external file in the production environment, called config.js, following the example src/config.js file.
The base url of the backend services can also be specified here, e.g.:
VITE_API_BASEURL=http://localhost:8888
Cypress can be configured via cypress.json (or command line arguments). It is always best to run the install commands from the web-console repository.
To setup the containers for the latest version of ISO, you can run these steps:
yarn install:orchestrator:iso
If you need to run the test-suit headless you can chain it with:
cypress-test:iso
or run npx cypress open if you need to run the tests in the cypress UI.
(If you want to run the cypress UI) Adjust the cypress.json file to have
env: {
edition: "oss",
project: "oss-frontend",
},Then :
yarn install:orchestrator:oss
If you need to run the test-suit headless you can chain it with:
cypress-test:oss
or run npx cypress open if you need to run the tests in the cypress UI.