Skip to content

Commit 2b222e0

Browse files
heisbrotmlsmaycon
andauthored
Init Dashboard V2 (#316)
* Init Dashboard V2 * Update README.md * use dedicated vars and prevent docker push on PRs --------- Co-authored-by: Maycon Santos <[email protected]>
1 parent 4612f6c commit 2b222e0

File tree

570 files changed

+32332
-55542
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

570 files changed

+32332
-55542
lines changed

.eslintrc.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"extends": ["next/core-web-vitals","prettier"],
3+
"plugins": ["simple-import-sort"],
4+
"rules": {
5+
"simple-import-sort/imports": [
6+
"warn",
7+
{
8+
"groups": [["^\\u0000", "^@?\\w", "^[^.]", "^\\."]]
9+
}
10+
],
11+
"simple-import-sort/exports": "warn"
12+
}
13+
}

.github/workflows/build_and_push.yml

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@ on:
77
- "**"
88
pull_request:
99

10+
env:
11+
IMAGE_NAME: netbirdio/dashboard
12+
1013
jobs:
1114
build_n_push:
1215
runs-on: ubuntu-latest
@@ -16,15 +19,16 @@ jobs:
1619
- name: setup-node
1720
uses: actions/setup-node@v3
1821
with:
19-
node-version: '16'
22+
node-version: '18'
2023
cache: 'npm'
2124

2225
- name: Install dependencies
2326
run: npm install
2427

28+
- run: echo '{}' > .local-config.json
29+
2530
- name: Build
26-
# skiping fail on warning for now
27-
run: CI=false npm run build
31+
run: npm run build
2832
-
2933
name: Set up QEMU
3034
uses: docker/setup-qemu-action@v2
@@ -36,14 +40,14 @@ jobs:
3640
id: meta
3741
uses: docker/metadata-action@v4
3842
with:
39-
images: wiretrustee/dashboard
43+
images: ${{ env.IMAGE_NAME }}
4044
-
4145
name: Login to DockerHub
4246
if: github.event_name != 'pull_request'
4347
uses: docker/login-action@v2
4448
with:
45-
username: ${{ secrets.DOCKER_USER }}
46-
password: ${{ secrets.DOCKER_TOKEN }}
49+
username: ${{ secrets.NB_DOCKER_USER }}
50+
password: ${{ secrets.NB_DOCKER_TOKEN }}
4751
-
4852
name: Docker build and push
4953
uses: docker/build-push-action@v3
@@ -53,4 +57,4 @@ jobs:
5357
push: ${{ github.event_name != 'pull_request' }}
5458
platforms: linux/amd64,linux/arm64,linux/arm
5559
tags: ${{ steps.meta.outputs.tags }}
56-
labels: ${{ steps.meta.outputs.labels }}
60+
labels: ${{ steps.meta.outputs.labels }}

.github/workflows/e2e-tests.yml

Lines changed: 0 additions & 42 deletions
This file was deleted.

.gitignore

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,42 +2,42 @@
22

33
# dependencies
44
/node_modules
5-
/node_modules.bkp
65
/.pnp
76
.pnp.js
87

98
# testing
109
/coverage
1110

11+
# next.js
12+
/.next/
13+
/out/
14+
1215
# production
1316
/build
17+
/out
1418

1519
# misc
1620
.DS_Store
17-
.env.local
18-
.env.development.local
19-
.env.test.local
20-
.env.production.local
21+
*.pem
2122

23+
# debug
2224
npm-debug.log*
2325
yarn-debug.log*
2426
yarn-error.log*
2527

26-
src/auth_config.json
27-
.idea
28-
.eslintcache
29-
src/.local-config*.json
30-
/public/OidcServiceWorker.js
31-
/public/OidcTrustedDomains.js
32-
/e2e-tests/node_modules/
33-
/e2e-tests/playwright-report/
34-
/e2e-tests/test-results/
35-
/test-results/
36-
/playwright-report/
37-
.env
38-
Caddyfile
39-
docker-compose.yml
40-
machinekey/
41-
management.json
42-
turnserver.conf
43-
zitadel.env
28+
# local env files
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# typescript
35+
*.tsbuildinfo
36+
next-env.d.ts
37+
38+
# config
39+
.local-config.json
40+
.configs/.local-config.zitadel.json
41+
.configs/.staging-config.json
42+
.configs/.temp-config.json
43+
.configs

AUTHORS

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
Mikhail Bragin (https://github.com/braginini)
22
Maycon Santos (https://github.com/mlsmaycon)
3+
Wiretrustee UG (haftungsbeschränkt)

LICENSE

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
BSD 3-Clause License
22

3-
Copyright (c) 2021 Wiretrustee AUTHORS
3+
Copyright (c) 2024 Wiretrustee UG (haftungsbeschränkt) & AUTHORS
44

55
Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
66

README.md

Lines changed: 30 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# NetBird dashboard
1+
# NetBird Dashboard
22

33
This project is the UI for NetBird's Management service.
44

@@ -17,15 +17,15 @@ The dashboard makes it possible to:
1717
- define access controls
1818

1919
## Some Screenshots
20-
<img src="./media/auth.png" alt="auth"/>
21-
<img src="./media/peers.png" alt="peers"/>
22-
<img src="./media/add-peer.png" alt="add-peer"/>
20+
<img src="./src/assets/screenshots/peers.png" alt="peers"/>
21+
<img src="./src/assets/screenshots/add-peer.png" alt="add-peer"/>
2322

2423

2524
## Technologies Used
2625

26+
- NextJS
2727
- ReactJS
28-
- AntD UI framework
28+
- Tailwind CSS
2929
- Auth0
3030
- Nginx
3131
- Docker
@@ -38,28 +38,28 @@ Auth0 so far is the only 3rd party dependency that can't be really self-hosted.
3838

3939
1. Install [Docker](https://docs.docker.com/get-docker/)
4040
2. Register [Auth0](https://auth0.com/) account
41-
3. Running Wiretrustee UI Dashboard requires the following Auth0 environmental variables to be set (see docker command below):
41+
3. Running NetBird UI Dashboard requires the following Auth0 environmental variables to be set (see docker command below):
4242

4343
`AUTH0_DOMAIN` `AUTH0_CLIENT_ID` `AUTH0_AUDIENCE`
4444

4545
To obtain these, please use [Auth0 React SDK Guide](https://auth0.com/docs/quickstart/spa/react/01-login#configure-auth0) up until "Configure Allowed Web Origins"
4646

47-
4. Wiretrustee UI Dashboard uses Wiretrustee Management Service HTTP API, so setting `NETBIRD_MGMT_API_ENDPOINT` is required. Most likely it will be `http://localhost:33071` if you are hosting Management API on the same server.
47+
4. NetBird UI Dashboard uses NetBirds Management Service HTTP API, so setting `NETBIRD_MGMT_API_ENDPOINT` is required. Most likely it will be `http://localhost:33071` if you are hosting Management API on the same server.
4848
5. Run docker container without SSL (Let's Encrypt):
4949

5050
```shell
51-
docker run -d --name wiretrustee-dashboard \
51+
docker run -d --name netbird-dashboard \
5252
--rm -p 80:80 -p 443:443 \
5353
-e AUTH0_DOMAIN=<SET YOUR AUTH DOMAIN> \
5454
-e AUTH0_CLIENT_ID=<SET YOUR CLIENT ID> \
5555
-e AUTH0_AUDIENCE=<SET YOUR AUDIENCE> \
5656
-e NETBIRD_MGMT_API_ENDPOINT=<SET YOUR MANAGEMETN API URL> \
57-
wiretrustee/dashboard:main
57+
netbirdio/dashboard:main
5858
```
5959
6. Run docker container with SSL (Let's Encrypt):
6060

6161
```shell
62-
docker run -d --name wiretrustee-dashboard \
62+
docker run -d --name netbird-dashboard \
6363
--rm -p 80:80 -p 443:443 \
6464
-e NGINX_SSL_PORT=443 \
6565
-e LETSENCRYPT_DOMAIN=<YOUR PUBLIC DOMAIN> \
@@ -68,11 +68,26 @@ Auth0 so far is the only 3rd party dependency that can't be really self-hosted.
6868
-e AUTH0_CLIENT_ID=<SET YOUR CLEITN ID> \
6969
-e AUTH0_AUDIENCE=<SET YOUR AUDIENCE> \
7070
-e NETBIRD_MGMT_API_ENDPOINT=<SET YOUR MANAGEMETN API URL> \
71-
wiretrustee/dashboard:main
71+
netbirdio/dashboard:main
7272
```
7373

7474
## How to run local development
75-
1. Install node 16
76-
2. create and update the `src/.local-config.json` file. This file should contain values to be replaced from `src/config.json`
77-
3. run `npm install`
78-
4. run `npm run start dev`
75+
76+
1. Install [Node](https://nodejs.org/)
77+
2. Create and update the `.local-config.json` file. This file should contain values to be replaced from `config.json`
78+
3. Run `npm install` to install dependencies
79+
4. Run `npm run dev` to start the development server
80+
81+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
82+
83+
You can start editing by modifying the code inside `src/..`
84+
The page auto-updates as you edit the file.
85+
86+
## How to migrate from old dashboard (v1)
87+
88+
The new dashboard comes with a new docker image `netbirdio/dashboard:main`.
89+
To migrate from the old dashboard (v1) `wiretrustee/dashboard:main` to the new one, please follow the steps below.
90+
91+
1. Stop the dashboard container `docker compose down dashboard`
92+
2. Replace the docker image name in your `docker-compose.yml` with `netbirdio/dashboard:main`
93+
3. Recreate the dashboard container `docker compose up -d --force-recreate dashboard`

components.json

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema.json",
3+
"style": "default",
4+
"rsc": true,
5+
"tsx": true,
6+
"tailwind": {
7+
"config": "tailwind.config.ts",
8+
"css": "src/app/globals.css",
9+
"baseColor": "neutral",
10+
"cssVariables": false
11+
},
12+
"aliases": {
13+
"components": "@/components",
14+
"utils": "@/utils/helpers"
15+
}
16+
}

src/config.json renamed to config.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@
55
"authClientSecret": "$AUTH_CLIENT_SECRET",
66
"authScopesSupported": "$AUTH_SUPPORTED_SCOPES",
77
"authAudience": "$AUTH_AUDIENCE",
8-
98
"apiOrigin": "$NETBIRD_MGMT_API_ENDPOINT",
109
"grpcApiOrigin": "$NETBIRD_MGMT_GRPC_API_ENDPOINT",
11-
"hotjarTrackID": "$NETBIRD_HOTJAR_TRACK_ID",
1210
"redirectURI": "$AUTH_REDIRECT_URI",
1311
"silentRedirectURI": "$AUTH_SILENT_REDIRECT_URI",
1412
"tokenSource": "$NETBIRD_TOKEN_SOURCE",
15-
"dragQueryParams": "$NETBIRD_DRAG_QUERY_PARAMS"
13+
"dragQueryParams": "$NETBIRD_DRAG_QUERY_PARAMS",
14+
"hotjarTrackID": "$NETBIRD_HOTJAR_TRACK_ID",
15+
"googleAnalyticsID": "$NETBIRD_GOOGLE_ANALYTICS_ID"
1616
}

cypress.config.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { defineConfig } from "cypress";
2+
3+
export default defineConfig({
4+
e2e: {
5+
baseUrl: "http://localhost:3000",
6+
},
7+
component: {
8+
devServer: {
9+
framework: "next",
10+
bundler: "webpack",
11+
},
12+
},
13+
viewportWidth: 1920,
14+
viewportHeight: 1080,
15+
});

0 commit comments

Comments
 (0)