release: 0.9.0

feat: add environment variable to change the caddy port in Docker
feat: use improve table for users and audit logs
2025-12-10 07:12:59 +03:00 · 2024-10-18 08:23:55 +02:00 · 2024-10-18 08:23:06 +02:00 · 2024-10-16 08:49:19 +02:00 · 2024-10-13 15:55:17 +02:00 · 2024-10-11 20:53:47 +02:00
127 changed files with 3878 additions and 1130 deletions
--- a/.env.example
+++ b/.env.example
@@ -1 +1,2 @@
 PUBLIC_APP_URL=http://localhost
+TRUST_PROXY=false
--- a/.github/workflows/build-and-push-docker-image.yml
+++ b/.github/workflows/build-and-push-docker-image.yml
@@ -23,6 +23,9 @@ jobs:
          username: ${{ secrets.DOCKER_REGISTRY_USERNAME }}
          password: ${{ secrets.DOCKER_REGISTRY_PASSWORD }}

+      - name: Download GeoLite2 City database
+        run: MAXMIND_LICENSE_KEY=${{ secrets.MAXMIND_LICENSE_KEY }} sh scripts/download-ip-database.sh
+    
      - name: Build and push
        uses: docker/build-push-action@v4
        with:
--- a/.github/workflows/e2e-tests.yml
+++ b/.github/workflows/e2e-tests.yml
@@ -16,6 +16,9 @@ jobs:
          cache: 'npm'
          cache-dependency-path: frontend/package-lock.json
      
+      - name: Create dummy GeoLite2 City database
+        run: touch ./backend/GeoLite2-City.mmdb
+      
      - name: Build Docker Image
        run: docker build -t stonith404/pocket-id .
      - name: Run Docker Container
--- a/.gitignore
+++ b/.gitignore
@@ -34,4 +34,5 @@ vite.config.ts.timestamp-*
 # Application specific
 data
 /frontend/tests/.auth
-pocket-id-backend
+pocket-id-backend
+/backend/GeoLite2-City.mmdb
--- a/.version
+++ b/.version
@@ -1 +1 @@
-0.4.0
+0.9.0
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,109 @@
+## [](https://github.com/stonith404/pocket-id/compare/v0.8.1...v) (2024-10-18)
+
+
+### Features
+
+* add environment variable to change the caddy port in Docker ([ff06bf0](https://github.com/stonith404/pocket-id/commit/ff06bf0b34496ce472ba6d3ebd4ea249f21c0ec3))
+* use improve table for users and audit logs ([11ed661](https://github.com/stonith404/pocket-id/commit/11ed661f86a512f78f66d604a10c1d47d39f2c39))
+
+
+### Bug Fixes
+
+* allow copy to clipboard for client secret ([29748cc](https://github.com/stonith404/pocket-id/commit/29748cc6c7b7e5a6b54bfe837e0b1a98fa1ad594))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.8.0...v) (2024-10-11)
+
+
+### Bug Fixes
+
+* add key id to JWK ([282ff82](https://github.com/stonith404/pocket-id/commit/282ff82b0c7e2414b3528c8ca325758245b8ae61))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.7.1...v) (2024-10-04)
+
+
+### Features
+
+* add location based on ip to the audit log ([025378d](https://github.com/stonith404/pocket-id/commit/025378d14edd2d72da76e90799a0ccdd42cf672c))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.7.0...v) (2024-10-03)
+
+
+### Bug Fixes
+
+* initials don't get displayed if Gravatar avatar doesn't exist ([e095628](https://github.com/stonith404/pocket-id/commit/e09562824a794bc7d240e9d229709d4b389db7d5))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.6.0...v) (2024-10-03)
+
+
+### ⚠ BREAKING CHANGES
+
+* add ability to set light and dark mode logo
+
+### Features
+
+* add ability to set light and dark mode logo ([be45eed](https://github.com/stonith404/pocket-id/commit/be45eed125e33e9930572660a034d5f12dc310ce))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.5.3...v) (2024-10-02)
+
+
+### Features
+
+* add copy to clipboard option for OIDC client information ([f82020c](https://github.com/stonith404/pocket-id/commit/f82020ccfb0d4fbaa1dd98182188149d8085252a))
+* add gravatar profile picture integration ([365734e](https://github.com/stonith404/pocket-id/commit/365734ec5d8966c2ab877c60cfb176b9cdc36880))
+* add user groups ([24c948e](https://github.com/stonith404/pocket-id/commit/24c948e6a66f283866f6c8369c16fa6cbcfa626c))
+
+
+### Bug Fixes
+
+* only return user groups if it is explicitly requested ([a4a90a1](https://github.com/stonith404/pocket-id/commit/a4a90a16a9726569a22e42560184319b25fd7ca6))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.5.2...v) (2024-09-26)
+
+
+### Bug Fixes
+
+* add space to "Firstname" and "Lastname" label ([#31](https://github.com/stonith404/pocket-id/issues/31)) ([d6a9bb4](https://github.com/stonith404/pocket-id/commit/d6a9bb4c09efb8102da172e49c36c070b341f0fc))
+* port environment variables get ignored in caddyfile ([3c67765](https://github.com/stonith404/pocket-id/commit/3c67765992d7369a79812bc8cd216c9ba12fd96e))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.5.1...v) (2024-09-19)
+
+
+### Bug Fixes
+
+* updated application name doesn't apply to webauthn credential ([924bb14](https://github.com/stonith404/pocket-id/commit/924bb1468bbd8e42fa6a530ef740be73ce3b3914))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.5.0...v) (2024-09-16)
+
+
+### Features
+
+* **email:** improve email templating ([#27](https://github.com/stonith404/pocket-id/issues/27)) ([64cf562](https://github.com/stonith404/pocket-id/commit/64cf56276a07169bc601a11be905c1eea67c4750))
+
+
+### Bug Fixes
+
+* debounce oidc client and user search ([9c2848d](https://github.com/stonith404/pocket-id/commit/9c2848db1d93c230afc6c5f64e498e9f6df8c8a7))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.4.1...v) (2024-09-09)
+
+
+### Features
+
+* add audit log with email notification ([#26](https://github.com/stonith404/pocket-id/issues/26)) ([9121239](https://github.com/stonith404/pocket-id/commit/9121239dd7c14a2107a984f9f94f54227489a63a))
+
+## [](https://github.com/stonith404/pocket-id/compare/v0.4.0...v) (2024-09-06)
+
+
+### Features
+
+* add name claim to userinfo endpoint and id token ([4e7574a](https://github.com/stonith404/pocket-id/commit/4e7574a297307395603267c7a3285d538d4111d8))
+
+
+### Bug Fixes
+
+* limit width of content on large screens ([c6f83a5](https://github.com/stonith404/pocket-id/commit/c6f83a581ad385391d77fec7eeb385060742f097))
+* show error message if error occurs while authorizing new client ([8038a11](https://github.com/stonith404/pocket-id/commit/8038a111dd7fa8f5d421b29c3bc0c11d865dc71b))
+
 ## [](https://github.com/stonith404/pocket-id/compare/v0.3.1...v) (2024-09-03)


--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -61,7 +61,7 @@ You're all set!
 We use [Caddy](https://caddyserver.com) as a reverse proxy. You can use any other reverse proxy if you want but you have to configure it yourself.

 #### Setup
-Run `caddy run --config Caddyfile` in the root folder.
+Run `caddy run --config reverse-proxy/Caddyfile` in the root folder.

 ### Testing

--- a/10
+++ b/10
@@ -1,10 +0,0 @@
-:80 {
-    reverse_proxy /api/* http://localhost:8080
-    reverse_proxy /.well-known/* http://localhost:8080
-    reverse_proxy /* http://localhost:3000
-
-    log {
-        output file /var/log/caddy/access.log
-        level WARN
-    }
-}
--- a/4
+++ b/4
@@ -22,7 +22,7 @@ RUN CGO_ENABLED=1 GOOS=linux go build -o /app/backend/pocket-id-backend .
 # Stage 3: Production Image
 FROM node:20-alpine
 RUN apk add --no-cache caddy
-COPY ./Caddyfile /etc/caddy/Caddyfile
+COPY ./reverse-proxy /etc/caddy/

 WORKDIR /app
 COPY --from=frontend-builder /app/frontend/build ./frontend/build
@@ -31,6 +31,8 @@ COPY --from=frontend-builder /app/frontend/package.json ./frontend/package.json

 COPY --from=backend-builder /app/backend/pocket-id-backend ./backend/pocket-id-backend
 COPY --from=backend-builder /app/backend/migrations ./backend/migrations
+COPY --from=backend-builder /app/backend/GeoLite2-City.mmdb ./backend/GeoLite2-City.mmdb
+COPY --from=backend-builder /app/backend/email-templates ./backend/email-templates
 COPY --from=backend-builder /app/backend/images ./backend/images

 COPY ./scripts ./scripts
--- a/README.md
+++ b/README.md
@@ -68,6 +68,10 @@ Required tools:
   cd ..
   pm2 start pocket-id-backend --name pocket-id-backend

+   # Optional: Download the GeoLite2 city database.
+   # If not downloaded the ip location in the audit log will be empty.
+   MAXMIND_LICENSE_KEY=<your-key> sh scripts/download-ip-database.sh
+
   # Start the frontend
   cd ../frontend
   npm install
@@ -94,7 +98,7 @@ You may need the following information:
 - **Userinfo URL**: `https://<your-domain>/api/oidc/userinfo`
 - **Certificate URL**: `https://<your-domain>/.well-known/jwks.json`
 - **OIDC Discovery URL**: `https://<your-domain>/.well-known/openid-configuration`
- **PKCE**: `false` as this is not supported yet.
+- **Scopes**: At least `openid email`. Optionally you can add `profile` and `groups`.

 ### Proxy Services with Pocket ID

@@ -131,6 +135,9 @@ docker compose up -d
   cd ..
   pm2 start pocket-id-backend --name pocket-id-backend

+   # Optional: Update the GeoLite2 city database
+   MAXMIND_LICENSE_KEY=<your-key> sh scripts/download-ip-database.sh
+
   # Start the frontend
   cd ../frontend
   npm install
@@ -144,14 +151,16 @@ docker compose up -d

 ### Environment variables

-| Variable               | Default Value           | Recommended to change | Description                                   |
-| ---------------------- | ----------------------- | --------------------- | --------------------------------------------- |
-| `PUBLIC_APP_URL`       | `http://localhost`      | yes                   | The URL where you will access the app.        |
-| `DB_PATH`              | `data/pocket-id.db`     | no                    | The path to the SQLite database.              |
-| `UPLOAD_PATH`          | `data/uploads`          | no                    | The path where the uploaded files are stored. |
-| `INTERNAL_BACKEND_URL` | `http://localhost:8080` | no                    | The URL where the backend is accessible.      |
-| `PORT`                 | `3000`                  | no                    | The port on which the frontend should listen. |
-| `BACKEND_PORT`         | `8080`                  | no                    | The port on which the backend should listen.  |
+| Variable               | Default Value           | Recommended to change | Description                                                                                                                                                                           |
+| ---------------------- | ----------------------- | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `PUBLIC_APP_URL`       | `http://localhost`      | yes                   | The URL where you will access the app.                                                                                                                                                |
+| `TRUST_PROXY`          | `false`                 | yes                   | Whether the app is behind a reverse proxy.                                                                                                                                            |
+| `DB_PATH`              | `data/pocket-id.db`     | no                    | The path to the SQLite database.                                                                                                                                                      |
+| `UPLOAD_PATH`          | `data/uploads`          | no                    | The path where the uploaded files are stored.                                                                                                                                         |
+| `INTERNAL_BACKEND_URL` | `http://localhost:8080` | no                    | The URL where the backend is accessible.                                                                                                                                              |
+| `CADDY_PORT`           | `80`                    | no                    | The port on which Caddy should listen. Caddy is only active inside the Docker container. If you want to change the exposed port of the container then you sould change this variable. |
+| `PORT`                 | `3000`                  | no                    | The port on which the frontend should listen.                                                                                                                                         |
+| `BACKEND_PORT`         | `8080`                  | no                    | The port on which the backend should listen.                                                                                                                                          |

 ## Contribute

--- a/backend/email-templates/components/email_html.tmpl
+++ b/backend/email-templates/components/email_html.tmpl
@@ -0,0 +1,14 @@
+{{ define "root" }}
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    {{ template "style" . }}
+</head>
+<body>
+    <div class="container">
+        {{ template "base" . }}
+    </div>
+</body>
+</html>
+{{ end }}
--- a/backend/email-templates/components/email_text.tmpl
+++ b/backend/email-templates/components/email_text.tmpl
@@ -0,0 +1,7 @@
+{{- define "root" -}}
+{{- template "base" . -}}
+{{- end }}
+
+
+--
+This is automatically sent email from {{.AppName}}.
--- a/backend/email-templates/components/style_html.tmpl
+++ b/backend/email-templates/components/style_html.tmpl
@@ -0,0 +1,80 @@
+{{ define "style" }}
+<style>
+  body {
+    font-family: Arial, sans-serif;
+    background-color: #f0f0f0;
+    color: #333;
+    margin: 0;
+    padding: 0;
+  }
+  .container {
+    background-color: #fff;
+    color: #333;
+    padding: 32px;
+    border-radius: 10px;
+    max-width: 600px;
+    margin: 40px auto;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  }
+  .header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 24px;
+  }
+  .header .logo {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+  .header .logo img {
+    width: 32px;
+    height: 32px;
+    object-fit: cover;
+  }
+  .header h1 {
+    font-size: 1.5rem;
+    font-weight: bold;
+  }
+  .warning {
+    background-color: #ffd966;
+    color: #7f6000;
+    padding: 4px 12px;
+    border-radius: 50px;
+    font-size: 0.875rem;
+  }
+  .content {
+    background-color: #fafafa;
+    color: #333;
+    padding: 24px;
+    border-radius: 10px;
+  }
+  .content h2 {
+    font-size: 1.25rem;
+    font-weight: bold;
+    margin-bottom: 16px;
+  }
+  .grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 16px;
+    margin-bottom: 16px;
+  }
+  .grid div {
+    display: flex;
+    flex-direction: column;
+  }
+  .grid p {
+    margin: 0;
+  }
+  .label {
+    color: #888;
+    font-size: 0.875rem;
+    margin-bottom: 4px;
+  }
+  .message {
+    font-size: 1rem;
+    line-height: 1.5;
+  }
+</style>
+{{ end }}
--- a/backend/email-templates/login-with-new-device_html.tmpl
+++ b/backend/email-templates/login-with-new-device_html.tmpl
@@ -0,0 +1,36 @@
+{{ define "base" }}
+    <div class="header">
+        <div class="logo">
+            <img src="{{ .LogoURL }}" alt="Pocket ID"/>
+            <h1>{{ .AppName }}</h1>
+        </div>
+        <div class="warning">Warning</div>
+    </div>
+    <div class="content">
+        <h2>New Sign-In Detected</h2>
+        <div class="grid">
+            {{ if and .Data.City .Data.Country }}
+            <div>
+                <p class="label">Approximate Location</p>
+                <p>{{ .Data.City }}, {{ .Data.Country }}</p>
+            </div>
+            {{ end }}
+            <div>
+                <p class="label">IP Address</p>
+                <p>{{ .Data.IPAddress }}</p>
+            </div>
+            <div>
+                <p class="label">Device</p>
+                <p>{{ .Data.Device }}</p>
+            </div>
+            <div>
+                <p class="label">Sign-In Time</p>
+                <p>{{ .Data.DateTime.Format "2006-01-02 15:04:05 UTC" }}</p>
+            </div>
+        </div>
+        <p class="message">
+            This sign-in was detected from a new device or location. If you recognize this activity, you can
+            safely ignore this message. If not, please review your account and security settings.
+        </p>
+    </div>
+{{ end -}}
--- a/backend/email-templates/login-with-new-device_text.tmpl
+++ b/backend/email-templates/login-with-new-device_text.tmpl
@@ -0,0 +1,15 @@
+{{ define "base" -}}
+New Sign-In Detected
+====================
+
+{{ if and .Data.City .Data.Country }}
+Approximate Location: {{ .Data.City }}, {{ .Data.Country }}
+{{ end }}
+IP Address: {{ .Data.IPAddress }}
+Device:     {{ .Data.Device }}
+Time:       {{ .Data.DateTime.Format "2006-01-02 15:04:05 UTC"}}
+
+This sign-in was detected from a new device or location. If you recognize
+this activity, you can safely ignore this message. If not, please review
+your account and security settings.
+{{ end -}}
--- a/backend/go.mod
+++ b/backend/go.mod
@@ -1,27 +1,29 @@
 module github.com/stonith404/pocket-id/backend

-go 1.23
+go 1.23.1

 require (
 	github.com/caarlos0/env/v11 v11.2.2
 	github.com/fxamacker/cbor/v2 v2.7.0
 	github.com/gin-contrib/cors v1.7.2
 	github.com/gin-gonic/gin v1.10.0
-	github.com/go-co-op/gocron/v2 v2.11.0
-	github.com/go-playground/validator/v10 v10.22.0
-	github.com/go-webauthn/webauthn v0.11.1
+	github.com/go-co-op/gocron/v2 v2.12.1
+	github.com/go-playground/validator/v10 v10.22.1
+	github.com/go-webauthn/webauthn v0.11.2
 	github.com/golang-jwt/jwt/v5 v5.2.1
-	github.com/golang-migrate/migrate/v4 v4.17.1
+	github.com/golang-migrate/migrate/v4 v4.18.1
 	github.com/google/uuid v1.6.0
 	github.com/joho/godotenv v1.5.1
-	golang.org/x/crypto v0.26.0
+	github.com/mileusna/useragent v1.3.5
+	github.com/oschwald/maxminddb-golang/v2 v2.0.0-beta.1
+	golang.org/x/crypto v0.27.0
 	golang.org/x/time v0.6.0
 	gorm.io/driver/sqlite v1.5.6
-	gorm.io/gorm v1.25.11
+	gorm.io/gorm v1.25.12
 )

 require (
-	github.com/bytedance/sonic v1.12.1 // indirect
+	github.com/bytedance/sonic v1.12.3 // indirect
 	github.com/bytedance/sonic/loader v0.2.0 // indirect
 	github.com/cloudwego/base64x v0.1.4 // indirect
 	github.com/cloudwego/iasm v0.2.0 // indirect
@@ -29,7 +31,7 @@ require (
 	github.com/gin-contrib/sse v0.1.0 // indirect
 	github.com/go-playground/locales v0.14.1 // indirect
 	github.com/go-playground/universal-translator v0.18.1 // indirect
-	github.com/go-webauthn/x v0.1.12 // indirect
+	github.com/go-webauthn/x v0.1.14 // indirect
 	github.com/goccy/go-json v0.10.3 // indirect
 	github.com/google/go-tpm v0.9.1 // indirect
 	github.com/hashicorp/errwrap v1.1.0 // indirect
@@ -42,22 +44,21 @@ require (
 	github.com/kr/pretty v0.3.1 // indirect
 	github.com/leodido/go-urn v1.4.0 // indirect
 	github.com/mattn/go-isatty v0.0.20 // indirect
-	github.com/mattn/go-sqlite3 v1.14.22 // indirect
+	github.com/mattn/go-sqlite3 v1.14.23 // indirect
 	github.com/mitchellh/mapstructure v1.5.0 // indirect
 	github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd // indirect
 	github.com/modern-go/reflect2 v1.0.2 // indirect
-	github.com/pelletier/go-toml/v2 v2.2.2 // indirect
+	github.com/pelletier/go-toml/v2 v2.2.3 // indirect
 	github.com/robfig/cron/v3 v3.0.1 // indirect
-	github.com/rogpeppe/go-internal v1.11.0 // indirect
 	github.com/twitchyliquid64/golang-asm v0.15.1 // indirect
 	github.com/ugorji/go/codec v1.2.12 // indirect
 	github.com/x448/float16 v0.8.4 // indirect
 	go.uber.org/atomic v1.11.0 // indirect
-	golang.org/x/arch v0.9.0 // indirect
-	golang.org/x/exp v0.0.0-20240719175910-8a7402abbf56 // indirect
-	golang.org/x/net v0.27.0 // indirect
-	golang.org/x/sys v0.23.0 // indirect
-	golang.org/x/text v0.17.0 // indirect
+	golang.org/x/arch v0.10.0 // indirect
+	golang.org/x/exp v0.0.0-20240909161429-701f63a606c0 // indirect
+	golang.org/x/net v0.29.0 // indirect
+	golang.org/x/sys v0.25.0 // indirect
+	golang.org/x/text v0.18.0 // indirect
 	google.golang.org/protobuf v1.34.2 // indirect
 	gopkg.in/yaml.v3 v3.0.1 // indirect
 )
--- a/backend/go.sum
+++ b/backend/go.sum
@@ -1,5 +1,5 @@
-github.com/bytedance/sonic v1.12.1 h1:jWl5Qz1fy7X1ioY74WqO0KjAMtAGQs4sYnjiEBiyX24=
-github.com/bytedance/sonic v1.12.1/go.mod h1:B8Gt/XvtZ3Fqj+iSKMypzymZxw/FVwgIGKzMzT9r/rk=
+github.com/bytedance/sonic v1.12.3 h1:W2MGa7RCU1QTeYRTPE3+88mVC0yXmsRQRChiyVocVjU=
+github.com/bytedance/sonic v1.12.3/go.mod h1:B8Gt/XvtZ3Fqj+iSKMypzymZxw/FVwgIGKzMzT9r/rk=
 github.com/bytedance/sonic/loader v0.1.1/go.mod h1:ncP89zfokxS5LZrJxl5z0UJcsk4M4yY2JpfqGeCtNLU=
 github.com/bytedance/sonic/loader v0.2.0 h1:zNprn+lsIP06C/IqCHs3gPQIvnvpKbbxyXQP1iU4kWM=
 github.com/bytedance/sonic/loader v0.2.0/go.mod h1:ncP89zfokxS5LZrJxl5z0UJcsk4M4yY2JpfqGeCtNLU=
@@ -23,26 +23,26 @@ github.com/gin-contrib/sse v0.1.0 h1:Y/yl/+YNO8GZSjAhjMsSuLt29uWRFHdHYUb5lYOV9qE
 github.com/gin-contrib/sse v0.1.0/go.mod h1:RHrZQHXnP2xjPF+u1gW/2HnVO7nvIa9PG3Gm+fLHvGI=
 github.com/gin-gonic/gin v1.10.0 h1:nTuyha1TYqgedzytsKYqna+DfLos46nTv2ygFy86HFU=
 github.com/gin-gonic/gin v1.10.0/go.mod h1:4PMNQiOhvDRa013RKVbsiNwoyezlm2rm0uX/T7kzp5Y=
-github.com/go-co-op/gocron/v2 v2.11.0 h1:IOowNA6SzwdRFnD4/Ol3Kj6G2xKfsoiiGq2Jhhm9bvE=
-github.com/go-co-op/gocron/v2 v2.11.0/go.mod h1:xY7bJxGazKam1cz04EebrlP4S9q4iWdiAylMGP3jY9w=
+github.com/go-co-op/gocron/v2 v2.12.1 h1:dCIIBFbzhWKdgXeEifBjHPzgQ1hoWhjS4289Hjjy1uw=
+github.com/go-co-op/gocron/v2 v2.12.1/go.mod h1:xY7bJxGazKam1cz04EebrlP4S9q4iWdiAylMGP3jY9w=
 github.com/go-playground/assert/v2 v2.2.0 h1:JvknZsQTYeFEAhQwI4qEt9cyV5ONwRHC+lYKSsYSR8s=
 github.com/go-playground/assert/v2 v2.2.0/go.mod h1:VDjEfimB/XKnb+ZQfWdccd7VUvScMdVu0Titje2rxJ4=
 github.com/go-playground/locales v0.14.1 h1:EWaQ/wswjilfKLTECiXz7Rh+3BjFhfDFKv/oXslEjJA=
 github.com/go-playground/locales v0.14.1/go.mod h1:hxrqLVvrK65+Rwrd5Fc6F2O76J/NuW9t0sjnWqG1slY=
 github.com/go-playground/universal-translator v0.18.1 h1:Bcnm0ZwsGyWbCzImXv+pAJnYK9S473LQFuzCbDbfSFY=
 github.com/go-playground/universal-translator v0.18.1/go.mod h1:xekY+UJKNuX9WP91TpwSH2VMlDf28Uj24BCp08ZFTUY=
-github.com/go-playground/validator/v10 v10.22.0 h1:k6HsTZ0sTnROkhS//R0O+55JgM8C4Bx7ia+JlgcnOao=
-github.com/go-playground/validator/v10 v10.22.0/go.mod h1:dbuPbCMFw/DrkbEynArYaCwl3amGuJotoKCe95atGMM=
-github.com/go-webauthn/webauthn v0.11.1 h1:5G/+dg91/VcaJHTtJUfwIlNJkLwbJCcnUc4W8VtkpzA=
-github.com/go-webauthn/webauthn v0.11.1/go.mod h1:YXRm1WG0OtUyDFaVAgB5KG7kVqW+6dYCJ7FTQH4SxEE=
-github.com/go-webauthn/x v0.1.12 h1:RjQ5cvApzyU/xLCiP+rub0PE4HBZsLggbxGR5ZpUf/A=
-github.com/go-webauthn/x v0.1.12/go.mod h1:XlRcGkNH8PT45TfeJYc6gqpOtiOendHhVmnOxh+5yHs=
+github.com/go-playground/validator/v10 v10.22.1 h1:40JcKH+bBNGFczGuoBYgX4I6m/i27HYW8P9FDk5PbgA=
+github.com/go-playground/validator/v10 v10.22.1/go.mod h1:dbuPbCMFw/DrkbEynArYaCwl3amGuJotoKCe95atGMM=
+github.com/go-webauthn/webauthn v0.11.2 h1:Fgx0/wlmkClTKlnOsdOQ+K5HcHDsDcYIvtYmfhEOSUc=
+github.com/go-webauthn/webauthn v0.11.2/go.mod h1:aOtudaF94pM71g3jRwTYYwQTG1KyTILTcZqN1srkmD0=
+github.com/go-webauthn/x v0.1.14 h1:1wrB8jzXAofojJPAaRxnZhRgagvLGnLjhCAwg3kTpT0=
+github.com/go-webauthn/x v0.1.14/go.mod h1:UuVvFZ8/NbOnkDz3y1NaxtUN87pmtpC1PQ+/5BBQRdc=
 github.com/goccy/go-json v0.10.3 h1:KZ5WoDbxAIgm2HNbYckL0se1fHD6rz5j4ywS6ebzDqA=
 github.com/goccy/go-json v0.10.3/go.mod h1:oq7eo15ShAhp70Anwd5lgX2pLfOS3QCiwU/PULtXL6M=
 github.com/golang-jwt/jwt/v5 v5.2.1 h1:OuVbFODueb089Lh128TAcimifWaLhJwVflnrgM17wHk=
 github.com/golang-jwt/jwt/v5 v5.2.1/go.mod h1:pqrtFR0X4osieyHYxtmOUWsAWrfe1Q5UVIyoH402zdk=
-github.com/golang-migrate/migrate/v4 v4.17.1 h1:4zQ6iqL6t6AiItphxJctQb3cFqWiSpMnX7wLTPnnYO4=
-github.com/golang-migrate/migrate/v4 v4.17.1/go.mod h1:m8hinFyWBn0SA4QKHuKh175Pm9wjmxj3S2Mia7dbXzM=
+github.com/golang-migrate/migrate/v4 v4.18.1 h1:JML/k+t4tpHCpQTCAD62Nu43NUFzHY4CV3uAuvHGC+Y=
+github.com/golang-migrate/migrate/v4 v4.18.1/go.mod h1:HAX6m3sQgcdO81tdjn5exv20+3Kb13cmGli1hrD6hks=
 github.com/google/go-cmp v0.6.0 h1:ofyhxvXcZhMsU5ulbFiLKl/XBFqE1GSq7atu8tAmTRI=
 github.com/google/go-cmp v0.6.0/go.mod h1:17dUlkBOakJ0+DkrSSNjCkIjxS6bF9zb3elmeNGIjoY=
 github.com/google/go-tpm v0.9.1 h1:0pGc4X//bAlmZzMKf8iz6IsDo1nYTbYJ6FZN/rg4zdM=
@@ -79,8 +79,10 @@ github.com/lib/pq v1.10.9 h1:YXG7RB+JIjhP29X+OtkiDnYaXQwpS4JEWq7dtCCRUEw=
 github.com/lib/pq v1.10.9/go.mod h1:AlVN5x4E4T544tWzH6hKfbfQvm3HdbOxrmggDNAPY9o=
 github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY=
 github.com/mattn/go-isatty v0.0.20/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y=
-github.com/mattn/go-sqlite3 v1.14.22 h1:2gZY6PC6kBnID23Tichd1K+Z0oS6nE/XwU+Vz/5o4kU=
-github.com/mattn/go-sqlite3 v1.14.22/go.mod h1:Uh1q+B4BYcTPb+yiD3kU8Ct7aC0hY9fxUwlHK0RXw+Y=
+github.com/mattn/go-sqlite3 v1.14.23 h1:gbShiuAP1W5j9UOksQ06aiiqPMxYecovVGwmTxWtuw0=
+github.com/mattn/go-sqlite3 v1.14.23/go.mod h1:Uh1q+B4BYcTPb+yiD3kU8Ct7aC0hY9fxUwlHK0RXw+Y=
+github.com/mileusna/useragent v1.3.5 h1:SJM5NzBmh/hO+4LGeATKpaEX9+b4vcGg2qXGLiNGDws=
+github.com/mileusna/useragent v1.3.5/go.mod h1:3d8TOmwL/5I8pJjyVDteHtgDGcefrFUX4ccGOMKNYYc=
 github.com/mitchellh/mapstructure v1.5.0 h1:jeMsZIYE/09sWLaz43PL7Gy6RuMjD2eJVyuac5Z2hdY=
 github.com/mitchellh/mapstructure v1.5.0/go.mod h1:bFUtVrKA4DC2yAKiSyO/QUcy7e+RRV2QTWOzhPopBRo=
 github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
@@ -88,26 +90,26 @@ github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd h1:TRLaZ9cD/w
 github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
 github.com/modern-go/reflect2 v1.0.2 h1:xBagoLtFs94CBntxluKeaWgTMpvLxC4ur3nMaC9Gz0M=
 github.com/modern-go/reflect2 v1.0.2/go.mod h1:yWuevngMOJpCy52FWWMvUC8ws7m/LJsjYzDa0/r8luk=
-github.com/pelletier/go-toml/v2 v2.2.2 h1:aYUidT7k73Pcl9nb2gScu7NSrKCSHIDE89b3+6Wq+LM=
-github.com/pelletier/go-toml/v2 v2.2.2/go.mod h1:1t835xjRzz80PqgE6HHgN2JOsmgYu/h4qDAS4n929Rs=
+github.com/oschwald/maxminddb-golang/v2 v2.0.0-beta.1 h1:UihPOz+oIJ5X0JsO7wEkL50fheCODsoZ9r86mJWfNMc=
+github.com/oschwald/maxminddb-golang/v2 v2.0.0-beta.1/go.mod h1:vPpFrres6g9B5+meBwAd9xnp335KFcLEFW7EqJxBHy0=
+github.com/pelletier/go-toml/v2 v2.2.3 h1:YmeHyLY8mFWbdkNWwpr+qIL2bEqT0o95WSdkNHvL12M=
+github.com/pelletier/go-toml/v2 v2.2.3/go.mod h1:MfCQTFTvCcUyyvvwm1+G6H/jORL20Xlb6rzQu9GuUkc=
 github.com/pkg/diff v0.0.0-20210226163009-20ebb0f2a09e/go.mod h1:pJLUxLENpZxwdsKMEsNbx1VGcRFpLqf3715MtcvvzbA=
 github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
 github.com/robfig/cron/v3 v3.0.1 h1:WdRxkvbJztn8LMz/QEvLN5sBU+xKpSqwwUO1Pjr4qDs=
 github.com/robfig/cron/v3 v3.0.1/go.mod h1:eQICP3HwyT7UooqI/z+Ov+PtYAWygg1TEWWzGIFLtro=
 github.com/rogpeppe/go-internal v1.9.0/go.mod h1:WtVeX8xhTBvf0smdhujwtBcq4Qrzq/fJaraNFVN+nFs=
-github.com/rogpeppe/go-internal v1.11.0 h1:cWPaGQEPrBb5/AsnsZesgZZ9yb1OQ+GOISoDNXVBh4M=
-github.com/rogpeppe/go-internal v1.11.0/go.mod h1:ddIwULY96R17DhadqLgMfk9H9tvdUzkipdSkR5nkCZA=
+github.com/rogpeppe/go-internal v1.12.0 h1:exVL4IDcn6na9z1rAb56Vxr+CgyK3nn3O+epU5NdKM8=
+github.com/rogpeppe/go-internal v1.12.0/go.mod h1:E+RYuTGaKKdloAfM02xzb0FW3Paa99yedzYV+kq4uf4=
 github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
 github.com/stretchr/objx v0.4.0/go.mod h1:YvHI0jy2hoMjB+UWwv71VJQ9isScKT/TqJzVSSt89Yw=
 github.com/stretchr/objx v0.5.0/go.mod h1:Yh+to48EsGEfYuaHDzXPcE3xhTkx73EhmCGUpEOglKo=
-github.com/stretchr/objx v0.5.2/go.mod h1:FRsXN1f5AsAjCGJKqEizvkpNtU+EGNCLh3NxZ/8L+MA=
 github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
 github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
 github.com/stretchr/testify v1.7.1/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
 github.com/stretchr/testify v1.8.0/go.mod h1:yNjHg4UonilssWZ8iaSj1OCr/vHnekPRkoO+kdMU+MU=
 github.com/stretchr/testify v1.8.1/go.mod h1:w2LPCIKwWwSfY2zedu0+kehJoqGctiVI29o6fzry7u4=
-github.com/stretchr/testify v1.8.4/go.mod h1:sz/lmYIOXD/1dqDmKjjqLyZ2RngseejIcXlSw2iwfAo=
 github.com/stretchr/testify v1.9.0 h1:HtqpIVDClZ4nwg75+f6Lvsy/wHu+3BoSGCbBAcpTsTg=
 github.com/stretchr/testify v1.9.0/go.mod h1:r2ic/lqez/lEtzL7wO/rwa5dbSLXVDPFyf8C91i36aY=
 github.com/twitchyliquid64/golang-asm v0.15.1 h1:SU5vSMR7hnwNxj24w34ZyCi/FmDZTkS4MhqMhdFk5YI=
@@ -120,20 +122,20 @@ go.uber.org/atomic v1.11.0 h1:ZvwS0R+56ePWxUNi+Atn9dWONBPp/AUETXlHW0DxSjE=
 go.uber.org/atomic v1.11.0/go.mod h1:LUxbIzbOniOlMKjJjyPfpl4v+PKK2cNJn91OQbhoJI0=
 go.uber.org/goleak v1.3.0 h1:2K3zAYmnTNqV73imy9J1T3WC+gmCePx2hEGkimedGto=
 go.uber.org/goleak v1.3.0/go.mod h1:CoHD4mav9JJNrW/WLlf7HGZPjdw8EucARQHekz1X6bE=
-golang.org/x/arch v0.9.0 h1:ub9TgUInamJ8mrZIGlBG6/4TqWeMszd4N8lNorbrr6k=
-golang.org/x/arch v0.9.0/go.mod h1:FEVrYAQjsQXMVJ1nsMoVVXPZg6p2JE2mx8psSWTDQys=
-golang.org/x/crypto v0.26.0 h1:RrRspgV4mU+YwB4FYnuBoKsUapNIL5cohGAmSH3azsw=
-golang.org/x/crypto v0.26.0/go.mod h1:GY7jblb9wI+FOo5y8/S2oY4zWP07AkOJ4+jxCqdqn54=
-golang.org/x/exp v0.0.0-20240719175910-8a7402abbf56 h1:2dVuKD2vS7b0QIHQbpyTISPd0LeHDbnYEryqj5Q1ug8=
-golang.org/x/exp v0.0.0-20240719175910-8a7402abbf56/go.mod h1:M4RDyNAINzryxdtnbRXRL/OHtkFuWGRjvuhBJpk2IlY=
-golang.org/x/net v0.27.0 h1:5K3Njcw06/l2y9vpGCSdcxWOYHOUk3dVNGDXN+FvAys=
-golang.org/x/net v0.27.0/go.mod h1:dDi0PyhWNoiUOrAS8uXv/vnScO4wnHQO4mj9fn/RytE=
+golang.org/x/arch v0.10.0 h1:S3huipmSclq3PJMNe76NGwkBR504WFkQ5dhzWzP8ZW8=
+golang.org/x/arch v0.10.0/go.mod h1:FEVrYAQjsQXMVJ1nsMoVVXPZg6p2JE2mx8psSWTDQys=
+golang.org/x/crypto v0.27.0 h1:GXm2NjJrPaiv/h1tb2UH8QfgC/hOf/+z0p6PT8o1w7A=
+golang.org/x/crypto v0.27.0/go.mod h1:1Xngt8kV6Dvbssa53Ziq6Eqn0HqbZi5Z6R0ZpwQzt70=
+golang.org/x/exp v0.0.0-20240909161429-701f63a606c0 h1:e66Fs6Z+fZTbFBAxKfP3PALWBtpfqks2bwGcexMxgtk=
+golang.org/x/exp v0.0.0-20240909161429-701f63a606c0/go.mod h1:2TbTHSBQa924w8M6Xs1QcRcFwyucIwBGpK1p2f1YFFY=
+golang.org/x/net v0.29.0 h1:5ORfpBpCs4HzDYoodCDBbwHzdR5UrLBZ3sOnUJmFoHo=
+golang.org/x/net v0.29.0/go.mod h1:gLkgy8jTGERgjzMic6DS9+SP0ajcu6Xu3Orq/SpETg0=
 golang.org/x/sys v0.5.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
-golang.org/x/sys v0.23.0 h1:YfKFowiIMvtgl1UERQoTPPToxltDeZfbj4H7dVUCwmM=
-golang.org/x/sys v0.23.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
-golang.org/x/text v0.17.0 h1:XtiM5bkSOt+ewxlOE/aE/AKEHibwj/6gvWMl9Rsh0Qc=
-golang.org/x/text v0.17.0/go.mod h1:BuEKDfySbSR4drPmRPG/7iBdf8hvFMuRexcpahXilzY=
+golang.org/x/sys v0.25.0 h1:r+8e+loiHxRqhXVl6ML1nO3l1+oFoWbnlu2Ehimmi34=
+golang.org/x/sys v0.25.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/text v0.18.0 h1:XvMDiNzPAl0jr17s6W9lcaIhGUfUORdGCNsuLmPG224=
+golang.org/x/text v0.18.0/go.mod h1:BuEKDfySbSR4drPmRPG/7iBdf8hvFMuRexcpahXilzY=
 golang.org/x/time v0.6.0 h1:eTDhh4ZXt5Qf0augr54TN6suAUudPcawVZeIAPU7D4U=
 golang.org/x/time v0.6.0/go.mod h1:3BpzKBy/shNhVucY/MWOyx10tF3SFh9QdLuxbVysPQM=
 google.golang.org/protobuf v1.34.2 h1:6xV6lTsCfpGD21XK49h7MhtcApnLqkfYgPcdHftf6hg=
@@ -146,6 +148,6 @@ gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
 gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
 gorm.io/driver/sqlite v1.5.6 h1:fO/X46qn5NUEEOZtnjJRWRzZMe8nqJiQ9E+0hi+hKQE=
 gorm.io/driver/sqlite v1.5.6/go.mod h1:U+J8craQU6Fzkcvu8oLeAQmi50TkwPEhHDEjQZXDah4=
-gorm.io/gorm v1.25.11 h1:/Wfyg1B/je1hnDx3sMkX+gAlxrlZpn6X0BXRlwXlvHg=
-gorm.io/gorm v1.25.11/go.mod h1:xh7N7RHfYlNc5EmcI/El95gXusucDrQnHXe0+CgWcLQ=
+gorm.io/gorm v1.25.12 h1:I0u8i2hWQItBq1WfE0o2+WuL9+8L21K9e2HHSTE/0f8=
+gorm.io/gorm v1.25.12/go.mod h1:xh7N7RHfYlNc5EmcI/El95gXusucDrQnHXe0+CgWcLQ=
 nullprogram.com/x/optparse v1.0.0/go.mod h1:KdyPE+Igbe0jQUrVfMqDMeJQIJZEuyV7pjYmp6pbG50=
--- a/backend/images/logoDark.svg
+++ b/backend/images/logoDark.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 1015 1015">
+    <path fill="white" d="M506.6,0c209.52,0,379.98,170.45,379.98,379.96,0,82.33-25.9,160.68-74.91,226.54-48.04,64.59-113.78,111.51-190.13,135.71l-21.1,6.7-50.29-248.04,13.91-6.73c45.41-21.95,74.76-68.71,74.76-119.11,0-72.91-59.31-132.23-132.21-132.23s-132.23,59.32-132.23,132.23c0,50.4,29.36,97.16,74.77,119.11l13.65,6.61-81.01,499.24h-226.36V0h351.18Z"/>
+</svg>
--- a/backend/images/logoLight.svg
+++ b/backend/images/logoLight.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 1015 1015">
+    <path fill="black" d="M506.6,0c209.52,0,379.98,170.45,379.98,379.96,0,82.33-25.9,160.68-74.91,226.54-48.04,64.59-113.78,111.51-190.13,135.71l-21.1,6.7-50.29-248.04,13.91-6.73c45.41-21.95,74.76-68.71,74.76-119.11,0-72.91-59.31-132.23-132.21-132.23s-132.23,59.32-132.23,132.23c0,50.4,29.36,97.16,74.77,119.11l13.65,6.61-81.01,499.24h-226.36V0h351.18Z"/>
+</svg>
--- a/backend/internal/bootstrap/application_images_bootstrap.go
+++ b/backend/internal/bootstrap/application_images_bootstrap.go
@@ -5,24 +5,53 @@ import (
 	"github.com/stonith404/pocket-id/backend/internal/utils"
 	"log"
 	"os"
+	"strings"
 )

+// initApplicationImages copies the images from the images directory to the application-images directory
 func initApplicationImages() {
 	dirPath := common.EnvConfig.UploadPath + "/application-images"

-	files, err := os.ReadDir(dirPath)
+	sourceFiles, err := os.ReadDir("./images")
 	if err != nil && !os.IsNotExist(err) {
 		log.Fatalf("Error reading directory: %v", err)
 	}

-	// Skip if files already exist
-	if len(files) > 1 {
-		return
+	destinationFiles, err := os.ReadDir(dirPath)
+	if err != nil && !os.IsNotExist(err) {
+		log.Fatalf("Error reading directory: %v", err)
 	}

-	// Copy files from source to destination
-	err = utils.CopyDirectory("./images", dirPath)
-	if err != nil {
-		log.Fatalf("Error copying directory: %v", err)
+	// Copy images from the images directory to the application-images directory if they don't already exist
+	for _, sourceFile := range sourceFiles {
+		if sourceFile.IsDir() || imageAlreadyExists(sourceFile.Name(), destinationFiles) {
+			continue
+		}
+		srcFilePath := "./images/" + sourceFile.Name()
+		destFilePath := dirPath + "/" + sourceFile.Name()
+
+		err := utils.CopyFile(srcFilePath, destFilePath)
+		if err != nil {
+			log.Fatalf("Error copying file: %v", err)
+		}
 	}
+
+}
+
+func imageAlreadyExists(fileName string, destinationFiles []os.DirEntry) bool {
+	for _, destinationFile := range destinationFiles {
+		sourceFileWithoutExtension := getImageNameWithoutExtension(fileName)
+		destinationFileWithoutExtension := getImageNameWithoutExtension(destinationFile.Name())
+
+		if sourceFileWithoutExtension == destinationFileWithoutExtension {
+			return true
+		}
+	}
+
+	return false
+}
+
+func getImageNameWithoutExtension(fileName string) string {
+	splitted := strings.Split(fileName, ".")
+	return strings.Join(splitted[:len(splitted)-1], ".")
 }
--- a/backend/internal/bootstrap/router_bootstrap.go
+++ b/backend/internal/bootstrap/router_bootstrap.go
@@ -2,6 +2,7 @@ package bootstrap

 import (
 	"log"
+	"os"
 	"time"

 	"github.com/gin-gonic/gin"
@@ -28,13 +29,20 @@ func initRouter(db *gorm.DB, appConfigService *service.AppConfigService) {
 	r.Use(gin.Logger())

 	// Initialize services
-	webauthnService := service.NewWebAuthnService(db, appConfigService)
-	jwtService := service.NewJwtService(appConfigService)
-	userService := service.NewUserService(db, jwtService)
-	oidcService := service.NewOidcService(db, jwtService)
-	testService := service.NewTestService(db, appConfigService)
+	templateDir := os.DirFS(common.EnvConfig.EmailTemplatesPath)
+	emailService, err := service.NewEmailService(appConfigService, templateDir)
+	if err != nil {
+		log.Fatalf("Unable to create email service: %s", err)
+	}
+
+	auditLogService := service.NewAuditLogService(db, appConfigService, emailService)
+	jwtService := service.NewJwtService(appConfigService)
+	webauthnService := service.NewWebAuthnService(db, jwtService, auditLogService, appConfigService)
+	userService := service.NewUserService(db, jwtService)
+	oidcService := service.NewOidcService(db, jwtService, appConfigService, auditLogService)
+	testService := service.NewTestService(db, appConfigService)
+	userGroupService := service.NewUserGroupService(db)

-	// Add global middleware
 	r.Use(middleware.NewCorsMiddleware().Add())
 	r.Use(middleware.NewRateLimitMiddleware().Add(rate.Every(time.Second), 60))
 	r.Use(middleware.NewJwtAuthMiddleware(jwtService, true).Add(false))
@@ -45,10 +53,12 @@ func initRouter(db *gorm.DB, appConfigService *service.AppConfigService) {

 	// Set up API routes
 	apiGroup := r.Group("/api")
-	controller.NewWebauthnController(apiGroup, jwtAuthMiddleware, middleware.NewRateLimitMiddleware(), webauthnService, jwtService)
+	controller.NewWebauthnController(apiGroup, jwtAuthMiddleware, middleware.NewRateLimitMiddleware(), webauthnService)
 	controller.NewOidcController(apiGroup, jwtAuthMiddleware, fileSizeLimitMiddleware, oidcService, jwtService)
 	controller.NewUserController(apiGroup, jwtAuthMiddleware, middleware.NewRateLimitMiddleware(), userService)
 	controller.NewAppConfigController(apiGroup, jwtAuthMiddleware, appConfigService)
+	controller.NewAuditLogController(apiGroup, auditLogService, jwtAuthMiddleware)
+	controller.NewUserGroupController(apiGroup, jwtAuthMiddleware, userGroupService)

 	// Add test controller in non-production environments
 	if common.EnvConfig.AppEnv != "production" {
--- a/backend/internal/common/env_config.go
+++ b/backend/internal/common/env_config.go
@@ -7,21 +7,23 @@ import (
 )

 type EnvConfigSchema struct {
-	AppEnv     string `env:"APP_ENV"`
-	AppURL     string `env:"PUBLIC_APP_URL"`
-	DBPath     string `env:"DB_PATH"`
-	UploadPath string `env:"UPLOAD_PATH"`
-	Port       string `env:"BACKEND_PORT"`
-	Host       string `env:"HOST"`
+	AppEnv             string `env:"APP_ENV"`
+	AppURL             string `env:"PUBLIC_APP_URL"`
+	DBPath             string `env:"DB_PATH"`
+	UploadPath         string `env:"UPLOAD_PATH"`
+	Port               string `env:"BACKEND_PORT"`
+	Host               string `env:"HOST"`
+	EmailTemplatesPath string `env:"EMAIL_TEMPLATES_PATH"`
 }

 var EnvConfig = &EnvConfigSchema{
-	AppEnv:     "production",
-	DBPath:     "data/pocket-id.db",
-	UploadPath: "data/uploads",
-	AppURL:     "http://localhost",
-	Port:       "8080",
-	Host:       "localhost",
+	AppEnv:             "production",
+	DBPath:             "data/pocket-id.db",
+	UploadPath:         "data/uploads",
+	AppURL:             "http://localhost",
+	Port:               "8080",
+	Host:               "localhost",
+	EmailTemplatesPath: "./email-templates",
 }

 func init() {
--- a/backend/internal/common/errors.go
+++ b/backend/internal/common/errors.go
@@ -15,4 +15,5 @@ var (
 	ErrOidcInvalidCallbackURL       = errors.New("invalid callback URL")
 	ErrFileTypeNotSupported         = errors.New("file type not supported")
 	ErrInvalidCredentials           = errors.New("no user found with provided credentials")
+	ErrNameAlreadyInUse             = errors.New("name is already in use")
 )
--- a/backend/internal/controller/app_config_controller.go
+++ b/backend/internal/controller/app_config_controller.go
@@ -20,9 +20,9 @@ func NewAppConfigController(
 	acc := &AppConfigController{
 		appConfigService: appConfigService,
 	}
-	group.GET("/application-configuration", acc.listApplicationConfigurationHandler)
-	group.GET("/application-configuration/all", jwtAuthMiddleware.Add(true), acc.listAllApplicationConfigurationHandler)
-	group.PUT("/application-configuration", acc.updateApplicationConfigurationHandler)
+	group.GET("/application-configuration", acc.listAppConfigHandler)
+	group.GET("/application-configuration/all", jwtAuthMiddleware.Add(true), acc.listAllAppConfigHandler)
+	group.PUT("/application-configuration", acc.updateAppConfigHandler)

 	group.GET("/application-configuration/logo", acc.getLogoHandler)
 	group.GET("/application-configuration/background-image", acc.getBackgroundImageHandler)
@@ -36,8 +36,8 @@ type AppConfigController struct {
 	appConfigService *service.AppConfigService
 }

-func (acc *AppConfigController) listApplicationConfigurationHandler(c *gin.Context) {
-	configuration, err := acc.appConfigService.ListApplicationConfiguration(false)
+func (acc *AppConfigController) listAppConfigHandler(c *gin.Context) {
+	configuration, err := acc.appConfigService.ListAppConfig(false)
 	if err != nil {
 		utils.ControllerError(c, err)
 		return
@@ -52,8 +52,8 @@ func (acc *AppConfigController) listApplicationConfigurationHandler(c *gin.Conte
 	c.JSON(200, configVariablesDto)
 }

-func (acc *AppConfigController) listAllApplicationConfigurationHandler(c *gin.Context) {
-	configuration, err := acc.appConfigService.ListApplicationConfiguration(true)
+func (acc *AppConfigController) listAllAppConfigHandler(c *gin.Context) {
+	configuration, err := acc.appConfigService.ListAppConfig(true)
 	if err != nil {
 		utils.ControllerError(c, err)
 		return
@@ -68,14 +68,14 @@ func (acc *AppConfigController) listAllApplicationConfigurationHandler(c *gin.Co
 	c.JSON(200, configVariablesDto)
 }

-func (acc *AppConfigController) updateApplicationConfigurationHandler(c *gin.Context) {
+func (acc *AppConfigController) updateAppConfigHandler(c *gin.Context) {
 	var input dto.AppConfigUpdateDto
 	if err := c.ShouldBindJSON(&input); err != nil {
 		utils.ControllerError(c, err)
 		return
 	}

-	savedConfigVariables, err := acc.appConfigService.UpdateApplicationConfiguration(input)
+	savedConfigVariables, err := acc.appConfigService.UpdateAppConfig(input)
 	if err != nil {
 		utils.ControllerError(c, err)
 		return
@@ -91,8 +91,20 @@ func (acc *AppConfigController) updateApplicationConfigurationHandler(c *gin.Con
 }

 func (acc *AppConfigController) getLogoHandler(c *gin.Context) {
-	imageType := acc.appConfigService.DbConfig.LogoImageType.Value
-	acc.getImage(c, "logo", imageType)
+	lightLogo := c.DefaultQuery("light", "true") == "true"
+
+	var imageName string
+	var imageType string
+
+	if lightLogo {
+		imageName = "logoLight"
+		imageType = acc.appConfigService.DbConfig.LogoLightImageType.Value
+	} else {
+		imageName = "logoDark"
+		imageType = acc.appConfigService.DbConfig.LogoDarkImageType.Value
+	}
+
+	acc.getImage(c, imageName, imageType)
 }

 func (acc *AppConfigController) getFaviconHandler(c *gin.Context) {
@@ -105,8 +117,20 @@ func (acc *AppConfigController) getBackgroundImageHandler(c *gin.Context) {
 }

 func (acc *AppConfigController) updateLogoHandler(c *gin.Context) {
-	imageType := acc.appConfigService.DbConfig.LogoImageType.Value
-	acc.updateImage(c, "logo", imageType)
+	lightLogo := c.DefaultQuery("light", "true") == "true"
+
+	var imageName string
+	var imageType string
+
+	if lightLogo {
+		imageName = "logoLight"
+		imageType = acc.appConfigService.DbConfig.LogoLightImageType.Value
+	} else {
+		imageName = "logoDark"
+		imageType = acc.appConfigService.DbConfig.LogoDarkImageType.Value
+	}
+
+	acc.updateImage(c, imageName, imageType)
 }

 func (acc *AppConfigController) updateFaviconHandler(c *gin.Context) {
--- a/backend/internal/controller/audit_log_controller.go
+++ b/backend/internal/controller/audit_log_controller.go
@@ -0,0 +1,56 @@
+package controller
+
+import (
+	"github.com/stonith404/pocket-id/backend/internal/dto"
+	"github.com/stonith404/pocket-id/backend/internal/middleware"
+	"net/http"
+	"strconv"
+
+	"github.com/gin-gonic/gin"
+	"github.com/stonith404/pocket-id/backend/internal/service"
+	"github.com/stonith404/pocket-id/backend/internal/utils"
+)
+
+func NewAuditLogController(group *gin.RouterGroup, auditLogService *service.AuditLogService, jwtAuthMiddleware *middleware.JwtAuthMiddleware) {
+	alc := AuditLogController{
+		auditLogService: auditLogService,
+	}
+
+	group.GET("/audit-logs", jwtAuthMiddleware.Add(false), alc.listAuditLogsForUserHandler)
+}
+
+type AuditLogController struct {
+	auditLogService *service.AuditLogService
+}
+
+func (alc *AuditLogController) listAuditLogsForUserHandler(c *gin.Context) {
+	userID := c.GetString("userID")
+	page, _ := strconv.Atoi(c.DefaultQuery("page", "1"))
+	pageSize, _ := strconv.Atoi(c.DefaultQuery("limit", "10"))
+
+	// Fetch audit logs for the user
+	logs, pagination, err := alc.auditLogService.ListAuditLogsForUser(userID, page, pageSize)
+	if err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	// Map the audit logs to DTOs
+	var logsDtos []dto.AuditLogDto
+	err = dto.MapStructList(logs, &logsDtos)
+	if err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	// Add device information to the logs
+	for i, logsDto := range logsDtos {
+		logsDto.Device = alc.auditLogService.DeviceStringFromUserAgent(logs[i].UserAgent)
+		logsDtos[i] = logsDto
+	}
+
+	c.JSON(http.StatusOK, gin.H{
+		"data":       logsDtos,
+		"pagination": pagination,
+	})
+}
--- a/backend/internal/controller/oidc_controller.go
+++ b/backend/internal/controller/oidc_controller.go
@@ -18,7 +18,7 @@ func NewOidcController(group *gin.RouterGroup, jwtAuthMiddleware *middleware.Jwt

 	group.POST("/oidc/authorize", jwtAuthMiddleware.Add(false), oc.authorizeHandler)
 	group.POST("/oidc/authorize/new-client", jwtAuthMiddleware.Add(false), oc.authorizeNewClientHandler)
-	group.POST("/oidc/token", oc.createIDTokenHandler)
+	group.POST("/oidc/token", oc.createTokensHandler)
 	group.GET("/oidc/userinfo", oc.userInfoHandler)

 	group.GET("/oidc/clients", jwtAuthMiddleware.Add(true), oc.listClientsHandler)
@@ -46,7 +46,7 @@ func (oc *OidcController) authorizeHandler(c *gin.Context) {
 		return
 	}

-	code, callbackURL, err := oc.oidcService.Authorize(input, c.GetString("userID"))
+	code, callbackURL, err := oc.oidcService.Authorize(input, c.GetString("userID"), c.ClientIP(), c.Request.UserAgent())
 	if err != nil {
 		if errors.Is(err, common.ErrOidcMissingAuthorization) {
 			utils.CustomControllerError(c, http.StatusForbidden, err.Error())
@@ -73,7 +73,7 @@ func (oc *OidcController) authorizeNewClientHandler(c *gin.Context) {
 		return
 	}

-	code, callbackURL, err := oc.oidcService.AuthorizeNewClient(input, c.GetString("userID"))
+	code, callbackURL, err := oc.oidcService.AuthorizeNewClient(input, c.GetString("userID"), c.ClientIP(), c.Request.UserAgent())
 	if err != nil {
 		if errors.Is(err, common.ErrOidcInvalidCallbackURL) {
 			utils.CustomControllerError(c, http.StatusBadRequest, err.Error())
@@ -91,7 +91,7 @@ func (oc *OidcController) authorizeNewClientHandler(c *gin.Context) {
 	c.JSON(http.StatusOK, response)
 }

-func (oc *OidcController) createIDTokenHandler(c *gin.Context) {
+func (oc *OidcController) createTokensHandler(c *gin.Context) {
 	var input dto.OidcIdTokenDto

 	if err := c.ShouldBind(&input); err != nil {
--- a/backend/internal/controller/user_group_controller.go
+++ b/backend/internal/controller/user_group_controller.go
@@ -0,0 +1,162 @@
+package controller
+
+import (
+	"errors"
+	"net/http"
+	"strconv"
+
+	"github.com/gin-gonic/gin"
+	"github.com/stonith404/pocket-id/backend/internal/common"
+	"github.com/stonith404/pocket-id/backend/internal/dto"
+	"github.com/stonith404/pocket-id/backend/internal/middleware"
+	"github.com/stonith404/pocket-id/backend/internal/service"
+	"github.com/stonith404/pocket-id/backend/internal/utils"
+)
+
+func NewUserGroupController(group *gin.RouterGroup, jwtAuthMiddleware *middleware.JwtAuthMiddleware, userGroupService *service.UserGroupService) {
+	ugc := UserGroupController{
+		UserGroupService: userGroupService,
+	}
+
+	group.GET("/user-groups", jwtAuthMiddleware.Add(true), ugc.list)
+	group.GET("/user-groups/:id", jwtAuthMiddleware.Add(true), ugc.get)
+	group.POST("/user-groups", jwtAuthMiddleware.Add(true), ugc.create)
+	group.PUT("/user-groups/:id", jwtAuthMiddleware.Add(true), ugc.update)
+	group.DELETE("/user-groups/:id", jwtAuthMiddleware.Add(true), ugc.delete)
+	group.PUT("/user-groups/:id/users", jwtAuthMiddleware.Add(true), ugc.updateUsers)
+}
+
+type UserGroupController struct {
+	UserGroupService *service.UserGroupService
+}
+
+func (ugc *UserGroupController) list(c *gin.Context) {
+	page, _ := strconv.Atoi(c.DefaultQuery("page", "1"))
+	pageSize, _ := strconv.Atoi(c.DefaultQuery("limit", "10"))
+	searchTerm := c.Query("search")
+
+	groups, pagination, err := ugc.UserGroupService.List(searchTerm, page, pageSize)
+	if err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	var groupsDto = make([]dto.UserGroupDtoWithUserCount, len(groups))
+	for i, group := range groups {
+		var groupDto dto.UserGroupDtoWithUserCount
+		if err := dto.MapStruct(group, &groupDto); err != nil {
+			utils.ControllerError(c, err)
+			return
+		}
+		groupDto.UserCount, err = ugc.UserGroupService.GetUserCountOfGroup(group.ID)
+		if err != nil {
+			utils.ControllerError(c, err)
+			return
+		}
+		groupsDto[i] = groupDto
+	}
+
+	c.JSON(http.StatusOK, gin.H{
+		"data":       groupsDto,
+		"pagination": pagination,
+	})
+}
+
+func (ugc *UserGroupController) get(c *gin.Context) {
+	group, err := ugc.UserGroupService.Get(c.Param("id"))
+	if err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	var groupDto dto.UserGroupDtoWithUsers
+	if err := dto.MapStruct(group, &groupDto); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	c.JSON(http.StatusOK, groupDto)
+}
+
+func (ugc *UserGroupController) create(c *gin.Context) {
+	var input dto.UserGroupCreateDto
+	if err := c.ShouldBindJSON(&input); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	group, err := ugc.UserGroupService.Create(input)
+	if err != nil {
+		if errors.Is(err, common.ErrNameAlreadyInUse) {
+			utils.CustomControllerError(c, http.StatusConflict, err.Error())
+		} else {
+			utils.ControllerError(c, err)
+		}
+		return
+	}
+
+	var groupDto dto.UserGroupDtoWithUsers
+	if err := dto.MapStruct(group, &groupDto); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	c.JSON(http.StatusCreated, groupDto)
+}
+
+func (ugc *UserGroupController) update(c *gin.Context) {
+	var input dto.UserGroupCreateDto
+	if err := c.ShouldBindJSON(&input); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	group, err := ugc.UserGroupService.Update(c.Param("id"), input)
+	if err != nil {
+		if errors.Is(err, common.ErrNameAlreadyInUse) {
+			utils.CustomControllerError(c, http.StatusConflict, err.Error())
+		} else {
+			utils.ControllerError(c, err)
+		}
+		return
+	}
+
+	var groupDto dto.UserGroupDtoWithUsers
+	if err := dto.MapStruct(group, &groupDto); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	c.JSON(http.StatusOK, groupDto)
+}
+
+func (ugc *UserGroupController) delete(c *gin.Context) {
+	if err := ugc.UserGroupService.Delete(c.Param("id")); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	c.Status(http.StatusNoContent)
+}
+
+func (ugc *UserGroupController) updateUsers(c *gin.Context) {
+	var input dto.UserGroupUpdateUsersDto
+	if err := c.ShouldBindJSON(&input); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	group, err := ugc.UserGroupService.UpdateUsers(c.Param("id"), input)
+	if err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	var groupDto dto.UserGroupDtoWithUsers
+	if err := dto.MapStruct(group, &groupDto); err != nil {
+		utils.ControllerError(c, err)
+		return
+	}
+
+	c.JSON(http.StatusOK, groupDto)
+}
--- a/backend/internal/controller/webauthn_controller.go
+++ b/backend/internal/controller/webauthn_controller.go
@@ -15,8 +15,8 @@ import (
 	"golang.org/x/time/rate"
 )

-func NewWebauthnController(group *gin.RouterGroup, jwtAuthMiddleware *middleware.JwtAuthMiddleware, rateLimitMiddleware *middleware.RateLimitMiddleware, webauthnService *service.WebAuthnService, jwtService *service.JwtService) {
-	wc := &WebauthnController{webAuthnService: webauthnService, jwtService: jwtService}
+func NewWebauthnController(group *gin.RouterGroup, jwtAuthMiddleware *middleware.JwtAuthMiddleware, rateLimitMiddleware *middleware.RateLimitMiddleware, webauthnService *service.WebAuthnService) {
+	wc := &WebauthnController{webAuthnService: webauthnService}
 	group.GET("/webauthn/register/start", jwtAuthMiddleware.Add(false), wc.beginRegistrationHandler)
 	group.POST("/webauthn/register/finish", jwtAuthMiddleware.Add(false), wc.verifyRegistrationHandler)

@@ -32,7 +32,6 @@ func NewWebauthnController(group *gin.RouterGroup, jwtAuthMiddleware *middleware

 type WebauthnController struct {
 	webAuthnService *service.WebAuthnService
-	jwtService      *service.JwtService
 }

 func (wc *WebauthnController) beginRegistrationHandler(c *gin.Context) {
@@ -95,7 +94,8 @@ func (wc *WebauthnController) verifyLoginHandler(c *gin.Context) {
 	}

 	userID := c.GetString("userID")
-	user, err := wc.webAuthnService.VerifyLogin(sessionID, userID, credentialAssertionData)
+
+	user, token, err := wc.webAuthnService.VerifyLogin(sessionID, userID, credentialAssertionData, c.ClientIP(), c.Request.UserAgent())
 	if err != nil {
 		if errors.Is(err, common.ErrInvalidCredentials) {
 			utils.CustomControllerError(c, http.StatusUnauthorized, err.Error())
@@ -105,12 +105,6 @@ func (wc *WebauthnController) verifyLoginHandler(c *gin.Context) {
 		return
 	}

-	token, err := wc.jwtService.GenerateAccessToken(user)
-	if err != nil {
-		utils.ControllerError(c, err)
-		return
-	}
-
 	var userDto dto.UserDto
 	if err := dto.MapStruct(user, &userDto); err != nil {
 		utils.ControllerError(c, err)
--- a/backend/internal/controller/well_known_controller.go
+++ b/backend/internal/controller/well_known_controller.go
@@ -37,7 +37,7 @@ func (wkc *WellKnownController) openIDConfigurationHandler(c *gin.Context) {
 		"userinfo_endpoint":                     appUrl + "/api/oidc/userinfo",
 		"jwks_uri":                              appUrl + "/.well-known/jwks.json",
 		"scopes_supported":                      []string{"openid", "profile", "email"},
-		"claims_supported":                      []string{"sub", "given_name", "family_name", "email", "preferred_username"},
+		"claims_supported":                      []string{"sub", "given_name", "family_name", "name", "email", "preferred_username"},
 		"response_types_supported":              []string{"code", "id_token"},
 		"subject_types_supported":               []string{"public"},
 		"id_token_signing_alg_values_supported": []string{"RS256"},
--- a/backend/internal/dto/app_config_dto.go
+++ b/backend/internal/dto/app_config_dto.go
@@ -14,4 +14,10 @@ type AppConfigVariableDto struct {
 type AppConfigUpdateDto struct {
 	AppName         string `json:"appName" binding:"required,min=1,max=30"`
 	SessionDuration string `json:"sessionDuration" binding:"required"`
+	EmailEnabled    string `json:"emailEnabled" binding:"required"`
+	SmtHost         string `json:"smtpHost"`
+	SmtpPort        string `json:"smtpPort"`
+	SmtpFrom        string `json:"smtpFrom" binding:"omitempty,email"`
+	SmtpUser        string `json:"smtpUser"`
+	SmtpPassword    string `json:"smtpPassword"`
 }
--- a/backend/internal/dto/audit_log_dto.go
+++ b/backend/internal/dto/audit_log_dto.go
@@ -0,0 +1,19 @@
+package dto
+
+import (
+	"github.com/stonith404/pocket-id/backend/internal/model"
+	"time"
+)
+
+type AuditLogDto struct {
+	ID        string    `json:"id"`
+	CreatedAt time.Time `json:"createdAt"`
+
+	Event     model.AuditLogEvent `json:"event"`
+	IpAddress string              `json:"ipAddress"`
+	Country   string              `json:"country"`
+	City      string              `json:"city"`
+	Device    string              `json:"device"`
+	UserID    string              `json:"userID"`
+	Data      model.AuditLogData  `json:"data"`
+}
--- a/backend/internal/dto/dto_mapper.go
+++ b/backend/internal/dto/dto_mapper.go
@@ -57,15 +57,37 @@ func mapStructInternal(sourceVal reflect.Value, destVal reflect.Value) error {
 			// Handle direct assignment for simple types
 			if sourceField.Type() == destField.Type() {
 				destField.Set(sourceField)
+
 			} else if sourceField.Kind() == reflect.Slice && destField.Kind() == reflect.Slice {
 				// Handle slices
 				if sourceField.Type().Elem() == destField.Type().Elem() {
+					// Direct assignment for slices of primitive types or non-struct elements
 					newSlice := reflect.MakeSlice(destField.Type(), sourceField.Len(), sourceField.Cap())

 					for j := 0; j < sourceField.Len(); j++ {
 						newSlice.Index(j).Set(sourceField.Index(j))
 					}

+					destField.Set(newSlice)
+
+				} else if sourceField.Type().Elem().Kind() == reflect.Struct && destField.Type().Elem().Kind() == reflect.Struct {
+					// Recursively map slices of structs
+					newSlice := reflect.MakeSlice(destField.Type(), sourceField.Len(), sourceField.Cap())
+
+					for j := 0; j < sourceField.Len(); j++ {
+						// Get the element from both source and destination slice
+						sourceElem := sourceField.Index(j)
+						destElem := reflect.New(destField.Type().Elem()).Elem()
+
+						// Recursively map the struct elements
+						if err := mapStructInternal(sourceElem, destElem); err != nil {
+							return err
+						}
+
+						// Set the mapped element in the new slice
+						newSlice.Index(j).Set(destElem)
+					}
+
 					destField.Set(newSlice)
 				}
 			} else if sourceField.Kind() == reflect.Struct && destField.Kind() == reflect.Struct {
--- a/backend/internal/dto/user_group_dto.go
+++ b/backend/internal/dto/user_group_dto.go
@@ -0,0 +1,32 @@
+package dto
+
+import "time"
+
+type UserGroupDtoWithUsers struct {
+	ID           string    `json:"id"`
+	FriendlyName string    `json:"friendlyName"`
+	Name         string    `json:"name"`
+	Users        []UserDto `json:"users"`
+	CreatedAt    time.Time `json:"createdAt"`
+}
+
+type UserGroupDtoWithUserCount struct {
+	ID           string    `json:"id"`
+	FriendlyName string    `json:"friendlyName"`
+	Name         string    `json:"name"`
+	UserCount    int64     `json:"userCount"`
+	CreatedAt    time.Time `json:"createdAt"`
+}
+
+type UserGroupCreateDto struct {
+	FriendlyName string `json:"friendlyName" binding:"required,min=3,max=30"`
+	Name         string `json:"name" binding:"required,min=3,max=30,userGroupName"`
+}
+
+type UserGroupUpdateUsersDto struct {
+	UserIDs []string `json:"userIds" binding:"required"`
+}
+
+type AssignUserToGroupDto struct {
+	UserID string `json:"userId" binding:"required"`
+}
--- a/backend/internal/dto/validations.go
+++ b/backend/internal/dto/validations.go
@@ -28,6 +28,13 @@ var validateUsername validator.Func = func(fl validator.FieldLevel) bool {
 	return matched
 }

+var validateUserGroupName validator.Func = func(fl validator.FieldLevel) bool {
+	// [a-z0-9_] : The group name can only contain lowercase letters, numbers, and underscores
+	regex := "^[a-z0-9_]+$"
+	matched, _ := regexp.MatchString(regex, fl.Field().String())
+	return matched
+}
+
 func init() {
 	if v, ok := binding.Validator.Engine().(*validator.Validate); ok {
 		if err := v.RegisterValidation("urlList", validateUrlList); err != nil {
@@ -39,4 +46,10 @@ func init() {
 			log.Fatalf("Failed to register custom validation: %v", err)
 		}
 	}
+
+	if v, ok := binding.Validator.Engine().(*validator.Validate); ok {
+		if err := v.RegisterValidation("userGroupName", validateUserGroupName); err != nil {
+			log.Fatalf("Failed to register custom validation: %v", err)
+		}
+	}
 }
--- a/backend/internal/job/db_cleanup.go
+++ b/backend/internal/job/db_cleanup.go
@@ -21,7 +21,6 @@ func RegisterJobs(db *gorm.DB) {
 	registerJob(scheduler, "ClearWebauthnSessions", "0 3 * * *", jobs.clearWebauthnSessions)
 	registerJob(scheduler, "ClearOneTimeAccessTokens", "0 3 * * *", jobs.clearOneTimeAccessTokens)
 	registerJob(scheduler, "ClearOidcAuthorizationCodes", "0 3 * * *", jobs.clearOidcAuthorizationCodes)
-
 	scheduler.Start()
 }

@@ -29,17 +28,24 @@ type Jobs struct {
 	db *gorm.DB
 }

+// ClearWebauthnSessions deletes WebAuthn sessions that have expired
 func (j *Jobs) clearWebauthnSessions() error {
 	return j.db.Delete(&model.WebauthnSession{}, "expires_at < ?", utils.FormatDateForDb(time.Now())).Error
 }

+// ClearOneTimeAccessTokens deletes one-time access tokens that have expired
 func (j *Jobs) clearOneTimeAccessTokens() error {
 	return j.db.Debug().Delete(&model.OneTimeAccessToken{}, "expires_at < ?", utils.FormatDateForDb(time.Now())).Error
 }

+// ClearOidcAuthorizationCodes deletes OIDC authorization codes that have expired
 func (j *Jobs) clearOidcAuthorizationCodes() error {
 	return j.db.Delete(&model.OidcAuthorizationCode{}, "expires_at < ?", utils.FormatDateForDb(time.Now())).Error
+}

+// ClearAuditLogs deletes audit logs older than 90 days
+func (j *Jobs) clearAuditLogs() error {
+	return j.db.Delete(&model.AuditLog{}, "created_at < ?", utils.FormatDateForDb(time.Now().AddDate(0, 0, -90))).Error
 }

 func registerJob(scheduler gocron.Scheduler, name string, interval string, job func() error) {
--- a/backend/internal/model/app_config.go
+++ b/backend/internal/model/app_config.go
@@ -11,6 +11,14 @@ type AppConfigVariable struct {
 type AppConfig struct {
 	AppName             AppConfigVariable
 	BackgroundImageType AppConfigVariable
-	LogoImageType       AppConfigVariable
+	LogoLightImageType  AppConfigVariable
+	LogoDarkImageType   AppConfigVariable
 	SessionDuration     AppConfigVariable
+
+	EmailEnabled AppConfigVariable
+	SmtpHost     AppConfigVariable
+	SmtpPort     AppConfigVariable
+	SmtpFrom     AppConfigVariable
+	SmtpUser     AppConfigVariable
+	SmtpPassword AppConfigVariable
 }
--- a/backend/internal/model/audit_log.go
+++ b/backend/internal/model/audit_log.go
@@ -0,0 +1,52 @@
+package model
+
+import (
+	"database/sql/driver"
+	"encoding/json"
+	"errors"
+)
+
+type AuditLog struct {
+	Base
+
+	Event     AuditLogEvent
+	IpAddress string
+	Country   string
+	City      string
+	UserAgent string
+	UserID    string
+	Data      AuditLogData
+}
+
+type AuditLogData map[string]string
+
+type AuditLogEvent string
+
+const (
+	AuditLogEventSignIn                 AuditLogEvent = "SIGN_IN"
+	AuditLogEventClientAuthorization    AuditLogEvent = "CLIENT_AUTHORIZATION"
+	AuditLogEventNewClientAuthorization AuditLogEvent = "NEW_CLIENT_AUTHORIZATION"
+)
+
+// Scan and Value methods for GORM to handle the custom type
+
+func (e *AuditLogEvent) Scan(value interface{}) error {
+	*e = AuditLogEvent(value.(string))
+	return nil
+}
+
+func (e AuditLogEvent) Value() (driver.Value, error) {
+	return string(e), nil
+}
+
+func (d *AuditLogData) Scan(value interface{}) error {
+	if v, ok := value.([]byte); ok {
+		return json.Unmarshal(v, d)
+	} else {
+		return errors.New("type assertion to []byte failed")
+	}
+}
+
+func (d AuditLogData) Value() (driver.Value, error) {
+	return json.Marshal(d)
+}
--- a/backend/internal/model/user.go
+++ b/backend/internal/model/user.go
@@ -15,6 +15,7 @@ type User struct {
 	LastName  string
 	IsAdmin   bool

+	UserGroups  []UserGroup `gorm:"many2many:user_groups_users;"`
 	Credentials []WebauthnCredential
 }

--- a/backend/internal/model/user_group.go
+++ b/backend/internal/model/user_group.go
@@ -0,0 +1,8 @@
+package model
+
+type UserGroup struct {
+	Base
+	FriendlyName string
+	Name         string `gorm:"unique"`
+	Users        []User `gorm:"many2many:user_groups_users;"`
+}
--- a/backend/internal/service/app_config_service.go
+++ b/backend/internal/service/app_config_service.go
@@ -47,15 +47,46 @@ var defaultDbConfig = model.AppConfig{
 		IsInternal: true,
 		Value:      "jpg",
 	},
-	LogoImageType: model.AppConfigVariable{
-		Key:        "logoImageType",
+	LogoLightImageType: model.AppConfigVariable{
+		Key:        "logoLightImageType",
 		Type:       "string",
 		IsInternal: true,
 		Value:      "svg",
 	},
+	LogoDarkImageType: model.AppConfigVariable{
+		Key:        "logoDarkImageType",
+		Type:       "string",
+		IsInternal: true,
+		Value:      "svg",
+	},
+	EmailEnabled: model.AppConfigVariable{
+		Key:   "emailEnabled",
+		Type:  "bool",
+		Value: "false",
+	},
+	SmtpHost: model.AppConfigVariable{
+		Key:  "smtpHost",
+		Type: "string",
+	},
+	SmtpPort: model.AppConfigVariable{
+		Key:  "smtpPort",
+		Type: "number",
+	},
+	SmtpFrom: model.AppConfigVariable{
+		Key:  "smtpFrom",
+		Type: "string",
+	},
+	SmtpUser: model.AppConfigVariable{
+		Key:  "smtpUser",
+		Type: "string",
+	},
+	SmtpPassword: model.AppConfigVariable{
+		Key:  "smtpPassword",
+		Type: "string",
+	},
 }

-func (s *AppConfigService) UpdateApplicationConfiguration(input dto.AppConfigUpdateDto) ([]model.AppConfigVariable, error) {
+func (s *AppConfigService) UpdateAppConfig(input dto.AppConfigUpdateDto) ([]model.AppConfigVariable, error) {
 	var savedConfigVariables []model.AppConfigVariable

 	tx := s.db.Begin()
@@ -67,19 +98,19 @@ func (s *AppConfigService) UpdateApplicationConfiguration(input dto.AppConfigUpd
 		key := field.Tag.Get("json")
 		value := rv.FieldByName(field.Name).String()

-		var applicationConfigurationVariable model.AppConfigVariable
-		if err := tx.First(&applicationConfigurationVariable, "key = ? AND is_internal = false", key).Error; err != nil {
+		var appConfigVariable model.AppConfigVariable
+		if err := tx.First(&appConfigVariable, "key = ? AND is_internal = false", key).Error; err != nil {
 			tx.Rollback()
 			return nil, err
 		}

-		applicationConfigurationVariable.Value = value
-		if err := tx.Save(&applicationConfigurationVariable).Error; err != nil {
+		appConfigVariable.Value = value
+		if err := tx.Save(&appConfigVariable).Error; err != nil {
 			tx.Rollback()
 			return nil, err
 		}

-		savedConfigVariables = append(savedConfigVariables, applicationConfigurationVariable)
+		savedConfigVariables = append(savedConfigVariables, appConfigVariable)
 	}

 	tx.Commit()
@@ -101,7 +132,7 @@ func (s *AppConfigService) UpdateImageType(imageName string, fileType string) er
 	return s.loadDbConfigFromDb()
 }

-func (s *AppConfigService) ListApplicationConfiguration(showAll bool) ([]model.AppConfigVariable, error) {
+func (s *AppConfigService) ListAppConfig(showAll bool) ([]model.AppConfigVariable, error) {
 	var configuration []model.AppConfigVariable
 	var err error

--- a/backend/internal/service/audit_log_service.go
+++ b/backend/internal/service/audit_log_service.go
@@ -0,0 +1,125 @@
+package service
+
+import (
+	userAgentParser "github.com/mileusna/useragent"
+	"github.com/oschwald/maxminddb-golang/v2"
+	"github.com/stonith404/pocket-id/backend/internal/model"
+	"github.com/stonith404/pocket-id/backend/internal/utils"
+	"github.com/stonith404/pocket-id/backend/internal/utils/email"
+	"gorm.io/gorm"
+	"log"
+	"net/netip"
+)
+
+type AuditLogService struct {
+	db               *gorm.DB
+	appConfigService *AppConfigService
+	emailService     *EmailService
+}
+
+func NewAuditLogService(db *gorm.DB, appConfigService *AppConfigService, emailService *EmailService) *AuditLogService {
+	return &AuditLogService{db: db, appConfigService: appConfigService, emailService: emailService}
+}
+
+// Create creates a new audit log entry in the database
+func (s *AuditLogService) Create(event model.AuditLogEvent, ipAddress, userAgent, userID string, data model.AuditLogData) model.AuditLog {
+	country, city, err := s.GetIpLocation(ipAddress)
+	if err != nil {
+		log.Printf("Failed to get IP location: %v\n", err)
+	}
+
+	auditLog := model.AuditLog{
+		Event:     event,
+		IpAddress: ipAddress,
+		Country:   country,
+		City:      city,
+		UserAgent: userAgent,
+		UserID:    userID,
+		Data:      data,
+	}
+
+	// Save the audit log in the database
+	if err := s.db.Create(&auditLog).Error; err != nil {
+		log.Printf("Failed to create audit log: %v\n", err)
+		return model.AuditLog{}
+	}
+
+	return auditLog
+}
+
+// CreateNewSignInWithEmail creates a new audit log entry in the database and sends an email if the device hasn't been used before
+func (s *AuditLogService) CreateNewSignInWithEmail(ipAddress, userAgent, userID string, data model.AuditLogData) model.AuditLog {
+	createdAuditLog := s.Create(model.AuditLogEventSignIn, ipAddress, userAgent, userID, data)
+
+	// Count the number of times the user has logged in from the same device
+	var count int64
+	err := s.db.Model(&model.AuditLog{}).Where("user_id = ? AND ip_address = ? AND user_agent = ?", userID, ipAddress, userAgent).Count(&count).Error
+	if err != nil {
+		log.Printf("Failed to count audit logs: %v\n", err)
+		return createdAuditLog
+	}
+
+	// If the user hasn't logged in from the same device before, send an email
+	if count <= 1 {
+		go func() {
+			var user model.User
+			s.db.Where("id = ?", userID).First(&user)
+
+			err := SendEmail(s.emailService, email.Address{
+				Name:  user.Username,
+				Email: user.Email,
+			}, NewLoginTemplate, &NewLoginTemplateData{
+				IPAddress: ipAddress,
+				Country:   createdAuditLog.Country,
+				City:      createdAuditLog.City,
+				Device:    s.DeviceStringFromUserAgent(userAgent),
+				DateTime:  createdAuditLog.CreatedAt.UTC(),
+			})
+			if err != nil {
+				log.Printf("Failed to send email to '%s': %v\n", user.Email, err)
+			}
+		}()
+	}
+
+	return createdAuditLog
+}
+
+// ListAuditLogsForUser retrieves all audit logs for a given user ID
+func (s *AuditLogService) ListAuditLogsForUser(userID string, page int, pageSize int) ([]model.AuditLog, utils.PaginationResponse, error) {
+	var logs []model.AuditLog
+	query := s.db.Model(&model.AuditLog{}).Where("user_id = ?", userID).Order("created_at desc")
+
+	pagination, err := utils.Paginate(page, pageSize, query, &logs)
+	return logs, pagination, err
+}
+
+func (s *AuditLogService) DeviceStringFromUserAgent(userAgent string) string {
+	ua := userAgentParser.Parse(userAgent)
+	return ua.Name + " on " + ua.OS + " " + ua.OSVersion
+}
+
+func (s *AuditLogService) GetIpLocation(ipAddress string) (country, city string, err error) {
+	db, err := maxminddb.Open("GeoLite2-City.mmdb")
+	if err != nil {
+		return "", "", err
+	}
+	defer db.Close()
+
+	addr := netip.MustParseAddr(ipAddress)
+
+	var record struct {
+		City struct {
+			Names map[string]string `maxminddb:"names"`
+		} `maxminddb:"city"`
+		Country struct {
+			Names map[string]string `maxminddb:"names"`
+		} `maxminddb:"country"`
+	}
+
+	err = db.Lookup(addr).Decode(&record)
+	if err != nil {
+		return "", "", err
+	}
+
+	return record.Country.Names["en"], record.City.Names["en"], nil
+}
--- a/backend/internal/service/email_service.go
+++ b/backend/internal/service/email_service.go
@@ -0,0 +1,137 @@
+package service
+
+import (
+	"bytes"
+	"errors"
+	"fmt"
+	"github.com/stonith404/pocket-id/backend/internal/common"
+	"github.com/stonith404/pocket-id/backend/internal/utils/email"
+	htemplate "html/template"
+	"io/fs"
+	"mime/multipart"
+	"mime/quotedprintable"
+	"net/smtp"
+	"net/textproto"
+	ttemplate "text/template"
+)
+
+type EmailService struct {
+	appConfigService *AppConfigService
+	htmlTemplates    map[string]*htemplate.Template
+	textTemplates    map[string]*ttemplate.Template
+}
+
+func NewEmailService(appConfigService *AppConfigService, templateDir fs.FS) (*EmailService, error) {
+	htmlTemplates, err := email.PrepareHTMLTemplates(templateDir, emailTemplatesPaths)
+	if err != nil {
+		return nil, fmt.Errorf("prepare html templates: %w", err)
+	}
+
+	textTemplates, err := email.PrepareTextTemplates(templateDir, emailTemplatesPaths)
+	if err != nil {
+		return nil, fmt.Errorf("prepare html templates: %w", err)
+	}
+
+	return &EmailService{
+		appConfigService: appConfigService,
+		htmlTemplates:    htmlTemplates,
+		textTemplates:    textTemplates,
+	}, nil
+}
+
+func SendEmail[V any](srv *EmailService, toEmail email.Address, template email.Template[V], tData *V) error {
+	// Check if SMTP settings are set
+	if srv.appConfigService.DbConfig.EmailEnabled.Value != "true" {
+		return errors.New("email not enabled")
+	}
+
+	data := &email.TemplateData[V]{
+		AppName: srv.appConfigService.DbConfig.AppName.Value,
+		LogoURL: common.EnvConfig.AppURL + "/api/application-configuration/logo",
+		Data:    tData,
+	}
+
+	body, boundary, err := prepareBody(srv, template, data)
+	if err != nil {
+		return fmt.Errorf("prepare email body for '%s': %w", template.Path, err)
+	}
+
+	// Construct the email message
+	c := email.NewComposer()
+	c.AddHeader("Subject", template.Title(data))
+	c.AddAddressHeader("From", []email.Address{
+		{
+			Email: srv.appConfigService.DbConfig.SmtpFrom.Value,
+			Name:  srv.appConfigService.DbConfig.AppName.Value,
+		},
+	})
+	c.AddAddressHeader("To", []email.Address{toEmail})
+	c.AddHeaderRaw("Content-Type",
+		fmt.Sprintf("multipart/alternative;\n boundary=%s;\n charset=UTF-8", boundary),
+	)
+	c.Body(body)
+
+	// Set up the authentication information.
+	auth := smtp.PlainAuth("",
+		srv.appConfigService.DbConfig.SmtpUser.Value,
+		srv.appConfigService.DbConfig.SmtpPassword.Value,
+		srv.appConfigService.DbConfig.SmtpHost.Value,
+	)
+
+	// Send the email
+	err = smtp.SendMail(
+		srv.appConfigService.DbConfig.SmtpHost.Value+":"+srv.appConfigService.DbConfig.SmtpPort.Value,
+		auth,
+		srv.appConfigService.DbConfig.SmtpFrom.Value,
+		[]string{toEmail.Email},
+		[]byte(c.String()),
+	)
+
+	if err != nil {
+		return fmt.Errorf("failed to send email: %w", err)
+	}
+
+	return nil
+}
+
+func prepareBody[V any](srv *EmailService, template email.Template[V], data *email.TemplateData[V]) (string, string, error) {
+	body := bytes.NewBuffer(nil)
+	mpart := multipart.NewWriter(body)
+
+	// prepare text part
+	var textHeader = textproto.MIMEHeader{}
+	textHeader.Add("Content-Type", "text/plain;\n charset=UTF-8")
+	textHeader.Add("Content-Transfer-Encoding", "quoted-printable")
+	textPart, err := mpart.CreatePart(textHeader)
+	if err != nil {
+		return "", "", fmt.Errorf("create text part: %w", err)
+	}
+
+	textQp := quotedprintable.NewWriter(textPart)
+	err = email.GetTemplate(srv.textTemplates, template).ExecuteTemplate(textQp, "root", data)
+	if err != nil {
+		return "", "", fmt.Errorf("execute text template: %w", err)
+	}
+
+	// prepare html part
+	var htmlHeader = textproto.MIMEHeader{}
+	htmlHeader.Add("Content-Type", "text/html;\n charset=UTF-8")
+	htmlHeader.Add("Content-Transfer-Encoding", "quoted-printable")
+	htmlPart, err := mpart.CreatePart(htmlHeader)
+	if err != nil {
+		return "", "", fmt.Errorf("create html part: %w", err)
+	}
+
+	htmlQp := quotedprintable.NewWriter(htmlPart)
+	err = email.GetTemplate(srv.htmlTemplates, template).ExecuteTemplate(htmlQp, "root", data)
+	if err != nil {
+		return "", "", fmt.Errorf("execute html template: %w", err)
+	}
+
+	err = mpart.Close()
+	if err != nil {
+		return "", "", fmt.Errorf("close multipart: %w", err)
+	}
+
+	return body.String(), mpart.Boundary(), nil
+}
--- a/backend/internal/service/email_service_templates.go
+++ b/backend/internal/service/email_service_templates.go
@@ -0,0 +1,39 @@
+package service
+
+import (
+	"fmt"
+	"github.com/stonith404/pocket-id/backend/internal/utils/email"
+	"time"
+)
+
+/**
+How to add new template:
+- pick unique and descriptive template ${name} (for example "login-with-new-device")
+- in backend/email-templates/ create "${name}_html.tmpl" and "${name}_text.tmpl"
+- create xxxxTemplate and xxxxTemplateData (for example NewLoginTemplate and NewLoginTemplateData)
+  - Path *must* be ${name}
+- add xxxTemplate.Path to "emailTemplatePaths" at the end
+
+Notes:
+- backend app must be restarted to reread all the template files
+- root "." object in templates is `email.TemplateData`
+- xxxxTemplateData structure is visible under .Data in templates
+*/
+
+var NewLoginTemplate = email.Template[NewLoginTemplateData]{
+	Path: "login-with-new-device",
+	Title: func(data *email.TemplateData[NewLoginTemplateData]) string {
+		return fmt.Sprintf("New device login with %s", data.AppName)
+	},
+}
+
+type NewLoginTemplateData struct {
+	IPAddress string
+	Country   string
+	City      string
+	Device    string
+	DateTime  time.Time
+}
+
+// this is list of all template paths used for preloading templates
+var emailTemplatesPaths = []string{NewLoginTemplate.Path}
--- a/backend/internal/service/jwt_service.go
+++ b/backend/internal/service/jwt_service.go
@@ -3,6 +3,7 @@ package service
 import (
 	"crypto/rand"
 	"crypto/rsa"
+	"crypto/sha256"
 	"crypto/x509"
 	"encoding/base64"
 	"encoding/pem"
@@ -51,6 +52,7 @@ type AccessTokenJWTClaims struct {
 }

 type JWK struct {
+	Kid string `json:"kid"`
 	Kty string `json:"kty"`
 	Use string `json:"use"`
 	Alg string `json:"alg"`
@@ -98,7 +100,15 @@ func (s *JwtService) GenerateAccessToken(user model.User) (string, error) {
 		},
 		IsAdmin: user.IsAdmin,
 	}
+
+	kid, err := s.generateKeyID(s.publicKey)
+	if err != nil {
+		return "", errors.New("failed to generate key ID: " + err.Error())
+	}
+
 	token := jwt.NewWithClaims(jwt.SigningMethodRS256, claim)
+	token.Header["kid"] = kid
+
 	return token.SignedString(s.privateKey)
 }

@@ -137,9 +147,17 @@ func (s *JwtService) GenerateIDToken(userClaims map[string]interface{}, clientID
 		claims["nonce"] = nonce
 	}

+	kid, err := s.generateKeyID(s.publicKey)
+	if err != nil {
+		return "", errors.New("failed to generate key ID: " + err.Error())
+	}
+
 	token := jwt.NewWithClaims(jwt.SigningMethodRS256, claims)
+	token.Header["kid"] = kid
+
 	return token.SignedString(s.privateKey)
 }
+
 func (s *JwtService) GenerateOauthAccessToken(user model.User, clientID string) (string, error) {
 	claim := jwt.RegisteredClaims{
 		Subject:   user.ID,
@@ -148,7 +166,15 @@ func (s *JwtService) GenerateOauthAccessToken(user model.User, clientID string)
 		Audience:  jwt.ClaimStrings{clientID},
 		Issuer:    common.EnvConfig.AppURL,
 	}
+
+	kid, err := s.generateKeyID(s.publicKey)
+	if err != nil {
+		return "", errors.New("failed to generate key ID: " + err.Error())
+	}
+
 	token := jwt.NewWithClaims(jwt.SigningMethodRS256, claim)
+	token.Header["kid"] = kid
+
 	return token.SignedString(s.privateKey)
 }

@@ -174,7 +200,13 @@ func (s *JwtService) GetJWK() (JWK, error) {
 		return JWK{}, errors.New("public key is not initialized")
 	}

+	kid, err := s.generateKeyID(s.publicKey)
+	if err != nil {
+		return JWK{}, err
+	}
+
 	jwk := JWK{
+		Kid: kid,
 		Kty: "RSA",
 		Use: "sig",
 		Alg: "RS256",
@@ -185,6 +217,25 @@ func (s *JwtService) GetJWK() (JWK, error) {
 	return jwk, nil
 }

+// GenerateKeyID generates a Key ID for the public key using the first 8 bytes of the SHA-256 hash of the public key.
+func (s *JwtService) generateKeyID(publicKey *rsa.PublicKey) (string, error) {
+	pubASN1, err := x509.MarshalPKIXPublicKey(publicKey)
+	if err != nil {
+		return "", errors.New("failed to marshal public key: " + err.Error())
+	}
+
+	// Compute SHA-256 hash of the public key
+	hash := sha256.New()
+	hash.Write(pubASN1)
+	hashed := hash.Sum(nil)
+
+	// Truncate the hash to the first 8 bytes for a shorter Key ID
+	shortHash := hashed[:8]
+
+	// Return Base64 encoded truncated hash as Key ID
+	return base64.RawURLEncoding.EncodeToString(shortHash), nil
+}
+
 // generateKeys generates a new RSA key pair and saves them to the specified paths.
 func (s *JwtService) generateKeys() error {
 	if err := os.MkdirAll(filepath.Dir(privateKeyPath), 0700); err != nil {
--- a/backend/internal/service/oidc_service.go
+++ b/backend/internal/service/oidc_service.go
@@ -17,18 +17,22 @@ import (
 )

 type OidcService struct {
-	db         *gorm.DB
-	jwtService *JwtService
+	db               *gorm.DB
+	jwtService       *JwtService
+	appConfigService *AppConfigService
+	auditLogService  *AuditLogService
 }

-func NewOidcService(db *gorm.DB, jwtService *JwtService) *OidcService {
+func NewOidcService(db *gorm.DB, jwtService *JwtService, appConfigService *AppConfigService, auditLogService *AuditLogService) *OidcService {
 	return &OidcService{
-		db:         db,
-		jwtService: jwtService,
+		db:               db,
+		jwtService:       jwtService,
+		appConfigService: appConfigService,
+		auditLogService:  auditLogService,
 	}
 }

-func (s *OidcService) Authorize(input dto.AuthorizeOidcClientRequestDto, userID string) (string, string, error) {
+func (s *OidcService) Authorize(input dto.AuthorizeOidcClientRequestDto, userID, ipAddress, userAgent string) (string, string, error) {
 	var userAuthorizedOIDCClient model.UserAuthorizedOidcClient
 	s.db.Preload("Client").First(&userAuthorizedOIDCClient, "client_id = ? AND user_id = ?", input.ClientID, userID)

@@ -42,10 +46,16 @@ func (s *OidcService) Authorize(input dto.AuthorizeOidcClientRequestDto, userID
 	}

 	code, err := s.createAuthorizationCode(input.ClientID, userID, input.Scope, input.Nonce)
-	return code, callbackURL, err
+	if err != nil {
+		return "", "", err
+	}
+
+	s.auditLogService.Create(model.AuditLogEventClientAuthorization, ipAddress, userAgent, userID, model.AuditLogData{"clientName": userAuthorizedOIDCClient.Client.Name})
+
+	return code, callbackURL, nil
 }

-func (s *OidcService) AuthorizeNewClient(input dto.AuthorizeOidcClientRequestDto, userID string) (string, string, error) {
+func (s *OidcService) AuthorizeNewClient(input dto.AuthorizeOidcClientRequestDto, userID, ipAddress, userAgent string) (string, string, error) {
 	var client model.OidcClient
 	if err := s.db.First(&client, "id = ?", input.ClientID).Error; err != nil {
 		return "", "", err
@@ -71,7 +81,13 @@ func (s *OidcService) AuthorizeNewClient(input dto.AuthorizeOidcClientRequestDto
 	}

 	code, err := s.createAuthorizationCode(input.ClientID, userID, input.Scope, input.Nonce)
-	return code, callbackURL, err
+	if err != nil {
+		return "", "", err
+	}
+
+	s.auditLogService.Create(model.AuditLogEventNewClientAuthorization, ipAddress, userAgent, userID, model.AuditLogData{"clientName": client.Name})
+
+	return code, callbackURL, nil
 }

 func (s *OidcService) CreateTokens(code, grantType, clientID, clientSecret string) (string, string, error) {
@@ -285,7 +301,7 @@ func (s *OidcService) DeleteClientLogo(clientID string) error {

 func (s *OidcService) GetUserClaimsForClient(userID string, clientID string) (map[string]interface{}, error) {
 	var authorizedOidcClient model.UserAuthorizedOidcClient
-	if err := s.db.Preload("User").First(&authorizedOidcClient, "user_id = ? AND client_id = ?", userID, clientID).Error; err != nil {
+	if err := s.db.Preload("User.UserGroups").First(&authorizedOidcClient, "user_id = ? AND client_id = ?", userID, clientID).Error; err != nil {
 		return nil, err
 	}

@@ -300,9 +316,18 @@ func (s *OidcService) GetUserClaimsForClient(userID string, clientID string) (ma
 		claims["email"] = user.Email
 	}

+	if strings.Contains(scope, "groups") {
+		userGroups := make([]string, len(user.UserGroups))
+		for i, group := range user.UserGroups {
+			userGroups[i] = group.Name
+		}
+		claims["groups"] = userGroups
+	}
+
 	profileClaims := map[string]interface{}{
 		"given_name":         user.FirstName,
 		"family_name":        user.LastName,
+		"name":               user.FirstName + " " + user.LastName,
 		"preferred_username": user.Username,
 	}

--- a/backend/internal/service/test_service.go
+++ b/backend/internal/service/test_service.go
@@ -56,6 +56,30 @@ func (s *TestService) SeedDatabase() error {
 			}
 		}

+		userGroups := []model.UserGroup{
+			{
+				Base: model.Base{
+					ID: "4110f814-56f1-4b28-8998-752b69bc97c0e",
+				},
+				Name:         "developers",
+				FriendlyName: "Developers",
+				Users:        []model.User{users[0], users[1]},
+			},
+			{
+				Base: model.Base{
+					ID: "adab18bf-f89d-4087-9ee1-70ff15b48211",
+				},
+				Name:         "designers",
+				FriendlyName: "Designers",
+				Users:        []model.User{users[0]},
+			},
+		}
+		for _, group := range userGroups {
+			if err := tx.Create(&group).Error; err != nil {
+				return err
+			}
+		}
+
 		oidcClients := []model.OidcClient{
 			{
 				Base: model.Base{
--- a/backend/internal/service/user_group_service.go
+++ b/backend/internal/service/user_group_service.go
@@ -0,0 +1,111 @@
+package service
+
+import (
+	"errors"
+	"github.com/stonith404/pocket-id/backend/internal/common"
+	"github.com/stonith404/pocket-id/backend/internal/dto"
+	"github.com/stonith404/pocket-id/backend/internal/model"
+	"github.com/stonith404/pocket-id/backend/internal/utils"
+	"gorm.io/gorm"
+)
+
+type UserGroupService struct {
+	db *gorm.DB
+}
+
+func NewUserGroupService(db *gorm.DB) *UserGroupService {
+	return &UserGroupService{db: db}
+}
+
+func (s *UserGroupService) List(name string, page int, pageSize int) (groups []model.UserGroup, response utils.PaginationResponse, err error) {
+	query := s.db.Model(&model.UserGroup{})
+
+	if name != "" {
+		query = query.Where("name LIKE ?", "%"+name+"%")
+	}
+
+	response, err = utils.Paginate(page, pageSize, query, &groups)
+	return groups, response, err
+}
+
+func (s *UserGroupService) Get(id string) (group model.UserGroup, err error) {
+	err = s.db.Where("id = ?", id).Preload("Users").First(&group).Error
+	return group, err
+}
+
+func (s *UserGroupService) Delete(id string) error {
+	var group model.UserGroup
+	if err := s.db.Where("id = ?", id).First(&group).Error; err != nil {
+		return err
+	}
+
+	return s.db.Delete(&group).Error
+}
+
+func (s *UserGroupService) Create(input dto.UserGroupCreateDto) (group model.UserGroup, err error) {
+	group = model.UserGroup{
+		FriendlyName: input.FriendlyName,
+		Name:         input.Name,
+	}
+
+	if err := s.db.Preload("Users").Create(&group).Error; err != nil {
+		if errors.Is(err, gorm.ErrDuplicatedKey) {
+			return model.UserGroup{}, common.ErrNameAlreadyInUse
+		}
+		return model.UserGroup{}, err
+	}
+	return group, nil
+}
+
+func (s *UserGroupService) Update(id string, input dto.UserGroupCreateDto) (group model.UserGroup, err error) {
+	group, err = s.Get(id)
+	if err != nil {
+		return model.UserGroup{}, err
+	}
+
+	group.Name = input.Name
+	group.FriendlyName = input.FriendlyName
+
+	if err := s.db.Preload("Users").Save(&group).Error; err != nil {
+		if errors.Is(err, gorm.ErrDuplicatedKey) {
+			return model.UserGroup{}, common.ErrNameAlreadyInUse
+		}
+		return model.UserGroup{}, err
+	}
+	return group, nil
+}
+
+func (s *UserGroupService) UpdateUsers(id string, input dto.UserGroupUpdateUsersDto) (group model.UserGroup, err error) {
+	group, err = s.Get(id)
+	if err != nil {
+		return model.UserGroup{}, err
+	}
+
+	// Fetch the users based on UserIDs in input
+	var users []model.User
+	if len(input.UserIDs) > 0 {
+		if err := s.db.Where("id IN (?)", input.UserIDs).Find(&users).Error; err != nil {
+			return model.UserGroup{}, err
+		}
+	}
+
+	// Replace the current users with the new set of users
+	if err := s.db.Model(&group).Association("Users").Replace(users); err != nil {
+		return model.UserGroup{}, err
+	}
+
+	// Save the updated group
+	if err := s.db.Save(&group).Error; err != nil {
+		return model.UserGroup{}, err
+	}
+
+	return group, nil
+}
+
+func (s *UserGroupService) GetUserCountOfGroup(id string) (int64, error) {
+	var group model.UserGroup
+	if err := s.db.Preload("Users").Where("id = ?", id).First(&group).Error; err != nil {
+		return 0, err
+	}
+	return s.db.Model(&group).Association("Users").Count(), nil
+}
--- a/backend/internal/service/webauthn_service.go
+++ b/backend/internal/service/webauthn_service.go
@@ -12,11 +12,14 @@ import (
 )

 type WebAuthnService struct {
-	db       *gorm.DB
-	webAuthn *webauthn.WebAuthn
+	db               *gorm.DB
+	webAuthn         *webauthn.WebAuthn
+	jwtService       *JwtService
+	auditLogService  *AuditLogService
+	appConfigService *AppConfigService
 }

-func NewWebAuthnService(db *gorm.DB, appConfigService *AppConfigService) *WebAuthnService {
+func NewWebAuthnService(db *gorm.DB, jwtService *JwtService, auditLogService *AuditLogService, appConfigService *AppConfigService) *WebAuthnService {
 	webauthnConfig := &webauthn.Config{
 		RPDisplayName: appConfigService.DbConfig.AppName.Value,
 		RPID:          utils.GetHostFromURL(common.EnvConfig.AppURL),
@@ -34,12 +37,13 @@ func NewWebAuthnService(db *gorm.DB, appConfigService *AppConfigService) *WebAut
 			},
 		},
 	}
-
 	wa, _ := webauthn.New(webauthnConfig)
-	return &WebAuthnService{db: db, webAuthn: wa}
+	return &WebAuthnService{db: db, webAuthn: wa, jwtService: jwtService, auditLogService: auditLogService, appConfigService: appConfigService}
 }

 func (s *WebAuthnService) BeginRegistration(userID string) (*model.PublicKeyCredentialCreationOptions, error) {
+	s.updateWebAuthnConfig()
+
 	var user model.User
 	if err := s.db.Preload("Credentials").Find(&user, "id = ?", userID).Error; err != nil {
 		return nil, err
@@ -129,10 +133,10 @@ func (s *WebAuthnService) BeginLogin() (*model.PublicKeyCredentialRequestOptions
 	}, nil
 }

-func (s *WebAuthnService) VerifyLogin(sessionID, userID string, credentialAssertionData *protocol.ParsedCredentialAssertionData) (model.User, error) {
+func (s *WebAuthnService) VerifyLogin(sessionID, userID string, credentialAssertionData *protocol.ParsedCredentialAssertionData, ipAddress, userAgent string) (model.User, string, error) {
 	var storedSession model.WebauthnSession
 	if err := s.db.First(&storedSession, "id = ?", sessionID).Error; err != nil {
-		return model.User{}, err
+		return model.User{}, "", err
 	}

 	session := webauthn.SessionData{
@@ -149,14 +153,21 @@ func (s *WebAuthnService) VerifyLogin(sessionID, userID string, credentialAssert
 	}, session, credentialAssertionData)

 	if err != nil {
-		return model.User{}, err
+		return model.User{}, "", err
 	}

 	if err := s.db.Find(&user, "id = ?", userID).Error; err != nil {
-		return model.User{}, err
+		return model.User{}, "", err
 	}

-	return *user, nil
+	token, err := s.jwtService.GenerateAccessToken(*user)
+	if err != nil {
+		return model.User{}, "", err
+	}
+
+	s.auditLogService.CreateNewSignInWithEmail(ipAddress, userAgent, user.ID, model.AuditLogData{})
+
+	return *user, token, nil
 }

 func (s *WebAuthnService) ListCredentials(userID string) ([]model.WebauthnCredential, error) {
@@ -194,3 +205,8 @@ func (s *WebAuthnService) UpdateCredential(userID, credentialID, name string) (m

 	return credential, nil
 }
+
+// updateWebAuthnConfig updates the WebAuthn configuration with the app name as it can change during runtime
+func (s *WebAuthnService) updateWebAuthnConfig() {
+	s.webAuthn.Config.RPDisplayName = s.appConfigService.DbConfig.AppName.Value
+}
--- a/backend/internal/utils/email/composer.go
+++ b/backend/internal/utils/email/composer.go
@@ -0,0 +1,213 @@
+package email
+
+import (
+	"fmt"
+	"strings"
+	"unicode"
+)
+
+const maxLineLength = 78
+const continuePrefix = "    "
+const addressSeparator = ", "
+
+type Composer struct {
+	isClosed bool
+	content  strings.Builder
+}
+
+func NewComposer() *Composer {
+	return &Composer{}
+}
+
+type Address struct {
+	Name  string
+	Email string
+}
+
+func (c *Composer) AddAddressHeader(name string, addresses []Address) {
+	c.content.WriteString(genAddressHeader(name, addresses, maxLineLength))
+	c.content.WriteString("\n")
+}
+
+func genAddressHeader(name string, addresses []Address, maxLength int) string {
+	hl := &headerLine{
+		maxLineLength:  maxLength,
+		continuePrefix: continuePrefix,
+	}
+
+	hl.Write(name)
+	hl.Write(": ")
+
+	for i, addr := range addresses {
+		var email string
+		if i < len(addresses)-1 {
+			email = fmt.Sprintf("<%s>%s", addr.Email, addressSeparator)
+		} else {
+			email = fmt.Sprintf("<%s>", addr.Email)
+		}
+		writeHeaderQ(hl, addr.Name)
+		writeHeaderAtom(hl, " ")
+		writeHeaderAtom(hl, email)
+	}
+	hl.EndLine()
+	return hl.String()
+}
+
+func (c *Composer) AddHeader(name, value string) {
+	if isPrintableASCII(value) && len(value)+len(name)+len(": ") < maxLineLength {
+		c.AddHeaderRaw(name, value)
+		return
+	}
+
+	c.content.WriteString(genHeader(name, value, maxLineLength))
+	c.content.WriteString("\n")
+}
+
+func genHeader(name, value string, maxLength int) string {
+	// add content as raw header when it is printable ASCII and shorter than maxLineLength
+	hl := &headerLine{
+		maxLineLength:  maxLength,
+		continuePrefix: continuePrefix,
+	}
+
+	hl.Write(name)
+	hl.Write(": ")
+	writeHeaderQ(hl, value)
+	hl.EndLine()
+	return hl.String()
+}
+
+const qEncStart = "=?utf-8?q?"
+const qEncEnd = "?="
+
+type headerLine struct {
+	buffer         strings.Builder
+	line           strings.Builder
+	maxLineLength  int
+	continuePrefix string
+}
+
+func (h *headerLine) FitsLine(length int) bool {
+	return h.line.Len()+len(h.continuePrefix)+length+2 < h.maxLineLength
+}
+
+func (h *headerLine) Write(str string) {
+	h.line.WriteString(str)
+}
+
+func (h *headerLine) EndLineWith(str string) {
+	h.line.WriteString(str)
+	h.EndLine()
+}
+
+func (h *headerLine) EndLine() {
+	if h.line.Len() == 0 {
+		return
+	}
+
+	if h.buffer.Len() != 0 {
+		h.buffer.WriteString("\n")
+		h.buffer.WriteString(h.continuePrefix)
+	}
+	h.buffer.WriteString(h.line.String())
+	h.line.Reset()
+}
+
+func (h *headerLine) String() string {
+	return h.buffer.String()
+}
+
+func writeHeaderQ(header *headerLine, value string) {
+
+	// current line does not fit event the first character - do \n
+	if !header.FitsLine(len(qEncStart) + len(convertRunes(value[0:1])[0]) + len(qEncEnd)) {
+		header.EndLineWith("")
+	}
+
+	header.Write(qEncStart)
+
+	for _, token := range convertRunes(value) {
+		if header.FitsLine(len(token) + len(qEncEnd)) {
+			header.Write(token)
+		} else {
+			header.EndLineWith(qEncEnd)
+			header.Write(qEncStart)
+			header.Write(token)
+		}
+	}
+
+	header.Write(qEncEnd)
+}
+
+func writeHeaderAtom(header *headerLine, value string) {
+	if !header.FitsLine(len(value)) {
+		header.EndLine()
+	}
+	header.Write(value)
+}
+
+func (c *Composer) AddHeaderRaw(name, value string) {
+	if c.isClosed {
+		panic("composer had already written body!")
+	}
+	header := fmt.Sprintf("%s: %s\n", name, value)
+	c.content.WriteString(header)
+}
+
+func (c *Composer) Body(body string) {
+	c.content.WriteString("\n")
+	c.content.WriteString(body)
+	c.isClosed = true
+}
+
+func (c *Composer) String() string {
+	return c.content.String()
+}
+
+func convertRunes(str string) []string {
+	var enc = make([]string, 0, len(str))
+	for _, r := range []rune(str) {
+		if r == ' ' {
+			enc = append(enc, "_")
+		} else if isPrintableASCIIRune(r) &&
+			r != '=' &&
+			r != '?' &&
+			r != '_' {
+			enc = append(enc, string(r))
+		} else {
+			enc = append(enc, string(toHex([]byte(string(r)))))
+		}
+	}
+	return enc
+}
+
+func toHex(in []byte) []byte {
+	enc := make([]byte, 0, len(in)*2)
+	for _, b := range in {
+		enc = append(enc, '=')
+		enc = append(enc, hex(b/16))
+		enc = append(enc, hex(b%16))
+	}
+	return enc
+}
+
+func hex(n byte) byte {
+	if n > 9 {
+		return n + (65 - 10)
+	} else {
+		return n + 48
+	}
+}
+
+func isPrintableASCII(str string) bool {
+	for _, r := range []rune(str) {
+		if !unicode.IsPrint(r) || r >= unicode.MaxASCII {
+			return false
+		}
+	}
+	return true
+}
+
+func isPrintableASCIIRune(r rune) bool {
+	return r > 31 && r < 127
+}
--- a/backend/internal/utils/email/composer_test.go
+++ b/backend/internal/utils/email/composer_test.go
@@ -0,0 +1,92 @@
+package email
+
+import (
+	"strings"
+	"testing"
+)
+
+func TestConvertRunes(t *testing.T) {
+	var testData = map[string]string{
+		"=??=_.": "=3D=3F=3F=3D=5F.",
+		"Příšerně žluťoučký kůn úpěl ďábelské ódy 🐎": "P=C5=99=C3=AD=C5=A1ern=C4=9B_=C5=BElu=C5=A5ou=C4=8Dk=C3=BD_k=C5=AFn_=C3=BAp=C4=9Bl_=C4=8F=C3=A1belsk=C3=A9_=C3=B3dy_=F0=9F=90=8E",
+	}
+	for input, expected := range testData {
+		got := strings.Join(convertRunes(input), "")
+		if got != expected {
+			t.Errorf("Input: '%s', expected '%s', got: '%s'", input, expected, got)
+		}
+	}
+}
+
+type genHeaderTestData struct {
+	name     string
+	value    string
+	expected string
+	maxWidth int
+}
+
+func TestGenHeaderQ(t *testing.T) {
+	var testData = []genHeaderTestData{
+		{
+			name:  "Subject",
+			value: "Příšerně žluťoučký kůn úpěl ďábelské ódy 🐎",
+			expected: "Subject: =?utf-8?q?P=C5=99=C3=AD=C5=A1ern=C4=9B_=C5=BElu=C5=A5ou=C4=8Dk?=\n" +
+				"    =?utf-8?q?=C3=BD_k=C5=AFn_=C3=BAp=C4=9Bl_=C4=8F=C3=A1belsk=C3=A9_=C3=B3?=\n" +
+				"    =?utf-8?q?dy_=F0=9F=90=8E?=",
+			maxWidth: 80,
+		},
+	}
+	for _, data := range testData {
+		got := genHeader(data.name, data.value, data.maxWidth)
+		if got != data.expected {
+			t.Errorf("Input: '%s', expected \n===\n%s\n===, got: \n===\n%s\n==='", data.value, data.expected, got)
+		}
+
+	}
+}
+
+type genAddressHeaderTestData struct {
+	name      string
+	addresses []Address
+	expected  string
+	maxLength int
+}
+
+func TestGenAddressHeader(t *testing.T) {
+	var testData = []genAddressHeaderTestData{
+		{
+			name: "To",
+			addresses: []Address{
+				{
+					Name:  "Oldřich Jánský",
+					Email: "olrd@example.com",
+				},
+			},
+			expected:  "To: =?utf-8?q?Old=C5=99ich_J=C3=A1nsk=C3=BD?= <olrd@example.com>",
+			maxLength: 80,
+		},
+		{
+			name: "Subject",
+			addresses: []Address{
+				{
+					Name:  "Oldřich Jánský",
+					Email: "olrd@example.com",
+				},
+				{
+					Name:  "Jan Novák",
+					Email: "novak@example.com",
+				},
+			},
+			expected: "Subject: =?utf-8?q?Old=C5=99ich_J=C3=A1nsk=C3=BD?= <olrd@example.com>, \n" +
+				"    =?utf-8?q?Jan_Nov=C3=A1k?= <novak@example.com>",
+			maxLength: 80,
+		},
+	}
+	for _, data := range testData {
+		got := genAddressHeader(data.name, data.addresses, data.maxLength)
+		if got != data.expected {
+			t.Errorf("Test: '%s', expected \n===\n%s\n===, got: \n===\n%s\n==='", data.name, data.expected, got)
+		}
+
+	}
+}
--- a/backend/internal/utils/email/email_service_templates.go
+++ b/backend/internal/utils/email/email_service_templates.go
@@ -0,0 +1,97 @@
+package email
+
+import (
+	"fmt"
+	htemplate "html/template"
+	"io/fs"
+	"path"
+	ttemplate "text/template"
+)
+
+const templateComponentsDir = "components"
+
+type Template[V any] struct {
+	Path  string
+	Title func(data *TemplateData[V]) string
+}
+
+type TemplateData[V any] struct {
+	AppName string
+	LogoURL string
+	Data    *V
+}
+
+type TemplateMap[V any] map[string]*V
+
+func GetTemplate[U any, V any](templateMap TemplateMap[U], template Template[V]) *U {
+	return templateMap[template.Path]
+}
+
+type clonable[V pareseable[V]] interface {
+	Clone() (V, error)
+}
+
+type pareseable[V any] interface {
+	ParseFS(fs.FS, ...string) (V, error)
+}
+
+func prepareTemplate[V pareseable[V]](template string, rootTemplate clonable[V], templateDir fs.FS, suffix string) (V, error) {
+	tmpl, err := rootTemplate.Clone()
+	if err != nil {
+		return *new(V), fmt.Errorf("clone root html template: %w", err)
+	}
+
+	filename := fmt.Sprintf("%s%s", template, suffix)
+	_, err = tmpl.ParseFS(templateDir, filename)
+	if err != nil {
+		return *new(V), fmt.Errorf("parsing html template '%s': %w", template, err)
+	}
+
+	return tmpl, nil
+}
+
+func PrepareTextTemplates(templateDir fs.FS, templates []string) (map[string]*ttemplate.Template, error) {
+	components := path.Join(templateComponentsDir, "*_text.tmpl")
+	rootTmpl, err := ttemplate.ParseFS(templateDir, components)
+	if err != nil {
+		return nil, fmt.Errorf("unable to parse templates '%s': %w", components, err)
+	}
+
+	var textTemplates = make(map[string]*ttemplate.Template, len(templates))
+	for _, tmpl := range templates {
+		rootTmplClone, err := rootTmpl.Clone()
+		if err != nil {
+			return nil, fmt.Errorf("clone root template: %w", err)
+		}
+
+		textTemplates[tmpl], err = prepareTemplate[*ttemplate.Template](tmpl, rootTmplClone, templateDir, "_text.tmpl")
+		if err != nil {
+			return nil, fmt.Errorf("parse '%s': %w", tmpl, err)
+		}
+	}
+
+	return textTemplates, nil
+}
+
+func PrepareHTMLTemplates(templateDir fs.FS, templates []string) (map[string]*htemplate.Template, error) {
+	components := path.Join(templateComponentsDir, "*_html.tmpl")
+	rootTmpl, err := htemplate.ParseFS(templateDir, components)
+	if err != nil {
+		return nil, fmt.Errorf("unable to parse templates '%s': %w", components, err)
+	}
+
+	var htmlTemplates = make(map[string]*htemplate.Template, len(templates))
+	for _, tmpl := range templates {
+		rootTmplClone, err := rootTmpl.Clone()
+		if err != nil {
+			return nil, fmt.Errorf("clone root template: %w", err)
+		}
+
+		htmlTemplates[tmpl], err = prepareTemplate[*htemplate.Template](tmpl, rootTmplClone, templateDir, "_html.tmpl")
+		if err != nil {
+			return nil, fmt.Errorf("parse '%s': %w", tmpl, err)
+		}
+	}
+
+	return htmlTemplates, nil
+}
--- a/backend/internal/utils/file_util.go
+++ b/backend/internal/utils/file_util.go
@@ -38,7 +38,7 @@ func CopyDirectory(srcDir, destDir string) error {
 		srcFilePath := filepath.Join(srcDir, file.Name())
 		destFilePath := filepath.Join(destDir, file.Name())

-		err := copyFile(srcFilePath, destFilePath)
+		err := CopyFile(srcFilePath, destFilePath)
 		if err != nil {
 			return err
 		}
@@ -47,7 +47,7 @@ func CopyDirectory(srcDir, destDir string) error {
 	return nil
 }

-func copyFile(srcFilePath, destFilePath string) error {
+func CopyFile(srcFilePath, destFilePath string) error {
 	srcFile, err := os.Open(srcFilePath)
 	if err != nil {
 		return err
--- a/backend/internal/utils/paging_util.go
+++ b/backend/internal/utils/paging_util.go
@@ -5,9 +5,10 @@ import (
 )

 type PaginationResponse struct {
-	TotalPages  int64 `json:"totalPages"`
-	TotalItems  int64 `json:"totalItems"`
-	CurrentPage int   `json:"currentPage"`
+	TotalPages   int64 `json:"totalPages"`
+	TotalItems   int64 `json:"totalItems"`
+	CurrentPage  int   `json:"currentPage"`
+	ItemsPerPage int   `json:"itemsPerPage"`
 }

 func Paginate(page int, pageSize int, db *gorm.DB, result interface{}) (PaginationResponse, error) {
@@ -33,8 +34,9 @@ func Paginate(page int, pageSize int, db *gorm.DB, result interface{}) (Paginati
 	}

 	return PaginationResponse{
-		TotalPages:  (totalItems + int64(pageSize) - 1) / int64(pageSize),
-		TotalItems:  totalItems,
-		CurrentPage: page,
+		TotalPages:   (totalItems + int64(pageSize) - 1) / int64(pageSize),
+		TotalItems:   totalItems,
+		CurrentPage:  page,
+		ItemsPerPage: pageSize,
 	}, nil
 }
--- a/backend/migrations/20240908123031_audit_log.down.sql
+++ b/backend/migrations/20240908123031_audit_log.down.sql
@@ -0,0 +1 @@
+DROP TABLE audit_logs;
--- a/backend/migrations/20240908123031_audit_log.up.sql
+++ b/backend/migrations/20240908123031_audit_log.up.sql
@@ -0,0 +1,10 @@
+CREATE TABLE audit_logs
+(
+    id               TEXT NOT NULL PRIMARY KEY,
+    created_at       DATETIME,
+    event            TEXT NOT NULL,
+    ip_address       TEXT NOT NULL,
+    user_agent       TEXT NOT NULL,
+    data             BLOB NOT NULL,
+    user_id          TEXT REFERENCES users
+);
--- a/backend/migrations/20240924202721_user_groups.down.sql
+++ b/backend/migrations/20240924202721_user_groups.down.sql
@@ -0,0 +1,2 @@
+DROP TABLE user_groups;
+DROP TABLE user_groups_users;
--- a/backend/migrations/20240924202721_user_groups.up.sql
+++ b/backend/migrations/20240924202721_user_groups.up.sql
@@ -0,0 +1,16 @@
+CREATE TABLE user_groups
+(
+    id           TEXT NOT NULL PRIMARY KEY,
+    created_at   DATETIME,
+    friendly_name TEXT NOT NULL,
+    name        TEXT NOT NULL UNIQUE
+);
+
+CREATE TABLE user_groups_users
+(
+    user_id  TEXT NOT NULL,
+    user_group_id TEXT NOT NULL,
+    PRIMARY KEY (user_id, user_group_id),
+    FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE,
+    FOREIGN KEY (user_group_id) REFERENCES user_groups (id) ON DELETE CASCADE
+);
--- a/backend/migrations/20241004092030_audit_log_location.down.sql
+++ b/backend/migrations/20241004092030_audit_log_location.down.sql
@@ -0,0 +1,2 @@
+ALTER TABLE audit_logs DROP COLUMN country;
+ALTER TABLE audit_logs DROP COLUMN city;
--- a/backend/migrations/20241004092030_audit_log_location.up.sql
+++ b/backend/migrations/20241004092030_audit_log_location.up.sql
@@ -0,0 +1,2 @@
+ALTER TABLE audit_logs ADD COLUMN country TEXT;
+ALTER TABLE audit_logs ADD COLUMN city TEXT;
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,46 +12,46 @@
    "format": "prettier --write ."
  },
  "devDependencies": {
-    "@playwright/test": "^1.46.1",
-    "@sveltejs/adapter-auto": "^3.2.4",
-    "@sveltejs/adapter-node": "^5.2.2",
-    "@sveltejs/kit": "^2.5.24",
+    "@playwright/test": "^1.47.2",
+    "@sveltejs/adapter-auto": "^3.2.5",
+    "@sveltejs/adapter-node": "^5.2.5",
+    "@sveltejs/kit": "^2.6.1",
    "@sveltejs/vite-plugin-svelte": "^3.1.2",
-    "@types/eslint": "^9.6.0",
-    "@types/jsonwebtoken": "^9.0.6",
-    "@types/node": "^22.5.0",
+    "@types/eslint": "^9.6.1",
+    "@types/jsonwebtoken": "^9.0.7",
+    "@types/node": "^22.7.4",
    "autoprefixer": "^10.4.20",
    "cbor-js": "^0.1.0",
-    "eslint": "^9.9.1",
+    "eslint": "^9.11.1",
    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-svelte": "^2.40.0",
-    "globals": "^15.9.0",
-    "postcss": "^8.4.41",
+    "eslint-plugin-svelte": "^2.44.1",
+    "globals": "^15.10.0",
+    "postcss": "^8.4.47",
    "prettier": "^3.3.3",
-    "prettier-plugin-svelte": "^3.2.6",
-    "prettier-plugin-tailwindcss": "^0.6.6",
-    "svelte": "^5.0.0-next.1",
-    "svelte-check": "^3.8.6",
-    "tailwindcss": "^3.4.10",
+    "prettier-plugin-svelte": "^3.2.7",
+    "prettier-plugin-tailwindcss": "^0.6.8",
+    "svelte": "^5.0.0-next.262",
+    "svelte-check": "^4.0.4",
+    "tailwindcss": "^3.4.13",
    "tslib": "^2.7.0",
-    "typescript": "^5.5.4",
-    "typescript-eslint": "^8.2.0",
-    "vite": "^5.4.2"
+    "typescript": "^5.6.2",
+    "typescript-eslint": "^8.8.0",
+    "vite": "^5.4.8"
  },
  "type": "module",
  "dependencies": {
    "@simplewebauthn/browser": "^10.0.0",
-    "axios": "^1.7.5",
-    "bits-ui": "^0.21.13",
+    "axios": "^1.7.7",
+    "bits-ui": "^0.21.16",
    "clsx": "^2.1.1",
    "crypto": "^1.0.1",
    "formsnap": "^1.0.1",
    "jsonwebtoken": "^9.0.2",
-    "lucide-svelte": "^0.435.0",
+    "lucide-svelte": "^0.447.0",
    "mode-watcher": "^0.4.1",
-    "svelte-sonner": "^0.3.27",
-    "sveltekit-superforms": "^2.17.0",
-    "tailwind-merge": "^2.5.2",
+    "svelte-sonner": "^0.3.28",
+    "sveltekit-superforms": "^2.19.0",
+    "tailwind-merge": "^2.5.3",
    "tailwind-variants": "^0.2.1",
    "zod": "^3.23.8"
  }
--- a/frontend/src/app.css
+++ b/frontend/src/app.css
@@ -97,16 +97,4 @@
 		font-weight: 700;
 		src: url('/fonts/PlayfairDisplay-Bold.woff') format('woff');
 	}
-}
-@layer components {
-	.application-images-grid {
-		@apply flex flex-wrap justify-between gap-x-5 gap-y-8;
-	}
-
-	@media (max-width: 1127px) {
-		.application-images-grid {
-			justify-content: flex-start;
-			@apply gap-x-20;
-		}
-	}
-}
+}
--- a/frontend/src/lib/components/advanced-table.svelte
+++ b/frontend/src/lib/components/advanced-table.svelte
@@ -0,0 +1,158 @@
+<script lang="ts" generics="T extends {id:string}">
+	import Checkbox from '$lib/components/ui/checkbox/checkbox.svelte';
+	import { Input } from '$lib/components/ui/input/index.js';
+	import * as Pagination from '$lib/components/ui/pagination';
+	import * as Select from '$lib/components/ui/select';
+	import * as Table from '$lib/components/ui/table/index.js';
+	import type { Paginated } from '$lib/types/pagination.type';
+	import { debounced } from '$lib/utils/debounce-util';
+	import type { Snippet } from 'svelte';
+
+	let {
+		items,
+		selectedIds = $bindable(),
+		withoutSearch = false,
+		fetchItems,
+		columns,
+		rows
+	}: {
+		items: Paginated<T>;
+		selectedIds?: string[];
+		withoutSearch?: boolean;
+		fetchItems: (search: string, page: number, limit: number) => Promise<Paginated<T>>;
+		columns: (string | { label: string; hidden?: boolean })[];
+		rows: Snippet<[{ item: T }]>;
+	} = $props();
+
+	let availablePageSizes: number[] = [10, 20, 50, 100];
+
+	let allChecked = $derived.by(() => {
+		if (!selectedIds || items.data.length === 0) return false;
+		for (const item of items.data) {
+			if (!selectedIds.includes(item.id)) {
+				return false;
+			}
+		}
+		return true;
+	});
+
+	const onSearch = debounced(async (searchValue: string) => {
+		items = await fetchItems(searchValue, 1, items.pagination.itemsPerPage);
+	}, 300);
+
+	async function onAllCheck(checked: boolean) {
+		if (checked) {
+			selectedIds = items.data.map((item) => item.id);
+		} else {
+			selectedIds = [];
+		}
+	}
+
+	async function onCheck(checked: boolean, id: string) {
+		if (!selectedIds) return;
+		if (checked) {
+			selectedIds = [...selectedIds, id];
+		} else {
+			selectedIds = selectedIds.filter((selectedId) => selectedId !== id);
+		}
+	}
+
+	async function onPageChange(page: number) {
+		items = await fetchItems('', page, items.pagination.itemsPerPage);
+	}
+
+	async function onPageSizeChange(size: number) {
+		items = await fetchItems('', 1, size);
+	}
+</script>
+
+<div class="w-full">
+	{#if !withoutSearch}
+	<Input
+		class="mb-4 max-w-sm"
+		placeholder={'Search...'}
+		type="text"
+		oninput={(e) => onSearch((e.target as HTMLInputElement).value)}
+	/>
+	{/if}
+	<Table.Root>
+		<Table.Header>
+			<Table.Row>
+				{#if selectedIds}
+					<Table.Head>
+						<Checkbox checked={allChecked} onCheckedChange={(c) => onAllCheck(c as boolean)} />
+					</Table.Head>
+				{/if}
+				{#each columns as column}
+					{#if typeof column === 'string'}
+						<Table.Head>{column}</Table.Head>
+					{:else}
+						<Table.Head class={column.hidden ? 'sr-only' : ''}>{column.label}</Table.Head>
+					{/if}
+				{/each}
+			</Table.Row>
+		</Table.Header>
+		<Table.Body>
+			{#each items.data as item}
+				<Table.Row class={selectedIds?.includes(item.id) ? 'bg-muted/20' : ''}>
+					{#if selectedIds}
+						<Table.Cell>
+							<Checkbox
+								checked={selectedIds.includes(item.id)}
+								onCheckedChange={(c) => onCheck(c as boolean, item.id)}
+							/>
+						</Table.Cell>
+					{/if}
+					{@render rows({ item })}
+				</Table.Row>
+			{/each}
+		</Table.Body>
+	</Table.Root>
+	<div class="mt-5 flex items-center justify-between space-x-2">
+		<div class="flex items-center space-x-2">
+			<p class="text-sm font-medium">Items per page</p>
+			<Select.Root
+				selected={{
+					label: items.pagination.itemsPerPage.toString(),
+					value: items.pagination.itemsPerPage
+				}}
+				onSelectedChange={(v) => onPageSizeChange(v?.value as number)}
+			>
+				<Select.Trigger class="h-9 w-[80px]">
+					<Select.Value>{items.pagination.itemsPerPage}</Select.Value>
+				</Select.Trigger>
+				<Select.Content>
+					{#each availablePageSizes as size}
+						<Select.Item value={size}>{size}</Select.Item>
+					{/each}
+				</Select.Content>
+			</Select.Root>
+		</div>
+		<Pagination.Root
+			class="mx-0 w-auto"
+			count={items.pagination.totalItems}
+			perPage={items.pagination.itemsPerPage}
+			{onPageChange}
+			page={items.pagination.currentPage}
+			let:pages
+		>
+			<Pagination.Content class="flex justify-end">
+				<Pagination.Item>
+					<Pagination.PrevButton />
+				</Pagination.Item>
+				{#each pages as page (page.key)}
+					{#if page.type !== 'ellipsis'}
+						<Pagination.Item>
+							<Pagination.Link {page} isActive={items.pagination.currentPage === page.value}>
+								{page.value}
+							</Pagination.Link>
+						</Pagination.Item>
+					{/if}
+				{/each}
+				<Pagination.Item>
+					<Pagination.NextButton />
+				</Pagination.Item>
+			</Pagination.Content>
+		</Pagination.Root>
+	</div>
+</div>
--- a/frontend/src/lib/components/copy-to-clipboard.svelte
+++ b/frontend/src/lib/components/copy-to-clipboard.svelte
@@ -0,0 +1,41 @@
+<script lang="ts">
+	import * as Tooltip from '$lib/components/ui/tooltip';
+	import { LucideCheck } from 'lucide-svelte';
+	import type { Snippet } from 'svelte';
+
+	let { value, children }: { value: string; children: Snippet } = $props();
+
+	let open = $state(false);
+	let copied = $state(false);
+
+	function onClick() {
+		open = true;
+		copyToClipboard();
+	}
+
+	function onOpenChange(state: boolean) {
+		open = state;
+		if (!state) {
+			copied = false;
+		}
+	}
+
+	function copyToClipboard() {
+		navigator.clipboard.writeText(value);
+		copied = true;
+		setTimeout(() => onOpenChange(false), 1000);
+	}
+</script>
+
+<button onclick={onClick}>
+	<Tooltip.Root closeOnPointerDown={false} {onOpenChange} {open}>
+		<Tooltip.Trigger>{@render children()}</Tooltip.Trigger>
+		<Tooltip.Content onclick={copyToClipboard}>
+			{#if copied}
+				<span class="flex items-center"><LucideCheck class="mr-1 h-4 w-4" /> Copied</span>
+			{:else}
+				<span>Click to copy</span>
+			{/if}
+		</Tooltip.Content>
+	</Tooltip.Root>
+</button>
--- a/frontend/src/lib/components/form-input.svelte
+++ b/frontend/src/lib/components/form-input.svelte
@@ -3,18 +3,24 @@
 	import type { FormInput } from '$lib/utils/form-util';
 	import type { Snippet } from 'svelte';
 	import type { HTMLAttributes } from 'svelte/elements';
-	import { Input } from './ui/input';
+	import { Input, type FormInputEvent } from './ui/input';

 	let {
 		input = $bindable(),
 		label,
 		description,
+		disabled = false,
+		type = 'text',
 		children,
+		onInput,
 		...restProps
 	}: HTMLAttributes<HTMLDivElement> & {
 		input?: FormInput<string | boolean | number>;
 		label: string;
 		description?: string;
+		disabled?: boolean;
+		type?: 'text' | 'password' | 'email' | 'number' | 'checkbox';
+		onInput?: (e: FormInputEvent) => void;
 		children?: Snippet;
 	} = $props();

@@ -30,7 +36,7 @@
 		{#if children}
 			{@render children()}
 		{:else if input}
-			<Input {id} bind:value={input.value} />
+			<Input {id} {type} bind:value={input.value} {disabled} on:input={(e) => onInput?.(e)} />
 		{/if}
 		{#if input?.error}
 			<p class="mt-1 text-sm text-red-500">{input.error}</p>
--- a/frontend/src/lib/components/header/header-avatar.svelte
+++ b/frontend/src/lib/components/header/header-avatar.svelte
@@ -3,6 +3,7 @@
 	import * as DropdownMenu from '$lib/components/ui/dropdown-menu';
 	import WebAuthnService from '$lib/services/webauthn-service';
 	import userStore from '$lib/stores/user-store';
+	import { createSHA256hash } from '$lib/utils/crypto-util';
 	import { LucideLogOut, LucideUser } from 'lucide-svelte';

 	const webauthnService = new WebAuthnService();
@@ -11,6 +12,13 @@
 		($userStore!.firstName.charAt(0) + $userStore!.lastName?.charAt(0)).toUpperCase()
 	);

+	let gravatarURL: string | undefined = $state();
+	if ($userStore) {
+		createSHA256hash($userStore.email).then((email) => {
+			gravatarURL = `https://www.gravatar.com/avatar/${email}?d=404`;
+		});
+	}
+
 	async function logout() {
 		await webauthnService.logout();
 		window.location.reload();
@@ -19,7 +27,8 @@

 <DropdownMenu.Root>
 	<DropdownMenu.Trigger
-		><Avatar.Root>
+		><Avatar.Root class="h-9 w-9">
+			<Avatar.Image src={gravatarURL} />
 			<Avatar.Fallback>{initials}</Avatar.Fallback>
 		</Avatar.Root></DropdownMenu.Trigger
 	>
--- a/frontend/src/lib/components/header/header.svelte
+++ b/frontend/src/lib/components/header/header.svelte
@@ -1,22 +1,27 @@
 <script lang="ts">
 	import { page } from '$app/stores';
-	import applicationConfigurationStore from '$lib/stores/application-configuration-store';
+	import appConfigStore from '$lib/stores/application-configuration-store';
 	import userStore from '$lib/stores/user-store';
 	import Logo from '../logo.svelte';
 	import HeaderAvatar from './header-avatar.svelte';

 	let isAuthPage = $derived(
-		!$page.error && ($page.url.pathname.startsWith('/authorize') || $page.url.pathname.startsWith('/login'))
+		!$page.error &&
+			($page.url.pathname.startsWith('/authorize') || $page.url.pathname.startsWith('/login'))
 	);
 </script>

 <div class=" w-full {isAuthPage ? 'absolute top-0 z-10 mt-4' : 'border-b'}">
-	<div class="mx-auto flex w-full max-w-[1520px] items-center justify-between px-4 md:px-10">
+	<div
+		class="{!isAuthPage
+			? 'max-w-[1640px]'
+			: ''} mx-auto flex w-full items-center justify-between px-4 md:px-10"
+	>
 		<div class="flex h-16 items-center">
 			{#if !isAuthPage}
 				<Logo class="mr-3 h-10 w-10" />
 				<h1 class="text-lg font-medium" data-testid="application-name">
-					{$applicationConfigurationStore.appName}
+					{$appConfigStore.appName}
 				</h1>
 			{/if}
 		</div>
--- a/frontend/src/lib/components/logo.svelte
+++ b/frontend/src/lib/components/logo.svelte
@@ -1 +1,10 @@
-<img class={$$restProps.class} src="/api/application-configuration/logo" alt="Logo" />
+<script lang="ts">
+	import { mode } from 'mode-watcher';
+	import type { HTMLAttributes } from 'svelte/elements';
+
+	let { ...props }: HTMLAttributes<HTMLImageElement> = $props();
+
+	const isDarkMode = $derived($mode === 'dark');
+</script>
+
+<img {...props} src="/api/application-configuration/logo?light={!isDarkMode}" alt="Logo" />
--- a/frontend/src/lib/components/ui/select/index.ts
+++ b/frontend/src/lib/components/ui/select/index.ts
@@ -0,0 +1,34 @@
+import { Select as SelectPrimitive } from "bits-ui";
+
+import Label from "./select-label.svelte";
+import Item from "./select-item.svelte";
+import Content from "./select-content.svelte";
+import Trigger from "./select-trigger.svelte";
+import Separator from "./select-separator.svelte";
+
+const Root = SelectPrimitive.Root;
+const Group = SelectPrimitive.Group;
+const Input = SelectPrimitive.Input;
+const Value = SelectPrimitive.Value;
+
+export {
+	Root,
+	Group,
+	Input,
+	Label,
+	Item,
+	Value,
+	Content,
+	Trigger,
+	Separator,
+	//
+	Root as Select,
+	Group as SelectGroup,
+	Input as SelectInput,
+	Label as SelectLabel,
+	Item as SelectItem,
+	Value as SelectValue,
+	Content as SelectContent,
+	Trigger as SelectTrigger,
+	Separator as SelectSeparator,
+};
--- a/frontend/src/lib/components/ui/select/select-content.svelte
+++ b/frontend/src/lib/components/ui/select/select-content.svelte
@@ -0,0 +1,39 @@
+<script lang="ts">
+	import { Select as SelectPrimitive } from "bits-ui";
+	import { scale } from "svelte/transition";
+	import { cn, flyAndScale } from "$lib/utils/style.js";
+
+	type $$Props = SelectPrimitive.ContentProps;
+	type $$Events = SelectPrimitive.ContentEvents;
+
+	export let sideOffset: $$Props["sideOffset"] = 4;
+	export let inTransition: $$Props["inTransition"] = flyAndScale;
+	export let inTransitionConfig: $$Props["inTransitionConfig"] = undefined;
+	export let outTransition: $$Props["outTransition"] = scale;
+	export let outTransitionConfig: $$Props["outTransitionConfig"] = {
+		start: 0.95,
+		opacity: 0,
+		duration: 50,
+	};
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<SelectPrimitive.Content
+	{inTransition}
+	{inTransitionConfig}
+	{outTransition}
+	{outTransitionConfig}
+	{sideOffset}
+	class={cn(
+		"bg-popover text-popover-foreground relative z-50 min-w-[8rem] overflow-hidden rounded-md border shadow-md outline-none",
+		className
+	)}
+	{...$$restProps}
+	on:keydown
+>
+	<div class="w-full p-1">
+		<slot />
+	</div>
+</SelectPrimitive.Content>
--- a/frontend/src/lib/components/ui/select/select-item.svelte
+++ b/frontend/src/lib/components/ui/select/select-item.svelte
@@ -0,0 +1,40 @@
+<script lang="ts">
+	import Check from "lucide-svelte/icons/check";
+	import { Select as SelectPrimitive } from "bits-ui";
+	import { cn } from "$lib/utils/style.js";
+
+	type $$Props = SelectPrimitive.ItemProps;
+	type $$Events = SelectPrimitive.ItemEvents;
+
+	let className: $$Props["class"] = undefined;
+	export let value: $$Props["value"];
+	export let label: $$Props["label"] = undefined;
+	export let disabled: $$Props["disabled"] = undefined;
+	export { className as class };
+</script>
+
+<SelectPrimitive.Item
+	{value}
+	{disabled}
+	{label}
+	class={cn(
+		"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+		className
+	)}
+	{...$$restProps}
+	on:click
+	on:keydown
+	on:focusin
+	on:focusout
+	on:pointerleave
+	on:pointermove
+>
+	<span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+		<SelectPrimitive.ItemIndicator>
+			<Check class="h-4 w-4" />
+		</SelectPrimitive.ItemIndicator>
+	</span>
+	<slot>
+		{label || value}
+	</slot>
+</SelectPrimitive.Item>
--- a/frontend/src/lib/components/ui/select/select-label.svelte
+++ b/frontend/src/lib/components/ui/select/select-label.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { Select as SelectPrimitive } from "bits-ui";
+	import { cn } from "$lib/utils/style.js";
+
+	type $$Props = SelectPrimitive.LabelProps;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<SelectPrimitive.Label
+	class={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
+	{...$$restProps}
+>
+	<slot />
+</SelectPrimitive.Label>
--- a/frontend/src/lib/components/ui/select/select-separator.svelte
+++ b/frontend/src/lib/components/ui/select/select-separator.svelte
@@ -0,0 +1,11 @@
+<script lang="ts">
+	import { Select as SelectPrimitive } from "bits-ui";
+	import { cn } from "$lib/utils/style.js";
+
+	type $$Props = SelectPrimitive.SeparatorProps;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<SelectPrimitive.Separator class={cn("bg-muted -mx-1 my-1 h-px", className)} {...$$restProps} />
--- a/frontend/src/lib/components/ui/select/select-trigger.svelte
+++ b/frontend/src/lib/components/ui/select/select-trigger.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { Select as SelectPrimitive } from "bits-ui";
+	import ChevronDown from "lucide-svelte/icons/chevron-down";
+	import { cn } from "$lib/utils/style.js";
+
+	type $$Props = SelectPrimitive.TriggerProps;
+	type $$Events = SelectPrimitive.TriggerEvents;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<SelectPrimitive.Trigger
+	class={cn(
+		"border-input bg-background ring-offset-background focus-visible:ring-ring aria-[invalid]:border-destructive data-[placeholder]:[&>span]:text-muted-foreground flex h-10 w-full items-center justify-between rounded-md border px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+		className
+	)}
+	{...$$restProps}
+	let:builder
+	on:click
+	on:keydown
+>
+	<slot {builder} />
+	<div>
+		<ChevronDown class="h-4 w-4 opacity-50" />
+	</div>
+</SelectPrimitive.Trigger>
--- a/frontend/src/lib/components/ui/table/table-row.svelte
+++ b/frontend/src/lib/components/ui/table/table-row.svelte
@@ -12,7 +12,7 @@

 <tr
 	class={cn(
-		"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+		"border-b transition-colors data-[state=selected]:bg-muted",
 		className
 	)}
 	{...$$restProps}
--- a/frontend/src/lib/components/ui/tooltip/index.ts
+++ b/frontend/src/lib/components/ui/tooltip/index.ts
@@ -0,0 +1,15 @@
+import { Tooltip as TooltipPrimitive } from "bits-ui";
+import Content from "./tooltip-content.svelte";
+
+const Root = TooltipPrimitive.Root;
+const Trigger = TooltipPrimitive.Trigger;
+
+export {
+	Root,
+	Trigger,
+	Content,
+	//
+	Root as Tooltip,
+	Content as TooltipContent,
+	Trigger as TooltipTrigger,
+};
--- a/frontend/src/lib/components/ui/tooltip/tooltip-content.svelte
+++ b/frontend/src/lib/components/ui/tooltip/tooltip-content.svelte
@@ -0,0 +1,28 @@
+<script lang="ts">
+	import { Tooltip as TooltipPrimitive } from "bits-ui";
+	import { cn, flyAndScale } from "$lib/utils/style.js";
+
+	type $$Props = TooltipPrimitive.ContentProps;
+
+	let className: $$Props["class"] = undefined;
+	export let sideOffset: $$Props["sideOffset"] = 4;
+	export let transition: $$Props["transition"] = flyAndScale;
+	export let transitionConfig: $$Props["transitionConfig"] = {
+		y: 8,
+		duration: 150,
+	};
+	export { className as class };
+</script>
+
+<TooltipPrimitive.Content
+	{transition}
+	{transitionConfig}
+	{sideOffset}
+	class={cn(
+		"bg-popover text-popover-foreground z-50 overflow-hidden rounded-md border px-3 py-1.5 text-sm shadow-md",
+		className
+	)}
+	{...$$restProps}
+>
+	<slot />
+</TooltipPrimitive.Content>
--- a/frontend/src/lib/services/api-service.ts
+++ b/frontend/src/lib/services/api-service.ts
@@ -13,7 +13,7 @@ abstract class APIService {
 		if (browser) {
 			this.api.defaults.baseURL = '/api';
 		} else {
-			this.api.defaults.baseURL = process?.env?.INTERNAL_BACKEND_URL + '/api';
+			this.api.defaults.baseURL = process!.env!.INTERNAL_BACKEND_URL + '/api';
 		}
 	}
 }
--- a/frontend/src/lib/services/application-configuration-service.ts
+++ b/frontend/src/lib/services/application-configuration-service.ts
@@ -1,29 +1,26 @@
-import type {
-	AllApplicationConfiguration,
-	ApplicationConfigurationRawResponse
-} from '$lib/types/application-configuration';
+import type { AllAppConfig, AppConfigRawResponse } from '$lib/types/application-configuration';
 import APIService from './api-service';

-export default class ApplicationConfigurationService extends APIService {
+export default class AppConfigService extends APIService {
 	async list(showAll = false) {
 		let url = '/application-configuration';
 		if (showAll) {
 			url += '/all';
 		}

-		const { data } = await this.api.get<ApplicationConfigurationRawResponse>(url);
+		const { data } = await this.api.get<AppConfigRawResponse>(url);

-		const applicationConfiguration: Partial<AllApplicationConfiguration> = {};
+		const appConfig: Partial<AllAppConfig> = {};
 		data.forEach(({ key, value }) => {
-			(applicationConfiguration as any)[key] = value;
+			(appConfig as any)[key] = value;
 		});

-		return applicationConfiguration as AllApplicationConfiguration;
+		return appConfig as AllAppConfig;
 	}

-	async update(applicationConfiguration: AllApplicationConfiguration) {
-		const res = await this.api.put('/application-configuration', applicationConfiguration);
-		return res.data as AllApplicationConfiguration;
+	async update(appConfig: AllAppConfig) {
+		const res = await this.api.put('/application-configuration', appConfig);
+		return res.data as AllAppConfig;
 	}

 	async updateFavicon(favicon: File) {
@@ -33,11 +30,13 @@ export default class ApplicationConfigurationService extends APIService {
 		await this.api.put(`/application-configuration/favicon`, formData);
 	}

-	async updateLogo(logo: File) {
+	async updateLogo(logo: File, light = true) {
 		const formData = new FormData();
 		formData.append('file', logo!);

-		await this.api.put(`/application-configuration/logo`, formData);
+		await this.api.put(`/application-configuration/logo`, formData, {
+			params: { light }
+		});
 	}

 	async updateBackgroundImage(backgroundImage: File) {
--- a/frontend/src/lib/services/audit-log-service.ts
+++ b/frontend/src/lib/services/audit-log-service.ts
@@ -0,0 +1,14 @@
+import type { AuditLog } from '$lib/types/audit-log.type';
+import type { Paginated, PaginationRequest } from '$lib/types/pagination.type';
+import APIService from './api-service';
+
+class AuditLogService extends APIService {
+	async list(pagination?: PaginationRequest) {
+		const res = await this.api.get('/audit-logs', {
+			params: pagination
+		});
+		return res.data as Paginated<AuditLog>;
+	}
+}
+
+export default AuditLogService;
--- a/frontend/src/lib/services/oidc-service.ts
+++ b/frontend/src/lib/services/oidc-service.ts
@@ -3,7 +3,7 @@ import type { Paginated, PaginationRequest } from '$lib/types/pagination.type';
 import APIService from './api-service';

 class OidcService extends APIService {
-	async authorize(clientId: string, scope: string, callbackURL : string, nonce?: string) {
+	async authorize(clientId: string, scope: string, callbackURL: string, nonce?: string) {
 		const res = await this.api.post('/oidc/authorize', {
 			scope,
 			nonce,
@@ -26,14 +26,10 @@ class OidcService extends APIService {
 	}

 	async listClients(search?: string, pagination?: PaginationRequest) {
-		const page = pagination?.page || 1;
-		const limit = pagination?.limit || 10;
-
 		const res = await this.api.get('/oidc/clients', {
 			params: {
 				search,
-				page,
-				limit
+				...pagination
 			}
 		});
 		return res.data as Paginated<OidcClient>;
--- a/frontend/src/lib/services/user-group-service.ts
+++ b/frontend/src/lib/services/user-group-service.ts
@@ -0,0 +1,43 @@
+import type { Paginated, PaginationRequest } from '$lib/types/pagination.type';
+import type {
+	UserGroupCreate,
+	UserGroupWithUserCount,
+	UserGroupWithUsers
+} from '$lib/types/user-group.type';
+import APIService from './api-service';
+
+export default class UserGroupService extends APIService {
+	async list(search?: string, pagination?: PaginationRequest) {
+		const res = await this.api.get('/user-groups', {
+			params: {
+				search,
+				...pagination
+			}
+		});
+		return res.data as Paginated<UserGroupWithUserCount>;
+	}
+
+	async get(id: string) {
+		const res = await this.api.get(`/user-groups/${id}`);
+		return res.data as UserGroupWithUsers;
+	}
+
+	async create(user: UserGroupCreate) {
+		const res = await this.api.post('/user-groups', user);
+		return res.data as UserGroupWithUsers;
+	}
+
+	async update(id: string, user: UserGroupCreate) {
+		const res = await this.api.put(`/user-groups/${id}`, user);
+		return res.data as UserGroupWithUsers;
+	}
+
+	async remove(id: string) {
+		await this.api.delete(`/user-groups/${id}`);
+	}
+
+	async updateUsers(id: string, userIds: string[]) {
+		const res = await this.api.put(`/user-groups/${id}/users`, { userIds });
+		return res.data as UserGroupWithUsers;
+	}
+}
--- a/frontend/src/lib/services/user-service.ts
+++ b/frontend/src/lib/services/user-service.ts
@@ -4,14 +4,10 @@ import APIService from './api-service';

 export default class UserService extends APIService {
 	async list(search?: string, pagination?: PaginationRequest) {
-		const page = pagination?.page || 1;
-		const limit = pagination?.limit || 10;
-
 		const res = await this.api.get('/users', {
 			params: {
 				search,
-				page,
-				limit
+				...pagination
 			}
 		});
 		return res.data as Paginated<User>;
--- a/frontend/src/lib/stores/application-configuration-store.ts
+++ b/frontend/src/lib/stores/application-configuration-store.ts
@@ -1,22 +1,22 @@
-import ApplicationConfigurationService from '$lib/services/application-configuration-service';
-import type { ApplicationConfiguration } from '$lib/types/application-configuration';
+import AppConfigService from '$lib/services/app-config-service';
+import type { AppConfig } from '$lib/types/application-configuration';
 import { writable } from 'svelte/store';

-const applicationConfigurationStore = writable<ApplicationConfiguration>();
+const appConfigStore = writable<AppConfig>();

-const applicationConfigurationService = new ApplicationConfigurationService();
+const appConfigService = new AppConfigService();

 const reload = async () => {
-	const applicationConfiguration = await applicationConfigurationService.list();
-	applicationConfigurationStore.set(applicationConfiguration);
+	const appConfig = await appConfigService.list();
+	appConfigStore.set(appConfig);
 };

-const set = (applicationConfiguration: ApplicationConfiguration) => {
-	applicationConfigurationStore.set(applicationConfiguration);
-}
+const set = (appConfig: AppConfig) => {
+	appConfigStore.set(appConfig);
+};

 export default {
-	subscribe: applicationConfigurationStore.subscribe,
+	subscribe: appConfigStore.subscribe,
 	reload,
 	set
 };
--- a/frontend/src/lib/types/application-configuration.ts
+++ b/frontend/src/lib/types/application-configuration.ts
@@ -1,13 +1,18 @@
-
-export type AllApplicationConfiguration = {
+export type AllAppConfig = {
 	appName: string;
-    sessionDuration: string;
+	sessionDuration: string;
+	emailEnabled: string;
+	smtpHost: string;
+	smtpPort: string;
+	smtpFrom: string;
+	smtpUser: string;
+	smtpPassword: string;
 };

-export type ApplicationConfiguration = AllApplicationConfiguration;
+export type AppConfig = AllAppConfig;

-export type ApplicationConfigurationRawResponse = {
+export type AppConfigRawResponse = {
 	key: string;
-    type: string;
-    value: string;
-}[];
+	type: string;
+	value: string;
+}[];
--- a/frontend/src/lib/types/audit-log.type.ts
+++ b/frontend/src/lib/types/audit-log.type.ts
@@ -0,0 +1,10 @@
+export type AuditLog = {
+	id: string;
+	event: string;
+	ipAddress: string;
+	country?: string;
+	city?: string;
+	device: string;
+	createdAt: string;
+	data: any;
+};
--- a/frontend/src/lib/types/pagination.type.ts
+++ b/frontend/src/lib/types/pagination.type.ts
@@ -7,6 +7,7 @@ export type PaginationResponse = {
 	totalPages: number;
 	totalItems: number;
 	currentPage: number;
+	itemsPerPage: number;
 };

 export type Paginated<T> = {
--- a/frontend/src/lib/types/user-group.type.ts
+++ b/frontend/src/lib/types/user-group.type.ts
@@ -0,0 +1,18 @@
+import type { User } from './user.type';
+
+export type UserGroup = {
+	id: string;
+	friendlyName: string;
+	name: string;
+	createdAt: string;
+};
+
+export type UserGroupWithUsers = UserGroup & {
+	users: User[];
+};
+
+export type UserGroupWithUserCount = UserGroup & {
+	userCount: number;
+};
+
+export type UserGroupCreate = Pick<UserGroup, 'friendlyName' | 'name'>;
--- a/frontend/src/lib/utils/crypto-util.ts
+++ b/frontend/src/lib/utils/crypto-util.ts
@@ -0,0 +1,7 @@
+export async function createSHA256hash(input: string) {
+	const msgUint8 = new TextEncoder().encode(input); // encode as (utf-8) Uint8Array
+	const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8); // hash the message
+	const hashArray = Array.from(new Uint8Array(hashBuffer)); // convert buffer to byte array
+	const hashHex = hashArray.map((b) => b.toString(16).padStart(2, '0')).join(''); // convert bytes to hex string
+	return hashHex;
+}
--- a/frontend/src/routes/+layout.server.ts
+++ b/frontend/src/routes/+layout.server.ts
@@ -1,19 +1,17 @@
-import ApplicationConfigurationService from '$lib/services/application-configuration-service';
+import AppConfigService from '$lib/services/app-config-service';
 import UserService from '$lib/services/user-service';
 import type { LayoutServerLoad } from './$types';

 export const load: LayoutServerLoad = async ({ cookies }) => {
 	const userService = new UserService(cookies.get('access_token'));
-	const applicationConfigurationService = new ApplicationConfigurationService(
-		cookies.get('access_token')
-	);
+	const appConfigService = new AppConfigService(cookies.get('access_token'));

 	const user = await userService
 		.getCurrent()
 		.then((user) => user)
 		.catch(() => null);

-	const applicationConfiguration = await applicationConfigurationService
+	const appConfig = await appConfigService
 		.list()
 		.then((config) => config)
 		.catch((e) => {
@@ -24,6 +22,6 @@ export const load: LayoutServerLoad = async ({ cookies }) => {
 		});
 	return {
 		user,
-		applicationConfiguration
+		appConfig
 	};
 };
--- a/frontend/src/routes/+layout.svelte
+++ b/frontend/src/routes/+layout.svelte
@@ -4,7 +4,7 @@
 	import Error from '$lib/components/error.svelte';
 	import Header from '$lib/components/header/header.svelte';
 	import { Toaster } from '$lib/components/ui/sonner';
-	import applicationConfigurationStore from '$lib/stores/application-configuration-store';
+	import appConfigStore from '$lib/stores/application-configuration-store';
 	import userStore from '$lib/stores/user-store';
 	import { ModeWatcher } from 'mode-watcher';
 	import type { Snippet } from 'svelte';
@@ -19,17 +19,17 @@
 		children: Snippet;
 	} = $props();

-	const { user, applicationConfiguration } = data;
+	const { user, appConfig } = data;

 	if (browser && user) {
 		userStore.setUser(user);
 	}
-	if (applicationConfiguration) {
-		applicationConfigurationStore.set(applicationConfiguration);
+	if (appConfig) {
+		appConfigStore.set(appConfig);
 	}
 </script>

-{#if !applicationConfiguration}
+{#if !appConfig}
 	<Error
 		message="A critical error occured. Please contact your administrator."
 		showButton={false}
--- a/frontend/src/routes/authorize/+page.svelte
+++ b/frontend/src/routes/authorize/+page.svelte
@@ -4,12 +4,12 @@
 	import * as Card from '$lib/components/ui/card';
 	import OidcService from '$lib/services/oidc-service';
 	import WebAuthnService from '$lib/services/webauthn-service';
-	import applicationConfigurationStore from '$lib/stores/application-configuration-store';
+	import appConfigStore from '$lib/stores/application-configuration-store';
 	import userStore from '$lib/stores/user-store';
 	import { getWebauthnErrorMessage } from '$lib/utils/error-util';
 	import { startAuthentication } from '@simplewebauthn/browser';
 	import { AxiosError } from 'axios';
-	import { LucideMail, LucideUser } from 'lucide-svelte';
+	import { LucideMail, LucideUser, LucideUsers } from 'lucide-svelte';
 	import { slide } from 'svelte/transition';
 	import type { PageData } from './$types';
 	import ClientProviderImages from './components/client-provider-images.svelte';
@@ -83,16 +83,17 @@
 	<SignInWrapper>
 		<ClientProviderImages {client} {success} error={!!errorMessage} />
 		<h1 class="font-playfair mt-5 text-3xl font-bold sm:text-4xl">Sign in to {client.name}</h1>
-		{#if !authorizationRequired}
+		{#if errorMessage}
 			<p class="text-muted-foreground mb-10 mt-2">
-				{#if errorMessage}
-					{errorMessage}. Please try again.
-				{:else}
-					Do you want to sign in to <b>{client.name}</b> with your
-					<b>{$applicationConfigurationStore.appName}</b> account?
-				{/if}
+				{errorMessage}. Please try again.
 			</p>
-		{:else}
+		{/if}
+		{#if !authorizationRequired && !errorMessage}
+			<p class="text-muted-foreground mb-10 mt-2">
+				Do you want to sign in to <b>{client.name}</b> with your
+				<b>{$appConfigStore.appName}</b> account?
+			</p>
+		{:else if authorizationRequired}
 			<div transition:slide={{ duration: 300 }}>
 				<Card.Root class="mb-10 mt-6">
 					<Card.Header class="pb-5">
@@ -112,6 +113,13 @@
 									description="View your profile information"
 								/>
 							{/if}
+							{#if scope!.includes('groups')}
+								<ScopeItem
+									icon={LucideUsers}
+									name="Groups"
+									description="View the groups you are a member of"
+								/>
+							{/if}
 						</div>
 					</Card.Content>
 				</Card.Root>
--- a/frontend/src/routes/login/+page.svelte
+++ b/frontend/src/routes/login/+page.svelte
@@ -4,7 +4,7 @@
 	import Logo from '$lib/components/logo.svelte';
 	import { Button } from '$lib/components/ui/button';
 	import WebAuthnService from '$lib/services/webauthn-service';
-	import applicationConfigurationStore from '$lib/stores/application-configuration-store';
+	import appConfigStore from '$lib/stores/application-configuration-store';
 	import userStore from '$lib/stores/user-store';
 	import { getWebauthnErrorMessage } from '$lib/utils/error-util';
 	import { startAuthentication } from '@simplewebauthn/browser';
@@ -40,7 +40,7 @@
 		</div>
 	</div>
 	<h1 class="font-playfair mt-5 text-3xl font-bold sm:text-4xl">
-		Sign in to {$applicationConfigurationStore.appName}
+		Sign in to {$appConfigStore.appName}
 	</h1>
 	<p class="text-muted-foreground mt-2">
 		Authenticate yourself with your passkey to access the admin panel
--- a/frontend/src/routes/login/[token]/+page.svelte
+++ b/frontend/src/routes/login/[token]/+page.svelte
@@ -4,7 +4,7 @@
 	import Logo from '$lib/components/logo.svelte';
 	import { Button } from '$lib/components/ui/button';
 	import UserService from '$lib/services/user-service';
-	import applicationConfigurationStore from '$lib/stores/application-configuration-store.js';
+	import appConfigStore from '$lib/stores/application-configuration-store.js';
 	import userStore from '$lib/stores/user-store.js';
 	import type { User } from '$lib/types/user.type.js';
 	import { axiosErrorToast } from '$lib/utils/error-util';
@@ -18,9 +18,9 @@
 		isLoading = true;
 		userService
 			.exchangeOneTimeAccessToken(data.token)
-			.then((user :User) => {
+			.then((user: User) => {
 				userStore.setUser(user);
-				goto('/settings')
+				goto('/settings');
 			})
 			.catch(axiosErrorToast);
 		isLoading = false;
@@ -29,15 +29,15 @@

 <SignInWrapper>
 	<div class="flex justify-center">
-		<div class="rounded-2xl bg-muted p-3">
+		<div class="bg-muted rounded-2xl p-3">
 			<Logo class="h-10 w-10" />
 		</div>
 	</div>
-	<h1 class="mt-5 font-playfair text-4xl font-bold">One Time Access</h1>
-	<p class="mt-2 text-muted-foreground">
-		You've been granted one-time access to your {$applicationConfigurationStore.appName} account. Please note that if you continue,
-		this link will become invalid. To avoid this, make sure to add a passkey. Otherwise, you'll need
-		to request a new link.
+	<h1 class="font-playfair mt-5 text-4xl font-bold">One Time Access</h1>
+	<p class="text-muted-foreground mt-2">
+		You've been granted one-time access to your {$appConfigStore.appName} account. Please note that if
+		you continue, this link will become invalid. To avoid this, make sure to add a passkey. Otherwise,
+		you'll need to request a new link.
 	</p>
 	<Button class="mt-5" {isLoading} on:click={authenticate}>Continue</Button>
 </SignInWrapper>
--- a/frontend/src/routes/settings/+layout.svelte
+++ b/frontend/src/routes/settings/+layout.svelte
@@ -9,12 +9,16 @@
 		children: Snippet;
 	} = $props();

-	let links = $state([{ href: '/settings/account', label: 'My Account' }]);
+	let links = $state([
+		{ href: '/settings/account', label: 'My Account' },
+		{ href: '/settings/audit-log', label: 'Audit Log' }
+	]);

 	if ($userStore?.isAdmin) {
 		links = [
 			...links,
 			{ href: '/settings/admin/users', label: 'Users' },
+			{ href: '/settings/admin/user-groups', label: 'User Groups' },
 			{ href: '/settings/admin/oidc-clients', label: 'OIDC Clients' },
 			{ href: '/settings/admin/application-configuration', label: 'Application Configuration' }
 		];
@@ -22,14 +26,14 @@
 </script>

 <section>
-	<div class="h-screen w-full">
-		<main class="bg-muted/40 flex min-h-screen flex-col gap-x-4 gap-y-10 p-4 md:p-10 lg:flex-row">
+	<div class="bg-muted/40 min-h-screen w-full">
+		<main class="mx-auto flex max-w-[1640px] flex-col gap-x-4 gap-y-10 p-4 md:p-10 lg:flex-row">
 			<div>
-				<div class="mx-auto grid w-full max-w-[1440px] gap-2">
+				<div class="mx-auto grid w-full gap-2">
 					<h1 class="mb-5 text-3xl font-semibold">Settings</h1>
 				</div>
 				<div
-					class="mx-auto grid w-full max-w-[1440px] items-start gap-6 md:grid-cols-[180px_1fr] lg:grid-cols-[250px_1fr]"
+					class="mx-auto grid items-start gap-6 md:grid-cols-[180px_1fr] lg:grid-cols-[250px_1fr]"
 				>
 					<nav class="text-muted-foreground grid gap-4 text-sm">
 						{#each links as { href, label }}
--- a/frontend/src/routes/settings/account/account-form.svelte
+++ b/frontend/src/routes/settings/account/account-form.svelte
@@ -38,10 +38,10 @@
 <form onsubmit={onSubmit}>
 	<div class="flex flex-col gap-3 sm:flex-row">
 		<div class="w-full">
-			<FormInput label="Firstname" bind:input={$inputs.firstName} />
+			<FormInput label="First name" bind:input={$inputs.firstName} />
 		</div>
 		<div class="w-full">
-			<FormInput label="Lastname" bind:input={$inputs.lastName} />
+			<FormInput label="Last name" bind:input={$inputs.lastName} />
 		</div>
 	</div>
 	<div class="mt-3 flex flex-col gap-3 sm:flex-row">
--- a/frontend/src/routes/settings/admin/application-configuration/+page.server.ts
+++ b/frontend/src/routes/settings/admin/application-configuration/+page.server.ts
@@ -1,10 +1,8 @@
-import ApplicationConfigurationService from '$lib/services/application-configuration-service';
+import AppConfigService from '$lib/services/app-config-service';
 import type { PageServerLoad } from './$types';

 export const load: PageServerLoad = async ({ cookies }) => {
-	const applicationConfigurationService = new ApplicationConfigurationService(
-		cookies.get('access_token')
-	);
-	const applicationConfiguration = await applicationConfigurationService.list(true);
-	return { applicationConfiguration };
+	const appConfigService = new AppConfigService(cookies.get('access_token'));
+	const appConfig = await appConfigService.list(true);
+	return { appConfig };
 };
--- a/frontend/src/routes/settings/admin/application-configuration/+page.svelte
+++ b/frontend/src/routes/settings/admin/application-configuration/+page.svelte
@@ -1,40 +1,46 @@
 <script lang="ts">
 	import * as Card from '$lib/components/ui/card';
-	import ApplicationConfigurationService from '$lib/services/application-configuration-service';
-	import applicationConfigurationStore from '$lib/stores/application-configuration-store';
-	import type { AllApplicationConfiguration } from '$lib/types/application-configuration';
+	import AppConfigService from '$lib/services/app-config-service';
+	import appConfigStore from '$lib/stores/application-configuration-store';
+	import type { AllAppConfig } from '$lib/types/application-configuration';
 	import { axiosErrorToast } from '$lib/utils/error-util';
 	import { toast } from 'svelte-sonner';
-	import ApplicationConfigurationForm from './application-configuration-form.svelte';
+	import AppConfigEmailForm from './forms/app-config-email-form.svelte';
+	import AppConfigGeneralForm from './forms/app-config-general-form.svelte';
 	import UpdateApplicationImages from './update-application-images.svelte';

 	let { data } = $props();
-	let applicationConfiguration = $state(data.applicationConfiguration);
+	let appConfig = $state(data.appConfig);

-	const applicationConfigurationService = new ApplicationConfigurationService();
+	const appConfigService = new AppConfigService();

-	async function updateConfiguration(configuration: AllApplicationConfiguration) {
-		await applicationConfigurationService
-			.update(configuration)
-			.then(() => toast.success('Application configuration updated successfully'))
-			.catch(axiosErrorToast);
-		await applicationConfigurationStore.reload();
+	async function updateAppConfig(updatedAppConfig: Partial<AllAppConfig>) {
+		await appConfigService
+			.update({
+				...appConfig,
+				...updatedAppConfig
+			})
+			.catch((e) => {
+				axiosErrorToast(e);
+				throw e;
+			});
+		await appConfigStore.reload();
 	}

 	async function updateImages(
-		logo: File | null,
+		logoLight: File | null,
+		logoDark: File | null,
 		backgroundImage: File | null,
 		favicon: File | null
 	) {
-		const faviconPromise = favicon
-			? applicationConfigurationService.updateFavicon(favicon)
-			: Promise.resolve();
-		const logoPromise = logo ? applicationConfigurationService.updateLogo(logo) : Promise.resolve();
+		const faviconPromise = favicon ? appConfigService.updateFavicon(favicon) : Promise.resolve();
+		const lightLogoPromise = logoLight ? appConfigService.updateLogo(logoLight, true) : Promise.resolve();
+		const darkLogoPromise = logoDark ? appConfigService.updateLogo(logoDark, false) : Promise.resolve();
 		const backgroundImagePromise = backgroundImage
-			? applicationConfigurationService.updateBackgroundImage(backgroundImage)
+			? appConfigService.updateBackgroundImage(backgroundImage)
 			: Promise.resolve();

-		await Promise.all([logoPromise, backgroundImagePromise, faviconPromise])
+		await Promise.all([lightLogoPromise, darkLogoPromise, backgroundImagePromise, faviconPromise])
 			.then(() => toast.success('Images updated successfully'))
 			.catch(axiosErrorToast);
 	}
@@ -49,7 +55,20 @@
 		<Card.Title>General</Card.Title>
 	</Card.Header>
 	<Card.Content>
-		<ApplicationConfigurationForm {applicationConfiguration} callback={updateConfiguration} />
+		<AppConfigGeneralForm {appConfig} callback={updateAppConfig} />
+	</Card.Content>
+</Card.Root>
+
+<Card.Root>
+	<Card.Header>
+		<Card.Title>Email</Card.Title>
+		<Card.Description>
+			Enable email notifications to alert users when a login is detected from a new device or
+			location.
+		</Card.Description>
+	</Card.Header>
+	<Card.Content>
+		<AppConfigEmailForm {appConfig} callback={updateAppConfig} />
 	</Card.Content>
 </Card.Root>

--- a/frontend/src/routes/settings/admin/application-configuration/application-image.svelte
+++ b/frontend/src/routes/settings/admin/application-configuration/application-image.svelte
@@ -8,9 +8,10 @@
 		id,
 		imageClass,
 		label,
-		image = $bindable<File | null>(null),
+		image = $bindable(),
 		imageURL,
 		accept = 'image/png, image/jpeg, image/svg+xml',
+		forceColorScheme,
 		...restProps
 	}: HTMLAttributes<HTMLDivElement> & {
 		id: string;
@@ -18,6 +19,7 @@
 		label: string;
 		image: File | null;
 		imageURL: string;
+		forceColorScheme?: 'light' | 'dark';
 		accept?: string;
 	} = $props();

@@ -37,10 +39,16 @@
 	}
 </script>

-<div {...restProps}>
-	<Label for={id}>{label}</Label>
+<div class="flex flex-col items-start md:flex-row md:items-center" {...restProps}>
+	<Label class="w-52" for={id}>{label}</Label>
 	<FileInput {id} variant="secondary" {accept} onchange={onImageChange}>
-		<div class="bg-muted group relative flex items-center rounded">
+		<div
+			class="{forceColorScheme === 'light'
+				? 'bg-[#F1F1F5]'
+				: forceColorScheme === 'dark'
+					? 'bg-[#27272A]'
+					: 'bg-muted'} group relative flex items-center rounded"
+		>
 			<img
 				class={cn(
 					'h-full w-full rounded object-cover p-3 transition-opacity duration-200 group-hover:opacity-10',
--- a/frontend/src/routes/settings/admin/application-configuration/forms/app-config-email-form.svelte
+++ b/frontend/src/routes/settings/admin/application-configuration/forms/app-config-email-form.svelte
@@ -0,0 +1,80 @@
+<script lang="ts">
+	import FormInput from '$lib/components/form-input.svelte';
+	import { Button } from '$lib/components/ui/button';
+	import type { AllAppConfig } from '$lib/types/application-configuration';
+	import { createForm } from '$lib/utils/form-util';
+	import { toast } from 'svelte-sonner';
+	import { z } from 'zod';
+
+	let {
+		callback,
+		appConfig
+	}: {
+		appConfig: AllAppConfig;
+		callback: (appConfig: Partial<AllAppConfig>) => Promise<void>;
+	} = $props();
+
+	let isLoading = $state(false);
+	let emailEnabled = $state(appConfig.emailEnabled == 'true');
+
+	const updatedAppConfig = {
+		emailEnabled: emailEnabled.toString(),
+		smtpHost: appConfig.smtpHost,
+		smtpPort: appConfig.smtpPort,
+		smtpUser: appConfig.smtpUser,
+		smtpPassword: appConfig.smtpPassword,
+		smtpFrom: appConfig.smtpFrom
+	};
+
+	const formSchema = z.object({
+		smtpHost: z.string().min(1),
+		smtpPort: z.string().min(1),
+		smtpUser: z.string().min(1),
+		smtpPassword: z.string().min(1),
+		smtpFrom: z.string().email()
+	});
+
+	const { inputs, ...form } = createForm< typeof formSchema>(formSchema, updatedAppConfig);
+
+	async function onSubmit() {
+		const data = form.validate();
+		if (!data) return false;
+		isLoading = true;
+		await callback({
+			...data,
+			emailEnabled: 'true'
+		}).finally(() => (isLoading = false));
+		toast.success('Email configuration updated successfully');
+		return true;
+	}
+
+	async function onDisable() {
+		await callback({ emailEnabled: 'false' });
+		emailEnabled = false;
+		toast.success('Email disabled successfully');
+	}
+
+	async function onEnable() {
+		if (await onSubmit()) {
+			emailEnabled = true;
+		}
+	}
+</script>
+
+<form onsubmit={onSubmit}>
+	<div class="mt-5 grid grid-cols-2 gap-5">
+		<FormInput label="SMTP Host" bind:input={$inputs.smtpHost} />
+		<FormInput label="SMTP Port" bind:input={$inputs.smtpPort} />
+		<FormInput label="SMTP User" bind:input={$inputs.smtpUser} />
+		<FormInput label="SMTP Password" type="password" bind:input={$inputs.smtpPassword} />
+		<FormInput label="SMTP From" bind:input={$inputs.smtpFrom} />
+	</div>
+	<div class="mt-5 flex justify-end gap-3">
+		{#if emailEnabled}
+			<Button variant="secondary" onclick={onDisable}>Disable</Button>
+			<Button {isLoading} onclick={onSubmit} type="submit">Save</Button>
+		{:else}
+			<Button {isLoading} onclick={onEnable} type="submit">Enable</Button>
+		{/if}
+	</div>
+</form>
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Elias Schneider	2587058ded	release: 0.9.0	2024-10-18 08:23:55 +02:00
Elias Schneider	ff06bf0b34	feat: add environment variable to change the caddy port in Docker	2024-10-18 08:23:06 +02:00
Elias Schneider	11ed661f86	feat: use improve table for users and audit logs	2024-10-16 08:49:19 +02:00
Elias Schneider	29748cc6c7	fix: allow copy to clipboard for client secret	2024-10-13 15:55:17 +02:00
Elias Schneider	edfb99d221	release: 0.8.1	2024-10-11 20:53:47 +02:00
Elias Schneider	282ff82b0c	fix: add key id to JWK	2024-10-11 20:52:31 +02:00
Elias Schneider	9d5f83da78	chore: dump dependencies	2024-10-04 14:15:04 +02:00
Elias Schneider	896da812a3	ci/cd: create dummy GeoLite2 City database for e2e tests	2024-10-04 12:17:32 +02:00
Elias Schneider	d2b3b7647d	release: 0.8.0	2024-10-04 12:11:43 +02:00
Elias Schneider	025378d14e	feat: add location based on ip to the audit log	2024-10-04 12:11:10 +02:00
Elias Schneider	e033ba6d45	release: 0.7.1	2024-10-03 22:20:37 +02:00
Elias Schneider	e09562824a	fix: initials don't get displayed if Gravatar avatar doesn't exist	2024-10-03 22:20:22 +02:00
Elias Schneider	08f7fd16a9	release: 0.7.0	2024-10-03 11:31:11 +02:00
Elias Schneider	be45eed125	feat!: add ability to set light and dark mode logo	2024-10-03 11:27:31 +02:00
Elias Schneider	9e94a436cc	release: 0.6.0	2024-10-02 11:13:46 +02:00
Elias Schneider	f82020ccfb	feat: add copy to clipboard option for OIDC client information	2024-10-02 11:03:30 +02:00
Elias Schneider	a4a90a16a9	fix: only return user groups if it is explicitly requested	2024-10-02 10:41:10 +02:00
Elias Schneider	365734ec5d	feat: add gravatar profile picture integration	2024-10-02 10:02:28 +02:00
Elias Schneider	d02d8931a0	tests: add user group tests	2024-10-02 09:38:57 +02:00
Elias Schneider	24c948e6a6	feat: add user groups	2024-10-02 08:43:44 +02:00
Elias Schneider	7a54d3ae20	refactor: format caddyfiles	2024-09-27 11:10:33 +02:00
Elias Schneider	5e1d19e0a4	release: 0.5.3	2024-09-26 09:36:33 +02:00
edbourque0	d6a9bb4c09	fix: add space to "Firstname" and "Lastname" label (#31 ) Co-authored-by: Elias Schneider <login@eliasschneider.com>	2024-09-26 09:33:02 +02:00
Elias Schneider	3c67765992	fix: port environment variables get ignored in caddyfile	2024-09-26 09:08:59 +02:00
Elias Schneider	6bb613e0e7	chore: set the go version to `1.23.1`	2024-09-19 08:56:30 +02:00
Elias Schneider	7be115f7da	release: 0.5.2	2024-09-19 08:52:16 +02:00
Elias Schneider	924bb1468b	fix: updated application name doesn't apply to webauthn credential	2024-09-19 08:51:45 +02:00
Elias Schneider	4553458939	release: 0.5.1	2024-09-16 23:19:13 +02:00
Elias Schneider	9c2848db1d	fix: debounce oidc client and user search	2024-09-16 23:18:55 +02:00
oidq	64cf56276a	feat(email): improve email templating (#27 )	2024-09-16 23:10:08 +02:00
Elias Schneider	1f0ec08290	release: 0.5.0	2024-09-09 10:30:12 +02:00
Elias Schneider	9121239dd7	feat: add audit log with email notification (#26 )	2024-09-09 10:29:41 +02:00
Elias Schneider	4010ee27d6	release: 0.4.1	2024-09-06 09:24:42 +02:00
Elias Schneider	4e7574a297	feat: add name claim to userinfo endpoint and id token	2024-09-06 09:19:13 +02:00
Elias Schneider	8038a111dd	fix: show error message if error occurs while authorizing new client	2024-09-06 08:58:23 +02:00
Elias Schneider	c6f83a581a	fix: limit width of content on large screens	2024-09-06 08:57:48 +02:00
@@ -1 +1 @@
 .4.0
 .9.0