Integrate OAuth2 OIDC Authentication

.eslintrc.json

@@ -39,7 +39,13 @@
             "style": "kebab-case"
           }
         ],
-        "change-detection-strategy/on-push": "error"
+        "change-detection-strategy/on-push": "error",
+        "@typescript-eslint/explicit-function-return-type": [
+          "error",
+          {
+            "allowExpressions": true
+          }
+        ]
       },
       "plugins": [
         "ngrx",

README.md

@@ -1,28 +1,45 @@
-# cloud-portal
-APPUiO Cloud Portal (Web Frontend)
+# APPUiO Cloud Portal  (Web Frontend)
 
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.0.3.
+## Build
 
-## Development server
+Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.
 
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+## Running Unit Tests
 
-## Code scaffolding
+Run `npm run test` to execute the unit tests with jest.
 
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+## Running End-to-End Tests
 
-## Build
+Run `npm run e2e` to execute the end-to-end tests with cypress.
+
+## Development
+
+1. Run `docker compose up`
+2. Run `npm start`
+
+## Keycloak
+
+You find Keycloak on http://localhost:8080/.
 
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
+The default admin credentials are `admin:admin`.
 
-## Running unit tests
+The default user credentials are `user:1234`.
 
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+### Export realm
 
-## Running end-to-end tests
+If you have made changes to the realm, be sure to export it via the command line.
+The export via the UI does not contain the credentials and is therefore worthless for our purpose!
 
-Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
+```
+docker compose exec auth /opt/jboss/keycloak/bin/standalone.sh \
+  -Djboss.socket.binding.port-offset=100 \
+  -Dkeycloak.migration.action=export \
+  -Dkeycloak.migration.provider=singleFile \
+  -Dkeycloak.migration.realmName=appuio \
+  -Dkeycloak.migration.usersExportStrategy=REALM_FILE \
+  -Dkeycloak.migration.file=/tmp/realm.json
+```
 
-## Further help
+## Configuration
 
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+The APPUiO Cloud Portal can be configured with the `config.json` file which is located in the `src` directory.

angular.json

@@ -59,6 +59,7 @@
             "inlineStyleLanguage": "scss",
             "assets": [
               "src/favicon.ico",
+              "src/config.json",
               "src/assets"
             ],
             "styles": [

docker-compose.yml

@@ -0,0 +1,15 @@
+services:
+  auth:
+    image: "quay.io/keycloak/keycloak:15.0.2"
+    ports:
+      - "8080:8080"
+    environment:
+      KEYCLOAK_USER: admin
+      KEYCLOAK_PASSWORD: admin
+      KEYCLOAK_IMPORT: /tmp/realm.json
+    volumes:
+      - keycloak_data:/opt/jboss/keycloak/standalone/data
+      - ./docker/realm.json:/tmp/realm.json
+volumes:
+  keycloak_data:
+    driver: local