React-based administration interface for the Cenit platform.

• Repositories
• Tech Stack
• Quick start (recommended: backend compose)
• Local development
• Runtime configuration
• E2E checks
• Run UI image standalone
• Troubleshooting
• Contributing
• License

• Backend: cenit-io/cenit
• UI (this repo): cenit-io/ui

• React 19
• Vite 7
• MUI 7 (@mui/material, @mui/icons-material, @mui/x-date-pickers)
• Runtime config via window.appConfig (config.js)

This UI is usually run by the backend Docker Compose stack.

• Docker Desktop (or Docker Engine + Compose v2 plugin)
• git
• Node.js 20.x (for local npm workflows)

git clone https://github.com/cenit-io/cenit.git
git clone https://github.com/cenit-io/ui.git

Expected layout:

cenit-io/
  cenit/
  ui/

cd cenit
docker compose up -d
docker compose ps

For fast UI iteration (live reload from this repo without rebuilding UI image):

cd ../cenit
docker compose --profile dev up -d mongo_server redis rabbitmq server ui_dev

• UI: http://localhost:3002
• Backend: http://localhost:3000
• RabbitMQ: http://localhost:15672

If ui is not at ../ui, set:

export CENIT_UI_CONTEXT=/absolute/path/to/ui
docker compose up -d --build

Install dependencies and run the Vite dev server:

npm ci --legacy-peer-deps
npm start

Notes:

• UI dev server runs at http://localhost:3002.
• Backend is expected at http://localhost:3000.
• If 3002 is already in use, stop the running UI container/process first.

Other scripts:

npm test
npm run build
npm run typecheck

Runtime values are injected through config.js (window.appConfig), especially in Docker runtime.

Resolution order:

1. window.appConfig (runtime config.js)
2. import.meta.env
3. UI defaults (admin, http://localhost:3000, http://localhost:3002)

Important variables:

REACT_APP_USE_ENVIRONMENT_CONFIG=true
REACT_APP_TIMEOUT_SPAN=300000
REACT_APP_APP_ID=admin
REACT_APP_LOCALHOST=http://localhost:3002
REACT_APP_CENIT_HOST=http://localhost:3000

Related backend values (from backend compose):

HOMEPAGE=http://localhost:3000
CENIT_UI=http://localhost:3002

UI E2E scripts in this repo delegate to backend scripts so both repos share one stable contract.

scripts/e2e/cenit_ui_login.sh
# or
npm run e2e:login

scripts/e2e/cenit_ui_contact_flow.sh
# or
npm run e2e:contact-flow

Driver note:

• CENIT_E2E_DRIVER=pwcli can fail on large inline run-code payloads in some environments.
• The backend delegated runner now auto-falls back to the node-playwright driver for this case.

Default contract:

• Namespace: E2E_CONTACT_FLOW
• Data type: Contact
• Record: John Contact E2E
• Cleanup enabled by default (CENIT_E2E_CLEANUP=1)
• Deterministic DB reset enabled by default (CENIT_E2E_RESET_STACK=1, CENIT_E2E_BUILD_STACK=0)

Useful overrides:

# Reuse running backend stack (skip deterministic reset)
CENIT_E2E_AUTOSTART=0 scripts/e2e/cenit_ui_contact_flow.sh

# Run headed
CENIT_E2E_HEADED=1 scripts/e2e/cenit_ui_contact_flow.sh

# Use a unique namespace (helps CI and local validation without cleanup collisions)
CENIT_E2E_DATATYPE_NAMESPACE="E2E_UI_$(date +%s)" \
CENIT_E2E_CLEANUP=0 \
scripts/e2e/cenit_ui_contact_flow.sh

If backend repo is not a sibling at ../cenit:

export CENIT_ROOT=/absolute/path/to/cenit

Artifacts are produced by the backend runner at:

• ../cenit/output/playwright

UI Docker image is published to ghcr.io/cenit-io/ui by .github/workflows/docker-publish.yml:

• master branch push publishes :latest
• develop branch push publishes :develop
• release tags v*.*.* publish semver tags
• every publish includes immutable sha-<gitsha> tags

OCI labels (source/revision/created) are attached by docker/metadata-action.

When running backend prod-like compose from ../cenit, keep UI/backend images on the same channel:

CENIT_SERVER_IMAGE=ghcr.io/cenit-io/cenit:develop \
CENIT_UI_IMAGE=ghcr.io/cenit-io/ui:develop \
../cenit/scripts/compose-prod.sh up -d

This repo includes a UI CI workflow for pull_request to develop/master and push to develop:

1. npm ci --legacy-peer-deps
2. npm run build
3. npm run typecheck (temporary non-blocking during JS->TS rollout)
4. npm test

docker pull ghcr.io/cenit-io/ui:latest
docker run -dti \
  -e REACT_APP_USE_ENVIRONMENT_CONFIG=true \
  -e REACT_APP_APP_ID=admin \
  -e REACT_APP_LOCALHOST=http://127.0.0.1:3002 \
  -e REACT_APP_CENIT_HOST=http://127.0.0.1:3000 \
  -p 3002:80 \
  --name cenit-ui \
  ghcr.io/cenit-io/ui:latest

For develop branch parity:

docker pull ghcr.io/cenit-io/ui:develop

Then open http://localhost:3002.

For end-to-end Docker setup details, see:

• Docker-instalation.md
• development.md

Contributions are welcome.

• Report bugs and request features in the backend issue tracker: github.com/cenit-io/cenit/issues
• Open UI pull requests here: github.com/cenit-io/ui/pulls

See LICENSE.md.