Skip to content

Commit ac62a7c

Browse files
sanchojafsanchojaf
authored
Merge pull request #256 from cenit-io/fix-docker
Update README and Docker setup for cenit-ui
2 parents e38c4d0 + 1ca5f97 commit ac62a7c

File tree

8 files changed

+215
-89
lines changed

8 files changed

+215
-89
lines changed

‎.env.docker‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
REACT_APP_USE_ENVIRONMENT_CONFIG=false
1+
# ui/.env.docker
2+
REACT_APP_USE_ENVIRONMENT_CONFIG=true
23
REACT_APP_TIMEOUT_SPAN=300000
34
REACT_APP_APP_ID=admin
4-
REACT_APP_LOCALHOST=https://app.cenit.io
5-
REACT_APP_CENIT_HOST=https://server.cenit.io
5+
REACT_APP_LOCALHOST=http://localhost:3002
6+
REACT_APP_CENIT_HOST=http://localhost:3000

‎.gitignore‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@
55
/.pnp
66
.pnp.js
77

8+
9+
tree.sh
10+
relevant_files_content.txt
11+
812
# testing
913
/coverage
1014

‎Docker-instalation.md‎

Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
# Docker Installation Guide
2+
3+
This document outlines how to run Cenit using Docker Compose, including both the backend server (known as **cenit** on GitHub) and the frontend admin UI (known as **cenit-ui** on GitHub).
4+
5+
- **cenit** repository (backend) is available at: [https://github.com/cenit-io/cenit](https://github.com/cenit-io/cenit)
6+
- **cenit-ui** repository (frontend) is available at: [https://github.com/cenit-io/ui](https://github.com/cenit-io/ui)
7+
8+
## Prerequisites
9+
10+
- Docker
11+
- Docker Compose
12+
13+
## Running with Docker Compose
14+
15+
1. **Clone the repositories**
16+
17+
```bash
18+
git clone https://github.com/cenit-io/cenit.git # Backend
19+
git clone https://github.com/cenit-io/ui.git # Frontend
20+
```
21+
22+
2. **Directory structure**
23+
24+
Ensure your directory layout is as follows:
25+
26+
```
27+
├── cenit/ # Backend
28+
│ ├── Dockerfile
29+
│ ├── docker-compose.yml
30+
│ └── ...
31+
└── ui/ # Frontend
32+
├── Dockerfile
33+
├── env.sh
34+
├── .env.docker
35+
└── ...
36+
```
37+
38+
3. **Configure environment variables**
39+
40+
Update the `docker-compose.yml` in the **cenit** repository. Refer to the full file here: [cenit/docker-compose.yml](https://github.com/cenit-io/cenit/blob/main/docker-compose.yml).
41+
42+
In summary, set for **ui** service:
43+
44+
```yaml
45+
ui:
46+
build:
47+
context: ./ui
48+
dockerfile: Dockerfile
49+
ports:
50+
- "3002:80"
51+
environment:
52+
- REACT_APP_USE_ENVIRONMENT_CONFIG=true
53+
- REACT_APP_TIMEOUT_SPAN=300000
54+
- REACT_APP_APP_ID=admin
55+
- REACT_APP_LOCALHOST=http://localhost:3002
56+
- REACT_APP_CENIT_HOST=http://localhost:3000
57+
```
58+
59+
And for **server** service:
60+
61+
```yaml
62+
server:
63+
build: .
64+
ports:
65+
- "3000:8080"
66+
environment:
67+
- MONGODB_URI=mongodb://mongo_server/cenit
68+
- REDIS_HOST=redis
69+
- HOMEPAGE=http://localhost:3000
70+
- CENIT_UI=http://localhost:3002
71+
- RABBITMQ_BIGWIG_TX_URL=amqp://cenit_rabbit:cenit_rabbit@rabbitmq/cenit_rabbit_vhost
72+
- SCHEDULER_LOOKUP_INTERVAL=8
73+
- UNICORN_WORKERS=4
74+
- MAXIMUM_UNICORN_CONSUMERS=4
75+
depends_on:
76+
- mongo_server
77+
- redis
78+
```
79+
80+
Other services (RabbitMQ, MongoDB, Redis) use defaults. See full compose: [cenit/docker-compose.yml](https://github.com/cenit-io/cenit/blob/main/docker-compose.yml).
81+
82+
4. **Backend (cenit) Dockerfile highlights**
83+
84+
View the complete Dockerfile here: [cenit/Dockerfile](https://github.com/cenit-io/cenit/blob/main/Dockerfile).
85+
86+
Key points:
87+
88+
- Based on `ruby:2.7.4`.
89+
- Installs system dependencies (Node, Yarn, libraries).
90+
- Sets up Rails environment and Unicorn server.
91+
- `env.sh` writes `config/application.yml` with `HOMEPAGE` and `Cenit::Admin:default_uri`.
92+
93+
5. **Frontend (cenit-ui) Dockerfile highlights**
94+
95+
View the complete UI Dockerfile here: [ui/Dockerfile](https://github.com/cenit-io/ui/blob/main/Dockerfile).
96+
97+
Key points:
98+
99+
- Multi-stage build using `node:20-alpine` and `nginx:stable-alpine`.
100+
- Builds React app, then serves via Nginx.
101+
- `env.sh` reads `.env.docker` to generate `config.js` at runtime.
102+
- `.env.docker` contains:
103+
104+
```env
105+
REACT_APP_USE_ENVIRONMENT_CONFIG=true
106+
REACT_APP_TIMEOUT_SPAN=300000
107+
REACT_APP_APP_ID=admin
108+
REACT_APP_LOCALHOST=http://localhost:3002
109+
REACT_APP_CENIT_HOST=http://localhost:3000
110+
```
111+
112+
6. **Build and Start**
113+
114+
From the **cenit** directory (where `docker-compose.yml` resides):
115+
116+
```bash
117+
docker-compose build
118+
docker-compose up -d
119+
```
120+
121+
This will launch:
122+
123+
- **cenit-ui** on port **3002**
124+
- **cenit-server** on port **3000** (internally listening on 8080)
125+
- **rabbitmq** (management UI on 15672)
126+
- **mongo_server** (MongoDB on default 27017)
127+
- **redis** (Redis on default 6379)
128+
129+
7. **Access the Applications**
130+
131+
- Admin UI: [http://localhost:3002](http://localhost:3002)
132+
- Backend Web Console (login page): [http://localhost:3000](http://localhost:3000)
133+
- RabbitMQ Management: [http://localhost:15672](http://localhost:15672)
134+
135+
That’s it! Your local Cenit instance (both backend and admin UI) should now be up and running via Docker Compose.
136+
137+
---
138+
139+
_For more details, see the GitHub repositories:_
140+
141+
- [https://github.com/cenit-io/cenit](https://github.com/cenit-io/cenit) (backend)
142+
- [https://github.com/cenit-io/ui](https://github.com/cenit-io/ui) (frontend)

‎Dockerfile‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
# => Build container
2-
FROM node:16-alpine as builder
3-
1+
FROM node:20-alpine as builder
42
WORKDIR /app
53
ENV PATH /app/node_modules/.bin:$PATH
64
COPY package.json .
@@ -12,17 +10,25 @@ COPY env.sh .
1210
COPY src src/
1311
COPY public public/
1412
COPY conf conf/
13+
14+
# Ensure Webpack uses legacy OpenSSL provider on Node 20
15+
ENV NODE_OPTIONS=--openssl-legacy-provider
1516
RUN npm run build
1617

17-
# => Run container
1818
FROM nginx:stable-alpine
19-
2019
RUN rm -rf /etc/nginx/conf.d
2120
COPY conf /etc/nginx
21+
22+
# 1) Copy your built React “ /build ” into /usr/share/nginx/html
2223
COPY --from=builder /app/build /usr/share/nginx/html/
24+
2325
EXPOSE 80
2426
WORKDIR /usr/share/nginx/html
27+
28+
# 2) Copy env.sh and .env.docker next to index.html
2529
COPY ./env.sh .
2630
COPY .env.docker .env
2731
RUN chmod +x env.sh
32+
33+
# 3) At container start, overwrite/create config.js and then launch nginx
2834
CMD ["/bin/sh", "-c", "/usr/share/nginx/html/env.sh && nginx -g \"daemon off;\""]

‎README.md‎

Lines changed: 44 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,109 +1,76 @@
1+
````markdown
12
![cenit_io](https://user-images.githubusercontent.com/4213488/150586701-53545c9b-b4f9-497f-9782-ef6a19715ecd.svg)
23

3-
[![Code Climate](https://codeclimate.com/github/openjaf/cenit/badges/gpa.svg)](https://codeclimate.com/github/openjaf/cenit)
44
[![codebeat](https://codebeat.co/badges/1b596784-b6c1-4ce7-b739-c91b873e4b5d)](https://codebeat.co/projects/github-com-cenit-io-cenit)
55
[![license](https://img.shields.io/packagist/l/doctrine/orm.svg)]()
66

7-
[![OpenAPIs in collection][numApis-image]][apisDir-link]
8-
[![OpenAPI specs][numSpecs-image]][apisDir-link]
9-
[![Endpoints][endpoints-image]][apisDir-link]
7+
# Cenit IO Admin App (UI)
108

11-
[![Follow on Twitter][twitterFollow-image]][twitterFollow-link]
9+
This is a React‐based administration interface for the Cenit IO integration platform (iPaaS).
1210

11+
- **cenit-server (GitHub “cenit” repo)**:
12+
https://github.com/cenit-io/cenit
1313

14-
* [Join our Slack][join-slack-link]
15-
[(cenitio.slack.com)][join-slack-link]
16-
* [docs](https://docs.cenit.io/)
17-
* [Shared Collections](https://cenit.io/setup~shared_collection)
18-
* support@cenit.io
14+
- **cenit-ui (GitHub “ui” repo)**:
15+
https://github.com/cenit-io/ui
1916

20-
# [Cenit](https://web.cenit.io)
17+
---
2118

22-
Is a 100% open integration-platform-as-a-service (iPaaS) that's modern, powerful, yet hackable to the core, ready to [use in the cloud](https://web.cenit.io) or on-premises. It is designed to solve unique integrations needs, orchestrate data flows that may involve types of protocols and data formats, and provide API management capabilities. All of which can support a wide range of integration use cases. It is particularly valuable to embrace a pervasive integration approach.
19+
## Installation
2320

24-
To install and learn more about the platform check the [documentation](https://docs.cenit.io/)
21+
For a complete, Docker‐based installation of both the backend (`cenit-server`) and this UI, see the [Docker Installation Guide](docker-installation.md).
22+
(The guide includes links to the relevant `docker-compose.yml` and Dockerfiles.)
2523

26-
# Cenit IO Admin App
24+
---
2725

28-
This is a React application for the administration of a Cenit IO integration Platform (iPaaS).
26+
## Configuration
2927

30-
## Configuring the Admin App
31-
32-
1. **Configure the Cenit listening port.** In the example bellow the Admin App runs is listening to the port `3000` therefore the local
33-
instance of Cenit IO server should run listening to a different one, in the example the port `3001`.
34-
35-
Set the docker runtime environment variables to the right values:
28+
If you need to customize the Admin App (outside of Docker), set the following environment variables:
3629

30+
- `REACT_APP_USE_ENVIRONMENT_CONFIG=true`
3731
- `REACT_APP_APP_ID=admin`
38-
- `REACT_APP_CENIT_HOST=http://127.0.0.1:3001`
39-
40-
## Configuring the Cenit Backend Server
41-
32+
- `REACT_APP_LOCALHOST=http://localhost:3002`
33+
- `REACT_APP_CENIT_HOST=http://<YOUR_CENIT_SERVER_HOST>:<PORT>`
4234

43-
1. **Configure the Cenit HOMEPAGE URL.** Make sure that Cenit HOMEPAGE URL is synced with the listening port by including
44-
in the `config/application.yml` file the entry `HOMEPAGE: http://127.0.0.1:3001`.
35+
These values will be injected at runtime into `config.js`.
4536

46-
2. **Configure the default URI for the admin app.** By default the Admin App runs listening to the port `3000`.
47-
Include in the `config/application.yml` file the entry `'Cenit::Admin:default_uri': http://localhost:3000`.
37+
---
4838

49-
```
50-
# config/application.yml
51-
HOMEPAGE: http://127.0.0.1:3001
52-
'Cenit::Admin:default_uri': http://localhost:3000
53-
# ...
54-
```
55-
56-
And that's all!
5739
## Run with Docker
5840

59-
60-
`docker pull ghcr.io/cenit-io/ui:latest`
61-
62-
```
63-
docker run -dti -e REACT_APP_LOCALHOST=http://127.0.0.1:3001 \
64-
-e REACT_APP_CENIT_HOST=http://127.0.0.1:3000 \
65-
-p 3000:80 \
66-
--name cenit-ui ghcr.io/cenit-io/ui:latest
41+
To pull and run the latest UI image:
42+
43+
```bash
44+
docker pull ghcr.io/cenit-io/ui:latest
45+
docker run -dti \
46+
-e REACT_APP_USE_ENVIRONMENT_CONFIG=true \
47+
-e REACT_APP_APP_ID=admin \
48+
-e REACT_APP_LOCALHOST=http://127.0.0.1:3002 \
49+
-e REACT_APP_CENIT_HOST=http://127.0.0.1:3000 \
50+
-p 3002:80 \
51+
--name cenit-ui ghcr.io/cenit-io/ui:latest
6752
```
68-
Navigate to http://localhost:3000/ in your browser to view the app.
69-
70-
## Contributing
53+
````
7154

72-
Cenit IO is an open-source project and we encourage contributions.
55+
Navigate to [http://localhost:3002](http://localhost:3002) in your browser to access the Admin App.
7356

74-
In the spirit of [free software](http://www.fsf.org/licensing/essays/free-sw.html), **everyone** is encouraged to help
75-
improve this project.
57+
---
7658

77-
Here are some ways **you** can contribute:
78-
79-
* by using prerelease master branch
80-
* by reporting [bugs](https://github.com/cenit-io/cenit/issues/new)
81-
* by writing or editing [documentation](https://github.com/cenit-io/cenit-docs)
82-
* by writing [needed code](https://github.com/cenit-io/cenit/labels/feature_request) or [finishing code](https://github.com/cenit-io/cenit/labels/address_feedback)
83-
* by [refactoring code](https://github.com/cenit-io/cenit/labels/address_feedback)
84-
* by reviewing [pull requests](https://github.com/cenit-io/cenit/pulls)
85-
86-
## To the Community
87-
88-
Since the challenge is great, we have to build the solution in the community. We believe that a successful open source project provides confidence, facilitates creating a broad community, where everyone can share answers to questions, suggestions, and improvements to the platform.
59+
## Contributing
8960

90-
We encourage the community to join the initiative and contribute to the dissemination of the project, sharing integration experiences, collaborating in the detection and resolution of errors, or contributing to the development of the project. We hope that those who join us enjoy the collaborative work and the challenge of achieving something innovative and useful that can potentially serve many others.
61+
Cenit IO is an open‐source project and we welcome contributions. Here are some ways to get involved:
9162

92-
## Screenshots
63+
- Report bugs or request features: [Issues](https://github.com/cenit-io/cenit/issues/new)
64+
- Improve documentation:
9365

94-
![menu](https://user-images.githubusercontent.com/81880890/138016967-c57c2dfb-7f1a-49e2-a266-24cb3312acd1.png)
66+
- Platform docs: [https://github.com/cenit-io/cenit-docs](https://github.com/cenit-io/cenit-docs)
67+
- UI docs: [https://github.com/cenit-io/ui](https://github.com/cenit-io/ui)
9568

96-
![tenants](https://user-images.githubusercontent.com/81880890/138016971-58acec6d-7397-4f16-85bc-6aa995fb2021.png)
69+
- Submit code changes:
9770

98-
![cenit_type](https://user-images.githubusercontent.com/81880890/138016964-a537ce74-892a-4583-a7da-deb762876b86.png)
71+
- Feature requests: [https://github.com/cenit-io/cenit/labels/feature_request](https://github.com/cenit-io/cenit/labels/feature_request)
72+
- Feedback/bug fixes: [https://github.com/cenit-io/cenit/labels/address_feedback](https://github.com/cenit-io/cenit/labels/address_feedback)
9973

100-
![mobile_view](https://user-images.githubusercontent.com/81880890/148653137-d3459280-425b-449f-b206-cb8da0d73e1f.png)
74+
- Review and merge pull requests
10175

102-
[numApis-image]: https://api.apis.guru/badges/apis_in_collection.svg
103-
[numSpecs-image]: https://api.apis.guru/badges/openapi_specs.svg
104-
[endpoints-image]: https://api.apis.guru/badges/endpoints.svg
105-
[apisDir-link]: https://github.com/APIs-guru/openapi-directory/tree/master/APIs
106-
[twitterFollow-image]: https://img.shields.io/twitter/follow/cenit_io.svg?style=social
107-
[twitterFollow-link]: https://twitter.com/intent/follow?screen_name=cenit_io
108-
[join-slack-link]:
109-
https://join.slack.com/t/cenitio/shared_invite/zt-1cq3uab52-Jv93F8R2BJ9MHr00SbCqjw
76+
---

‎env.sh‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
#!/bin/sh
2-
# line endings must be \n, not \r\n !
32
echo "window.appConfig = {" > ./config.js
4-
awk -F '=' '{ print $1 ": \"" (ENVIRON[$1] ? ENVIRON[$1] : $2) "\"," }' ./.env >> ./config.js
5-
echo "}" >> ./config.js
3+
awk -F '=' '!/^[[:space:]]*#/ && NF { print $1 ": \"" (ENVIRON[$1] ? ENVIRON[$1] : $2) "\"," }' ./.env >> ./config.js
4+
echo "}" >> ./config.js

public/config.js renamed to public/config.js.disabled

File renamed without changes.

‎src/App.js‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,11 @@ function reset() {
2626

2727
function App() {
2828

29+
// 1) At startup, read the runtime config.js value into session.cenitBackendBaseUrl:
30+
if (window.appConfig && window.appConfig.REACT_APP_CENIT_HOST) {
31+
session.cenitBackendBaseUrl = window.appConfig.REACT_APP_CENIT_HOST;
32+
}
33+
2934
const [authorizing, setAuthorizing] = useState(true);
3035
const [clientId, setClientId] = useState(session.clientId);
3136
const [error, setError] = useState(false);
@@ -48,7 +53,9 @@ function App() {
4853
if (authorizing && clientId) {
4954
const params = QueryString.parse(window.location.search.slice(1, window.location.search.length));
5055

51-
if (params.cenitHost) session.cenitBackendBaseUrl = params.cenitHost;
56+
if (params.cenitHost) {
57+
session.cenitBackendBaseUrl = params.cenitHost;
58+
}
5259

5360
let authorize;
5461
if (params.code) {

0 commit comments

Comments
 (0)