Merge pull request 'develop' (#14 ) from develop into main

Reviewed-on: #14
Merge pull request 'add guards admin-dashboard and user-dashboard components' (#13 ) from feature/guards into develop
2026-03-16 16:46:18 +00:00 · 2026-03-16 16:44:14 +00:00 · 2026-03-16 17:43:26 +01:00 · 2026-03-15 19:02:16 +00:00 · 2026-03-15 20:01:51 +01:00 · 2026-03-15 18:11:18 +00:00
39 changed files with 990 additions and 125 deletions
--- a/.idea/.idea.DotNetAngular/.idea/workspace.xml
+++ b/.idea/.idea.DotNetAngular/.idea/workspace.xml
@@ -12,7 +12,43 @@
    <option name="autoReloadType" value="SELECTIVE" />
  </component>
  <component name="ChangeListManager">
-    <list default="true" id="1ac72a4a-52ad-4e70-9b15-c330b1ed3e7a" name="Changes" comment="" />
+    <list default="true" id="1ac72a4a-52ad-4e70-9b15-c330b1ed3e7a" name="Changes" comment="">
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.html" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.scss" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.html" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.scss" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.html" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.scss" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-table/user-table.component.html" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-table/user-table.component.scss" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-table/user-table.component.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/user-table/user-table.component.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/guards/admin.guard.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/guards/admin.guard.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/guards/authentication.guard.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/guards/authentication.guard.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/guards/guest.guard.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/guards/guest.guard.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/interceptors/token.interceptor.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/interceptors/token.interceptor.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.html" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.scss" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.spec.ts" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/.idea/.idea.DotNetAngular/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/.idea.DotNetAngular/.idea/workspace.xml" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/ClientApp/src/app/app.config.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/ClientApp/src/app/app.config.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/ClientApp/src/app/app.routes.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/ClientApp/src/app/app.routes.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/ClientApp/src/app/domain/entities/user.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/ClientApp/src/app/domain/entities/user.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/authentication/login/login.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/authentication/login/login.component.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/header/header.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/header/header.component.html" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/header/header.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/ClientApp/src/app/presentation/components/header/header.component.ts" afterDir="false" />
+    </list>
    <option name="SHOW_DIALOG" value="false" />
    <option name="HIGHLIGHT_CONFLICTS" value="true" />
    <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
@@ -34,6 +70,7 @@
    <option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
  </component>
  <component name="HighlightingSettingsPerFile">
+    <setting file="file://$PROJECT_DIR$/dotnet-tools.json" root0="FORCE_HIGHLIGHTING" />
    <setting file="file://$PROJECT_DIR$/src/ClientApp/package-lock.json" root0="SKIP_HIGHLIGHTING" />
    <setting file="file://$PROJECT_DIR$/src/ClientApp/package.json" root0="FORCE_HIGHLIGHTING" />
  </component>
@@ -42,6 +79,9 @@
    <urls />
  </component>
  <component name="MetaFilesCheckinStateConfiguration" checkMetaFiles="true" />
+  <component name="ProblemsViewState">
+    <option name="selectedTabId" value="Toolset" />
+  </component>
  <component name="ProjectColorInfo">{
  &quot;associatedIndex&quot;: 5
 }</component>
@@ -50,28 +90,28 @@
    <option name="hideEmptyMiddlePackages" value="true" />
    <option name="showLibraryContents" value="true" />
  </component>
-  <component name="PropertiesComponent"><![CDATA[{
-  "keyToString": {
-    ".NET Launch Settings Profile.API: Angular_dev.executor": "Run",
-    "RunOnceActivity.MCP Project settings loaded": "true",
-    "RunOnceActivity.ShowReadmeOnStart": "true",
-    "RunOnceActivity.TerminalTabsStorage.copyFrom.TerminalArrangementManager.252": "true",
-    "RunOnceActivity.git.unshallow": "true",
-    "RunOnceActivity.typescript.service.memoryLimit.init": "true",
-    "com.intellij.ml.llm.matterhorn.ej.ui.settings.DefaultModelSelectionForGA.v1": "true",
-    "git-widget-placeholder": "feature/nuget",
-    "junie.onboarding.icon.badge.shown": "true",
-    "node.js.detected.package.eslint": "true",
-    "node.js.detected.package.tslint": "true",
-    "node.js.selected.package.eslint": "(autodetect)",
-    "node.js.selected.package.tslint": "(autodetect)",
-    "nodejs_package_manager_path": "npm",
-    "settings.editor.selected.configurable": "preferences.pluginManager",
-    "to.speed.mode.migration.done": "true",
-    "ts.external.directory.path": "/home/natlinux/RiderProjects/DotNetAngular/src/ClientApp/node_modules/typescript/lib",
-    "vue.rearranger.settings.migration": "true"
+  <component name="PropertiesComponent">{
+  &quot;keyToString&quot;: {
+    &quot;.NET Launch Settings Profile.API: Angular_dev.executor&quot;: &quot;Run&quot;,
+    &quot;RunOnceActivity.MCP Project settings loaded&quot;: &quot;true&quot;,
+    &quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
+    &quot;RunOnceActivity.TerminalTabsStorage.copyFrom.TerminalArrangementManager.252&quot;: &quot;true&quot;,
+    &quot;RunOnceActivity.git.unshallow&quot;: &quot;true&quot;,
+    &quot;RunOnceActivity.typescript.service.memoryLimit.init&quot;: &quot;true&quot;,
+    &quot;com.intellij.ml.llm.matterhorn.ej.ui.settings.DefaultModelSelectionForGA.v1&quot;: &quot;true&quot;,
+    &quot;git-widget-placeholder&quot;: &quot;feature/guards&quot;,
+    &quot;junie.onboarding.icon.badge.shown&quot;: &quot;true&quot;,
+    &quot;node.js.detected.package.eslint&quot;: &quot;true&quot;,
+    &quot;node.js.detected.package.tslint&quot;: &quot;true&quot;,
+    &quot;node.js.selected.package.eslint&quot;: &quot;(autodetect)&quot;,
+    &quot;node.js.selected.package.tslint&quot;: &quot;(autodetect)&quot;,
+    &quot;nodejs_package_manager_path&quot;: &quot;npm&quot;,
+    &quot;settings.editor.selected.configurable&quot;: &quot;preferences.pluginManager&quot;,
+    &quot;to.speed.mode.migration.done&quot;: &quot;true&quot;,
+    &quot;ts.external.directory.path&quot;: &quot;/home/natlinux/RiderProjects/DotNetAngular/src/ClientApp/node_modules/typescript/lib&quot;,
+    &quot;vue.rearranger.settings.migration&quot;: &quot;true&quot;
  }
-}]]></component>
+}</component>
  <component name="RecapUselessUpdatesCounter">
    <option name="suspendCountdown" value="0" />
  </component>
@@ -211,6 +251,9 @@
      <workItem from="1772664174287" duration="646000" />
      <workItem from="1773053172796" duration="1432000" />
      <workItem from="1773597121547" duration="689000" />
+      <workItem from="1773599776473" duration="3799000" />
+      <workItem from="1773605341198" duration="3147000" />
+      <workItem from="1773678089390" duration="1025000" />
    </task>
    <task id="LOCAL-00001" summary="updating template">
      <option name="closed" value="true" />
@@ -260,7 +303,23 @@
      <option name="project" value="LOCAL" />
      <updated>1773597809588</updated>
    </task>
-    <option name="localTasksCounter" value="7" />
+    <task id="LOCAL-00007" summary="update Angular core to new version">
+      <option name="closed" value="true" />
+      <created>1773598259701</created>
+      <option name="number" value="00007" />
+      <option name="presentableId" value="LOCAL-00007" />
+      <option name="project" value="LOCAL" />
+      <updated>1773598259701</updated>
+    </task>
+    <task id="LOCAL-00008" summary="fix dropdown">
+      <option name="closed" value="true" />
+      <created>1773601314558</created>
+      <option name="number" value="00008" />
+      <option name="presentableId" value="LOCAL-00008" />
+      <option name="project" value="LOCAL" />
+      <updated>1773601314558</updated>
+    </task>
+    <option name="localTasksCounter" value="9" />
    <servers />
  </component>
  <component name="TypeScriptGeneratedFilesManager">
@@ -302,7 +361,9 @@
    <MESSAGE value="update to dotnet 10" />
    <MESSAGE value="update nuget packages to new versions" />
    <MESSAGE value="update NuGet Package to new Version" />
-    <option name="LAST_COMMIT_MESSAGE" value="update NuGet Package to new Version" />
+    <MESSAGE value="update Angular core to new version" />
+    <MESSAGE value="fix dropdown" />
+    <option name="LAST_COMMIT_MESSAGE" value="fix dropdown" />
  </component>
  <component name="XDebuggerManager">
    <breakpoint-manager>
--- a/src/ClientApp/package-lock.json
+++ b/src/ClientApp/package-lock.json
@@ -8,14 +8,14 @@
      "name": "client-app",
      "version": "0.0.0",
      "dependencies": {
-        "@angular/animations": "^21.1.2",
-        "@angular/common": "^21.1.2",
-        "@angular/compiler": "^21.1.2",
-        "@angular/core": "^21.1.2",
-        "@angular/forms": "^21.1.2",
-        "@angular/platform-browser": "^21.1.2",
-        "@angular/platform-browser-dynamic": "^21.1.2",
-        "@angular/router": "^21.1.2",
+        "@angular/animations": "^21.2.4",
+        "@angular/common": "^21.2.4",
+        "@angular/compiler": "^21.2.4",
+        "@angular/core": "^21.2.4",
+        "@angular/forms": "^21.2.4",
+        "@angular/platform-browser": "^21.2.4",
+        "@angular/platform-browser-dynamic": "^21.2.4",
+        "@angular/router": "^21.2.4",
        "@auth0/angular-jwt": "^5.2.0",
        "@ng-bootstrap/ng-bootstrap": "^20.0.0",
        "bootstrap": "^5.3.8",
@@ -27,7 +27,7 @@
      "devDependencies": {
        "@angular/build": "^21.2.2",
        "@angular/cli": "^21.2.2",
-        "@angular/compiler-cli": "^21.1.2",
+        "@angular/compiler-cli": "^21.2.4",
        "@types/jasmine": "~5.1.0",
        "jasmine-core": "~5.2.0",
        "karma": "~6.4.0",
@@ -328,9 +328,9 @@
      }
    },
    "node_modules/@angular/animations": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-21.1.3.tgz",
-      "integrity": "sha512-UADMncDd9lkmIT1NPVFcufyP5gJHMPzxNaQpojiGrxT1aT8Du30mao0KSrB4aTwcicv6/cdD5bZbIyg+FL6LkQ==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-21.2.4.tgz",
+      "integrity": "sha512-hO1P7ks9n7lW3D31bzHohSuoAaj05xJUlK8rZgX8IkH5DLx4qhvfNh0t4bbLuBJLP2r1TaLsQ8KFcemCkFRO2w==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
@@ -340,7 +340,7 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/core": "21.1.3"
+        "@angular/core": "21.2.4"
      }
    },
    "node_modules/@angular/build": {
@@ -527,9 +527,9 @@
      }
    },
    "node_modules/@angular/common": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/common/-/common-21.1.3.tgz",
-      "integrity": "sha512-Wdbln/UqZM5oVnpfIydRdhhL8A9x3bKZ9Zy1/mM0q+qFSftPvmFZIXhEpFqbDwNYbGUhGzx7t8iULC4sVVp/zA==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/common/-/common-21.2.4.tgz",
+      "integrity": "sha512-NrP6qOuUpo3fqq14UJ1b2bIRtWsfvxh1qLqOyFV4gfBrHhXd0XffU1LUlUw1qp4w1uBSgPJ0/N5bSPUWrAguVg==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
@@ -539,14 +539,14 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/core": "21.1.3",
+        "@angular/core": "21.2.4",
        "rxjs": "^6.5.3 || ^7.4.0"
      }
    },
    "node_modules/@angular/compiler": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-21.1.3.tgz",
-      "integrity": "sha512-gDNLh7MEf7Qf88ktZzS4LJQXCA5U8aQTfK9ak+0mi2ruZ0x4XSjQCro4H6OPKrrbq94+6GcnlSX5+oVIajEY3w==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-21.2.4.tgz",
+      "integrity": "sha512-9+ulVK3idIo/Tu4X2ic7/V0+Uj7pqrOAbOuIirYe6Ymm3AjexuFRiGBbfcH0VJhQ5cf8TvIJ1fuh+MI4JiRIxA==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
@@ -557,13 +557,13 @@
      }
    },
    "node_modules/@angular/compiler-cli": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-21.1.3.tgz",
-      "integrity": "sha512-nKxoQ89W2B1WdonNQ9kgRnvLNS6DAxDrRHBslsKTlV+kbdv7h59M9PjT4ZZ2sp1M/M8LiofnUfa/s2jd/xYj5w==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-21.2.4.tgz",
+      "integrity": "sha512-vGjd7DZo/Ox50pQCm5EycmBu91JclimPtZoyNXu/2hSxz3oAkzwiHCwlHwk2g58eheSSp+lYtYRLmHAqSVZLjg==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
-        "@babel/core": "7.28.5",
+        "@babel/core": "7.29.0",
        "@jridgewell/sourcemap-codec": "^1.4.14",
        "chokidar": "^5.0.0",
        "convert-source-map": "^1.5.1",
@@ -580,8 +580,8 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/compiler": "21.1.3",
-        "typescript": ">=5.9 <6.0"
+        "@angular/compiler": "21.2.4",
+        "typescript": ">=5.9 <6.1"
      },
      "peerDependenciesMeta": {
        "typescript": {
@@ -589,10 +589,55 @@
        }
      }
    },
+    "node_modules/@angular/compiler-cli/node_modules/@babel/core": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.0.tgz",
+      "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.0",
+        "@babel/generator": "^7.29.0",
+        "@babel/helper-compilation-targets": "^7.28.6",
+        "@babel/helper-module-transforms": "^7.28.6",
+        "@babel/helpers": "^7.28.6",
+        "@babel/parser": "^7.29.0",
+        "@babel/template": "^7.28.6",
+        "@babel/traverse": "^7.29.0",
+        "@babel/types": "^7.29.0",
+        "@jridgewell/remapping": "^2.3.5",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
+      }
+    },
+    "node_modules/@angular/compiler-cli/node_modules/@babel/core/node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "license": "MIT"
+    },
+    "node_modules/@angular/compiler-cli/node_modules/@babel/core/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
    "node_modules/@angular/core": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/core/-/core-21.1.3.tgz",
-      "integrity": "sha512-TbhQxRC7Lb/3WBdm1n8KRsktmVEuGBBp0WRF5mq0Ze4s1YewIM6cULrSw9ACtcL5jdcq7c74ms+uKQsaP/gdcQ==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/core/-/core-21.2.4.tgz",
+      "integrity": "sha512-2+gd67ZuXHpGOqeb2o7XZPueEWEP81eJza2tSHkT5QMV8lnYllDEmaNnkPxnIjSLGP1O3PmiXxo4z8ibHkLZwg==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
@@ -602,7 +647,7 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/compiler": "21.1.3",
+        "@angular/compiler": "21.2.4",
        "rxjs": "^6.5.3 || ^7.4.0",
        "zone.js": "~0.15.0 || ~0.16.0"
      },
@@ -616,9 +661,9 @@
      }
    },
    "node_modules/@angular/forms": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-21.1.3.tgz",
-      "integrity": "sha512-YW/YdjM9suZUeJam9agHFXIEE3qQIhGYXMjnnX7xGjOe+CuR2R0qsWn1AR0yrKrNmFspb0lKgM7kTTJyzt8gZg==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-21.2.4.tgz",
+      "integrity": "sha512-1fOhctA9ADEBYjI3nPQUR5dHsK2+UWAjup37Ksldk/k0w8UpD5YsN7JVNvsDMZRFMucKYcGykPblU7pABtsqnQ==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
@@ -629,9 +674,9 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/common": "21.1.3",
-        "@angular/core": "21.1.3",
-        "@angular/platform-browser": "21.1.3",
+        "@angular/common": "21.2.4",
+        "@angular/core": "21.2.4",
+        "@angular/platform-browser": "21.2.4",
        "rxjs": "^6.5.3 || ^7.4.0"
      }
    },
@@ -661,9 +706,9 @@
      }
    },
    "node_modules/@angular/platform-browser": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-21.1.3.tgz",
-      "integrity": "sha512-W+ZMXAioaP7CsACafBCHsIxiiKrRTPOlQ+hcC7XNBwy+bn5mjGONoCgLreQs76M8HNWLtr/OAUAr6h26OguOuA==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-21.2.4.tgz",
+      "integrity": "sha512-1A9e/cQVu+3BkRCktLcO3RZGuw8NOTHw1frUUrpAz+iMyvIT4sDRFbL+U1g8qmOCZqRNC1Pi1HZfZ1kl6kvrcQ==",
      "license": "MIT",
      "peer": true,
      "dependencies": {
@@ -673,9 +718,9 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/animations": "21.1.3",
-        "@angular/common": "21.1.3",
-        "@angular/core": "21.1.3"
+        "@angular/animations": "21.2.4",
+        "@angular/common": "21.2.4",
+        "@angular/core": "21.2.4"
      },
      "peerDependenciesMeta": {
        "@angular/animations": {
@@ -684,9 +729,9 @@
      }
    },
    "node_modules/@angular/platform-browser-dynamic": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-21.1.3.tgz",
-      "integrity": "sha512-wWEjrNtJfxzZmbDWdJSyRau7NWpQ6IFM9QAyn7xH3cQDGCj+Gy9lTU5sUIYQc+7sx3nKWztolc7h/M5meYCTAg==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-21.2.4.tgz",
+      "integrity": "sha512-LRJLnGh4rdgD0+S5xuDd4YRm5bV8WP2e6F1Pe5rIr6N4V9ofgpB0/uOjYy9se99FJZjoyPnpxaKsp8+XA753Zg==",
      "license": "MIT",
      "dependencies": {
        "tslib": "^2.3.0"
@@ -695,16 +740,16 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/common": "21.1.3",
-        "@angular/compiler": "21.1.3",
-        "@angular/core": "21.1.3",
-        "@angular/platform-browser": "21.1.3"
+        "@angular/common": "21.2.4",
+        "@angular/compiler": "21.2.4",
+        "@angular/core": "21.2.4",
+        "@angular/platform-browser": "21.2.4"
      }
    },
    "node_modules/@angular/router": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/@angular/router/-/router-21.1.3.tgz",
-      "integrity": "sha512-uAw4LAMHXAPCe4SywhlUEWjMYVbbLHwTxLyduSp1b+9aVwep0juy5O/Xttlxd/oigVe0NMnOyJG9y1Br/ubnrg==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/@angular/router/-/router-21.2.4.tgz",
+      "integrity": "sha512-OjWze4XT8i2MThcBXMv7ru1k6/5L6QYZbcXuseqimFCHm2avEJ+mXPovY066fMBZJhqbXdjB82OhHAWkIHjglQ==",
      "license": "MIT",
      "dependencies": {
        "tslib": "^2.3.0"
@@ -713,9 +758,9 @@
        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "@angular/common": "21.1.3",
-        "@angular/core": "21.1.3",
-        "@angular/platform-browser": "21.1.3",
+        "@angular/common": "21.2.4",
+        "@angular/core": "21.2.4",
+        "@angular/platform-browser": "21.2.4",
        "rxjs": "^6.5.3 || ^7.4.0"
      }
    },
@@ -6845,6 +6890,7 @@
      "integrity": "sha512-ME4Fb83LgEgwNw96RKNvKV4VTLuXfoKudAmm2lP8Kk87KaMK0/Xrx/aAkMWmT8mDb+3MlFDspfbCs7adjRxA2g==",
      "dev": true,
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "cli-truncate": "^5.0.0",
        "colorette": "^2.0.20",
--- a/src/ClientApp/package.json
+++ b/src/ClientApp/package.json
@@ -12,14 +12,14 @@
  },
  "private": true,
  "dependencies": {
-    "@angular/animations": "^21.1.2",
-    "@angular/common": "^21.1.2",
-    "@angular/compiler": "^21.1.2",
-    "@angular/core": "^21.1.2",
-    "@angular/forms": "^21.1.2",
-    "@angular/platform-browser": "^21.1.2",
-    "@angular/platform-browser-dynamic": "^21.1.2",
-    "@angular/router": "^21.1.2",
+    "@angular/animations": "^21.2.4",
+    "@angular/common": "^21.2.4",
+    "@angular/compiler": "^21.2.4",
+    "@angular/core": "^21.2.4",
+    "@angular/forms": "^21.2.4",
+    "@angular/platform-browser": "^21.2.4",
+    "@angular/platform-browser-dynamic": "^21.2.4",
+    "@angular/router": "^21.2.4",
    "@auth0/angular-jwt": "^5.2.0",
    "@ng-bootstrap/ng-bootstrap": "^20.0.0",
    "bootstrap": "^5.3.8",
@@ -31,7 +31,7 @@
  "devDependencies": {
    "@angular/build": "^21.2.2",
    "@angular/cli": "^21.2.2",
-    "@angular/compiler-cli": "^21.1.2",
+    "@angular/compiler-cli": "^21.2.4",
    "@types/jasmine": "~5.1.0",
    "jasmine-core": "~5.2.0",
    "karma": "~6.4.0",
--- a/src/ClientApp/src/app/app.config.ts
+++ b/src/ClientApp/src/app/app.config.ts
@@ -2,7 +2,12 @@ import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
 import { provideRouter } from '@angular/router';

 import { routes } from './app.routes';
+import {provideHttpClient, withFetch, withInterceptors} from "@angular/common/http";
+import {tokenInterceptor} from "./presentation/interceptors/token.interceptor";
+import {provideClientHydration, withEventReplay} from "@angular/platform-browser";

 export const appConfig: ApplicationConfig = {
-  providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes)]
+  providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes),
+    provideHttpClient(withFetch(), withInterceptors([tokenInterceptor
+    ])), provideClientHydration(withEventReplay())]
 };
--- a/src/ClientApp/src/app/app.routes.ts
+++ b/src/ClientApp/src/app/app.routes.ts
@@ -2,10 +2,21 @@ import { Routes } from '@angular/router';
 import {RegisterComponent} from "./presentation/authentication/register/register.component";
 import {LoginComponent} from "./presentation/authentication/login/login.component";
 import {StartpageComponent} from "./presentation/components/startpage/startpage.component";
+import {AdminDashboardComponent} from "./presentation/components/admin-dashboard/admin-dashboard.component";
+import {UserDashboardComponent} from "./presentation/components/user-dashboard/user-dashboard.component";
+import {UnauthorizedComponent} from "./presentation/components/unauthorized/unauthorized.component";
+import {guestGuard} from "./presentation/guards/guest.guard";
+import {AuthenticationGuard} from "./presentation/guards/authentication.guard";
+import {adminGuard} from "./presentation/guards/admin.guard";
+import {UserTableComponent} from "./presentation/components/user-table/user-table.component";

 export const routes: Routes = [
-  {path: '', redirectTo: 'login', pathMatch: 'full'},
-  {path: 'register', component: RegisterComponent},
-  {path: 'login', component: LoginComponent},
-  {path: 'startpage', component: StartpageComponent}
+  {path: '', redirectTo: 'startpage', pathMatch: 'full'},
+  {path: 'register', component: RegisterComponent, canActivate: [guestGuard]},
+  {path: 'login', component: LoginComponent, canActivate: [guestGuard]},
+  {path: 'startpage', component: StartpageComponent, canActivate: [guestGuard]},
+  {path: 'user-table', component: UserTableComponent, canActivate: [adminGuard]},
+  {path: 'admin-dashboard', component: AdminDashboardComponent, canActivate: [adminGuard]},
+  {path: 'user-dashboard', component: UserDashboardComponent, canActivate: [AuthenticationGuard]},
+  {path: 'unauthorized', component: UnauthorizedComponent, canActivate: [AuthenticationGuard]}
 ];
--- a/src/ClientApp/src/app/domain/entities/user.ts
+++ b/src/ClientApp/src/app/domain/entities/user.ts
@@ -1,4 +1,3 @@
-import {RssFeed} from "./rss-feed";
 import {UserRole} from "./user-role";

 export interface User {
@@ -8,9 +7,5 @@ export interface User {
  password: string;
  lastLogin: Date;

-  rssFeedId: number;
-  rssFeed: RssFeed;
-
  UserRoles: UserRole[];
-  rssFeeds: RssFeed [];
 }
--- a/src/ClientApp/src/app/infrastructure/services/auth-service.ts
+++ b/src/ClientApp/src/app/infrastructure/services/auth-service.ts
@@ -36,7 +36,7 @@ export class AuthService implements IAuthService {
  }

  signOut() {
-    if (!this.isBrowser) {
+    if (this.isBrowser) {
      localStorage.clear();
      this.router.navigate(['/login']).catch(error => {
        console.error('Navigation error:', error);
--- a/src/ClientApp/src/app/presentation/authentication/login/login.component.ts
+++ b/src/ClientApp/src/app/presentation/authentication/login/login.component.ts
@@ -66,7 +66,8 @@ export class LoginComponent {
          this.userStore.setEmailForStore(tokenPayload.email);
          this.userStore.setRoleForStore(tokenPayload.role);
          this.loadingService.hide()
-          this.router.navigate(['startpage']).then(success => {
+          // TODO redirect to...
+          this.router.navigate(['user-dashboard']).then(success => {
            if (success) {
               this.loginForm.reset();
            }
--- a/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.html
+++ b/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.html
@@ -0,0 +1,10 @@
+<div class="container-fluid d-flex justify-content-center">
+  <div class="card mt-2 col-2 me-2" [routerLink]="['/user-table']" style="cursor: pointer;">
+    <div class="card-body text-center">
+      <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" fill="blue" class="bi bi-people-fill " viewBox="0 0 16 16">
+        <path d="M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5"/>
+      </svg>
+      <h4 class="my-3">Users</h4>
+    </div>
+  </div>
+</div>
--- a/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.scss
+++ b/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.scss
--- a/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.spec.ts
+++ b/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AdminDashboardComponent } from './admin-dashboard.component';
+
+describe('AdminDashboardComponent', () => {
+  let component: AdminDashboardComponent;
+  let fixture: ComponentFixture<AdminDashboardComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [AdminDashboardComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(AdminDashboardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.ts
+++ b/src/ClientApp/src/app/presentation/components/admin-dashboard/admin-dashboard.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+import {RouterLink} from "@angular/router";
+
+@Component({
+  selector: 'app-admin-dashboard',
+  imports: [
+    RouterLink
+  ],
+  templateUrl: './admin-dashboard.component.html',
+  styleUrl: './admin-dashboard.component.scss',
+  standalone: true
+})
+export class AdminDashboardComponent {
+
+}
--- a/src/ClientApp/src/app/presentation/components/header/header.component.html
+++ b/src/ClientApp/src/app/presentation/components/header/header.component.html
@@ -1,28 +1,11 @@
 <nav class="navbar navbar-expand-lg border-bottom position-relative bg-body-tertiary">
  <div class="container-fluid">
-    @if (showOverviewTools){
-      <div class="sidebar-toggle p-2 me-1 text-secondary" data-bs-target="#offcanvasExample" data-bs-toggle="offcanvas"
-           type="button">
-        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-list"
-             viewBox="0 0 16 16">
-          <path fill-rule="evenodd"
-                d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5"/>
-        </svg>
-      </div>
-    }
    <a class="navbar-brand" [routerLink]="['/#']" title="Refresh" data-bs-target="#offcanvasExample" data-bs-dismiss="offcanvas">
      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-app" viewBox="0 0 16 16">
        <path d="M11 2a3 3 0 0 1 3 3v6a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3zM5 1a4 4 0 0 0-4 4v6a4 4 0 0 0 4 4h6a4 4 0 0 0 4-4V5a4 4 0 0 0-4-4z"/>
      </svg>
-
    </a>
-    <button aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"
-      class="navbar-toggler"
-      data-bs-target="#navbarSupportedContent" data-bs-toggle="collapse" type="button">
-      <span class="navbar-toggler-icon"></span>
-    </button>
-
-  </div>
+ </div>
 <!-- Dropdown -->
  @if (!showDropdown){
    <ul class="navbar-nav ms-auto" data-bs-target="#offcanvasExample" data-bs-dismiss="offcanvas">
--- a/src/ClientApp/src/app/presentation/components/header/header.component.ts
+++ b/src/ClientApp/src/app/presentation/components/header/header.component.ts
@@ -1,7 +1,6 @@
-import {Component, inject, OnInit, viewChild} from '@angular/core';
+import {Component, inject, OnInit} from '@angular/core';
 import {DarkModeService} from '../../../infrastructure/services/dark-mode.service';
-import {FormsModule, NgForm} from "@angular/forms";
-import {ToastService} from "../../../infrastructure/services/toast.service";
+import {FormsModule} from "@angular/forms";
 import {ActivatedRoute, NavigationEnd, Router, RouterLink} from "@angular/router";
 import {AuthService} from "../../../infrastructure/services/auth-service";
 import {UserStoreService} from "../../../infrastructure/services/user-store.service";
@@ -19,7 +18,6 @@ import {filter} from "rxjs/operators";
 })
 export class HeaderComponent implements OnInit {

-  toastService = inject(ToastService);
  darkModeService = inject(DarkModeService);
  userStore = inject(UserStoreService);

@@ -50,9 +48,9 @@ export class HeaderComponent implements OnInit {
        while (route.firstChild) route = route.firstChild;

        // Header-Logic
-        const headerRoutes = ['/login', '/register', '/legal' , '/start'];
-        this.showDropdown = headerRoutes.some(route => event.urlAfterRedirects.startsWith(route));
-        this.showOverviewTools = event.urlAfterRedirects.startsWith('/rss-feed-overview');
+        // TODO hide dropdown for login register and legal
+        const headerRoutes = ['/login', '/register', '/legal', '/startpage'];
+        this.showDropdown = headerRoutes.some(route => event.urlAfterRedirects.startsWith(route))
      });
  }

--- a/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.html
+++ b/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.html
@@ -0,0 +1 @@
+<p>unauthorized works!</p>
--- a/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.scss
+++ b/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.scss
--- a/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.spec.ts
+++ b/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UnauthorizedComponent } from './unauthorized.component';
+
+describe('UnauthorizedComponent', () => {
+  let component: UnauthorizedComponent;
+  let fixture: ComponentFixture<UnauthorizedComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [UnauthorizedComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(UnauthorizedComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.ts
+++ b/src/ClientApp/src/app/presentation/components/unauthorized/unauthorized.component.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-unauthorized',
+  imports: [],
+  templateUrl: './unauthorized.component.html',
+  styleUrl: './unauthorized.component.scss',
+})
+export class UnauthorizedComponent {
+
+}
--- a/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.html
+++ b/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.html
@@ -0,0 +1,73 @@
+<div class="container-fluid">
+  <div class="align-items-center justify-content-center mt-3 d-flex">
+    <div class="container">
+      <div class="row justify-content-center ">
+        <div class="col-lg-3">
+          <div class="card mb-3">
+            <div class="card-body text-center">
+              <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="150" height="150" class="bi bi-person-fill bg-primary rounded-circle" viewBox="0 0 16 16">
+                <path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6"/>
+              </svg>
+              <h4 class="my-3">{{username}}</h4>
+              <!--              <button class="btn btn-primary">Update Picture</button>-->
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-8">
+          <div class="row mb-2">
+            <div class="col-md-6">
+              <div class="card mb-3">
+                <div class="card-header text-center">
+                  <h2 class="mb-4">Personal Data</h2>
+                </div>
+                <div class="card-body">
+                  <p class="mb-1"><strong>Username:</strong> <br> {{username}}</p> <br>
+                  <p class="mb-1"><strong>E-Mail:</strong> <br>{{email}}</p>
+                </div>
+              </div>
+            </div>
+            <!--            <div class="col-md-6">-->
+            <!--              <div class="card mb-3" style="height: 92%">-->
+            <!--                <div class="card-header text-center">-->
+            <!--                  <h2 class="mb-4">Payment Method</h2>-->
+            <!--                </div>-->
+            <!--                <div class="card-body">-->
+            <!--                  <p class="mb-1"></p>-->
+            <!--                </div>-->
+            <!--              </div>-->
+            <!--            </div>-->
+          </div>
+          <a class="text-decoration-none">
+            <div class="row">
+              <div class="col-md-6">
+                <!--                <div class="card mb-3">-->
+                <!--                  <div class="card-header text-center">-->
+                <!--                    <h4 class="my-3">Change password</h4>-->
+                <!--                  </div>-->
+                <!--                  <div class="card-body d-flex flex-wrap">-->
+                <!--                   <input type="password" class="form-control mt-2" placeholder="Enter new password">-->
+                <!--                    <input type="password" class="form-control mt-2" placeholder="Repeat new password">-->
+                <!--                    <button class="btn btn-primary mt-4">Change password</button>-->
+                <!--                  </div>-->
+                <!--                </div>-->
+              </div>
+              <div class="col-md-6">
+                <!--                <div class="card mb-3">-->
+                <!--                  <div class="card-header text-center">-->
+                <!--                    <h4 class="my-3">Change E-Mail</h4>-->
+                <!--                  </div>-->
+                <!--                  <div class="card-body d-flex flex-wrap">-->
+                <!--                    <input type="password" class="form-control mt-2" placeholder="Enter new E-Mail">-->
+                <!--                    <input type="password" class="form-control mt-2" placeholder="Repeat new E-Mail">-->
+                <!--                    <button class="btn btn-primary mt-4">Change E-Mail</button>-->
+                <!--                  </div>-->
+                <!--                </div>-->
+              </div>
+            </div>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
--- a/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.scss
+++ b/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.scss
--- a/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.spec.ts
+++ b/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserDashboardComponent } from './user-dashboard.component';
+
+describe('UserDashboardComponent', () => {
+  let component: UserDashboardComponent;
+  let fixture: ComponentFixture<UserDashboardComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [UserDashboardComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(UserDashboardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.ts
+++ b/src/ClientApp/src/app/presentation/components/user-dashboard/user-dashboard.component.ts
@@ -0,0 +1,38 @@
+import {Component, inject} from '@angular/core';
+import {Title} from "@angular/platform-browser";
+import {UserStoreService} from "../../../infrastructure/services/user-store.service";
+import {AuthService} from "../../../infrastructure/services/auth-service";
+
+@Component({
+  selector: 'app-user-dashboard',
+  imports: [],
+  templateUrl: './user-dashboard.component.html',
+  styleUrl: './user-dashboard.component.scss',
+})
+export class UserDashboardComponent {
+  public username!: string;
+  public email!: string;
+  public userId!: number;
+  userStore = inject(UserStoreService);
+  private authenticateService = inject(AuthService);
+  title = inject(Title)
+
+  constructor() {
+    //TODO App Name
+    this.title.setTitle('User Dashboard | App Name');
+  }
+  ngOnInit(): void {
+    this.userStore.getUsernameFromStore()
+      .subscribe(val => {
+        const usernameFromToken = this.authenticateService.getUsernameFromToken();
+        this.username = val || usernameFromToken
+      });
+
+    this.userStore.getEmailFromStore()
+      .subscribe(val => {
+        const emailFromToken = this.authenticateService.getEmailFromToken();
+        this.email = val || emailFromToken
+      });
+
+  }
+}
--- a/src/ClientApp/src/app/presentation/components/user-table/user-table.component.html
+++ b/src/ClientApp/src/app/presentation/components/user-table/user-table.component.html
@@ -0,0 +1,98 @@
+<div class="container-fluid p-4">
+  <div class="card">
+    <div class="card-header bg-primary text-center text-dark"><h4>User-List</h4></div>
+    <div class="card-body p-0">
+      <table class="table table-striped table-hover table-bordered table-sm mb-0">
+        <thead>
+        <tr class="text-center">
+          <th>#</th>
+          <th (click)="sort('username')" class="sortable">
+            Username
+            <i class="bi"
+               [ngClass]="{
+       'bi bi-arrow-up': sortColumn === 'username' && sortDirection === 'asc',
+       'bi bi-arrow-down': sortColumn === 'username' && sortDirection === 'desc',
+       'bi bi-arrow-down-up': sortColumn !== 'username'
+     }"></i>
+          </th>
+          <th (click)="sort('email')" class="sortable">
+            E-Mail
+            <i class="bi"
+               [ngClass]="{
+       'bi bi-arrow-up': sortColumn === 'email' && sortDirection === 'asc',
+       'bi bi-arrow-down': sortColumn === 'email' && sortDirection === 'desc',
+       'bi bi-arrow-down-up': sortColumn !== 'email'
+     }"></i>
+          </th>
+          <th (click)="sort('lastLogin')" class="sortable">
+            Last Login
+            <i class="bi"
+               [ngClass]="{
+       'bi bi-arrow-up': sortColumn === 'lastLogin' && sortDirection === 'asc',
+       'bi bi-arrow-down': sortColumn === 'lastLogin' && sortDirection === 'desc',
+       'bi bi-arrow-down-up': sortColumn !== 'lastLogin'
+     }"></i>
+          </th>
+          <th>Action</th>
+
+        </tr>
+        </thead>
+        <tbody class="table-group-divider">
+          @for (user of users; track user.id; let i = $index;) {
+            <tr>
+              <td class="text-center">{{ i + 1 }}</td>
+              <td>{{ user.username }}</td>
+              <td>{{ user.email }}</td>
+              <td class="text-center">{{ user.lastLogin | date:'dd.MM.yyyy HH:mm:ss':'Europe/Berlin' }}</td>
+              <td class="d-flex justify-content-center">
+                <button (click)="selectUser(user)" class="btn btn-sm btn-danger"
+                        data-bs-target="#warningModal"
+                        data-bs-toggle="modal"
+                ><i class="bi bi-trash3-fill"></i></button>
+              </td>
+            </tr>
+          }
+        </tbody>
+      </table>
+    </div>
+    <!-- Pagination Buttons Bootstrap -->
+    <nav aria-label="Page navigation">
+      <ul class="pagination justify-content-center mt-3">
+
+        <!-- Previous Button -->
+        <li class="page-item me-1" [class.disabled]="pageNumber === 1">
+          <a class="btn btn-primary" (click)="previousPage()" href="javascript:void(0)" aria-label="Previous">
+            <span aria-hidden="true">&laquo;</span>
+          </a>
+        </li>
+        <!-- Dynamic Page Buttons -->
+        @for (Page of [].constructor(totalPages); track Page ;let i = $index;) {
+          <li class="page-item me-1">
+            <a class="btn btn-outline-primary" href="javascript:void(0)" (click)="goToPage(i + 1)">
+              {{ i + 1 }}
+            </a>
+          </li>
+        }
+
+        <!-- Next Button -->
+        <li class="page-item me-1" [class.disabled]="pageNumber === totalPages">
+          <a class="btn btn-primary" (click)="nextPage()" href="javascript:void(0)" aria-label="Next">
+            <span aria-hidden="true">&raquo;</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
+
+    <div class="d-flex justify-content-center align-items-center mb-3">
+      <span>Page {{ pageNumber }} of {{ totalPages }}</span>
+    </div>
+  </div>
+</div>
+<app-popup-modal
+  [title]="'Warning'"
+  [headerClass]="'bg-warning text-dark'"
+  (confirm)="handleConfirm()">
+  <p>
+    Do you really want to delete
+    <strong class="text-danger">{{ selectedUser?.username }}</strong> ?
+  </p></app-popup-modal>
--- a/src/ClientApp/src/app/presentation/components/user-table/user-table.component.scss
+++ b/src/ClientApp/src/app/presentation/components/user-table/user-table.component.scss
--- a/src/ClientApp/src/app/presentation/components/user-table/user-table.component.spec.ts
+++ b/src/ClientApp/src/app/presentation/components/user-table/user-table.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserTableComponent } from './user-table.component';
+
+describe('UserTableComponent', () => {
+  let component: UserTableComponent;
+  let fixture: ComponentFixture<UserTableComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [UserTableComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(UserTableComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/components/user-table/user-table.component.ts
+++ b/src/ClientApp/src/app/presentation/components/user-table/user-table.component.ts
@@ -0,0 +1,120 @@
+import {Component, inject} from '@angular/core';
+import {User} from "../../../domain/entities/user";
+import {UserService} from "../../../infrastructure/services/user.service";
+import {ToastService} from "../../../infrastructure/services/toast.service";
+import {Title} from "@angular/platform-browser";
+import {PopupModalComponent} from "../../shared/popup-modal/popup-modal.component";
+import {DatePipe, NgClass} from "@angular/common";
+
+@Component({
+  selector: 'app-user-table',
+  imports: [
+    PopupModalComponent,
+    DatePipe,
+    NgClass
+  ],
+  templateUrl: './user-table.component.html',
+  styleUrl: './user-table.component.scss',
+  standalone: true
+})
+export class UserTableComponent {
+  public users: User[] = [];
+  selectedUser: User | null = null;
+
+  pageNumber: number = 1;
+  pageSize: number = 10;
+  totalPages: number = 0;
+
+  sortColumn: string = '';
+  sortDirection: 'asc' | 'desc' = 'asc';
+
+  private apiService = inject(UserService)
+  toastService = inject(ToastService);
+  title = inject(Title)
+
+  constructor() {
+    this.title.setTitle('User Table | RSS Feed Reader');
+  }
+
+  ngOnInit(): void {
+    this.getAllUsers()
+  }
+  getAllUsers(): void {
+    this.apiService.getAllUsers(this.pageNumber, this.pageSize).subscribe(result => {
+      this.users = result.value.items;
+      this.totalPages = result.value.totalPages;
+      this.sort(this.sortColumn);
+    });
+  }
+  nextPage(): void {
+    if (this.pageNumber < this.totalPages) {
+      this.pageNumber++;
+      this.getAllUsers();
+    }
+  }
+
+  previousPage(): void {
+    if (this.pageNumber > 1) {
+      this.pageNumber--;
+      this.getAllUsers();
+    }
+  }
+  goToPage(page: number): void {
+    if (page >= 1 && page <= this.totalPages) {
+      this.pageNumber = page;
+      this.getAllUsers();
+    }
+  }
+  // Sortiermethode
+  sort(column: string): void {
+    if (this.sortColumn === column) {
+      // Wenn die Spalte bereits sortiert ist, wechsle die Richtung
+      this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';
+    } else {
+      // Andernfalls aufsteigend sortieren
+      this.sortDirection = 'asc';
+      this.sortColumn = column;
+    }
+
+    // Sortiere die Tabelle basierend auf Spalte und Richtung
+    this.users.sort((a: any, b: any) => {
+      const valueA = a[column];
+      const valueB = b[column];
+      if (valueA < valueB) {
+        return this.sortDirection === 'asc' ? -1 : 1;
+      }
+      if (valueA > valueB) {
+        return this.sortDirection === 'asc' ? 1 : -1;
+      }
+      return 0;
+    });
+  }
+
+  deleteUser(id: number): void {
+    this.apiService.deleteUser(id).subscribe({
+      next: (result) => {
+        console.log('delete',result);
+        this.toastService.show(result.value, {
+          classname: 'bg-success text-light',
+          delay: 3000
+        })
+        this.users = this.users.filter(user => user.id !== id);
+      },
+      error: (err) => {
+        console.error(err.error.error.message);
+        this.toastService.show(err.error.error.message, {
+          classname: 'bg-danger text-light',
+          delay: 3000
+        });
+      }
+    });
+  }
+
+  selectUser(user: User): void {
+    this.selectedUser = user;
+    console.log('selectedUser', user);
+  }
+  handleConfirm() {
+    this.deleteUser(this.selectedUser!.id);
+  }
+}
--- a/src/ClientApp/src/app/presentation/guards/admin.guard.spec.ts
+++ b/src/ClientApp/src/app/presentation/guards/admin.guard.spec.ts
@@ -0,0 +1,17 @@
+import {TestBed} from '@angular/core/testing';
+import {CanActivateFn} from '@angular/router';
+
+import {adminGuard} from './admin.guard';
+
+describe('adminGuard', () => {
+  const executeGuard: CanActivateFn = (...guardParameters) =>
+    TestBed.runInInjectionContext(() => adminGuard(...guardParameters));
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+  });
+
+  it('should be created', () => {
+    expect(executeGuard).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/guards/admin.guard.ts
+++ b/src/ClientApp/src/app/presentation/guards/admin.guard.ts
@@ -0,0 +1,43 @@
+import {CanActivateFn, Router} from '@angular/router';
+import {inject} from "@angular/core";
+import {AuthService} from "../../infrastructure/services/auth-service";
+import {ToastService} from "../../infrastructure/services/toast.service";
+import {UserStoreService} from "../../infrastructure/services/user-store.service";
+import {catchError, map} from 'rxjs/operators';
+import {of} from 'rxjs';
+
+export const adminGuard: CanActivateFn = (route, state) => {
+
+
+  const userStore = inject(UserStoreService);
+  const authenticateService = inject(AuthService);
+  const toastService = inject(ToastService);
+  const router = inject(Router);
+
+  return userStore.getRoleFromStore().pipe(
+    map(val => {
+      const roleFromToken = authenticateService.getRoleFromToken();
+      const role = val || roleFromToken;
+
+      if (role === "Admin" || role === "SuperAdmin") {
+        return true;
+      } else {
+        toastService.show("Access denied. Admins only.", {
+          classname: 'bg-warning text-dark',
+          delay: 3000
+        });
+        void router.navigate(['/unauthorized']);
+        return false;
+      }
+    }),
+    catchError(() => {
+      toastService.show("An error occurred. Please try again later.", {
+        classname: 'bg-danger text-light',
+        delay: 2000
+      });
+      void router.navigate(['/login']);
+      return of(false);
+    })
+  );
+};
+
--- a/src/ClientApp/src/app/presentation/guards/authentication.guard.spec.ts
+++ b/src/ClientApp/src/app/presentation/guards/authentication.guard.spec.ts
@@ -0,0 +1,24 @@
+import {TestBed} from '@angular/core/testing';
+
+import {AuthenticationGuard} from './authentication.guard';
+import {provideHttpClient} from "@angular/common/http";
+import {ActivatedRoute} from "@angular/router";
+import {of} from "rxjs";
+
+describe('AuthenticationGuard', () => {
+  let guard: AuthenticationGuard;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      providers: [provideHttpClient(),
+        { provide: ActivatedRoute, useValue: { data: of({}), firstChild: null } },
+      ]
+    });
+    guard = TestBed.inject(AuthenticationGuard);
+
+  });
+
+  it('should be created', () => {
+    expect(guard).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/guards/authentication.guard.ts
+++ b/src/ClientApp/src/app/presentation/guards/authentication.guard.ts
@@ -0,0 +1,29 @@
+import {inject, Injectable} from '@angular/core';
+import {CanActivate, Router} from '@angular/router';
+import {AuthService} from "../../infrastructure/services/auth-service";
+import {ToastService} from "../../infrastructure/services/toast.service";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class AuthenticationGuard implements CanActivate {
+  toastService = inject(ToastService);
+  private authenticateService = inject(AuthService)
+  private router = inject(Router)
+
+  canActivate(): boolean {
+    if (this.authenticateService.isLoggedIn()) {
+      return true;
+    } else {
+      this.toastService.show("Please Login first", {
+        classname: 'bg-warning text-dark',
+        delay: 2000
+      });
+      this.router.navigate(['/login']).catch(error => {
+        console.error('Navigation error:', error);
+      })
+      return false;
+    }
+  }
+
+}
--- a/src/ClientApp/src/app/presentation/guards/guest.guard.spec.ts
+++ b/src/ClientApp/src/app/presentation/guards/guest.guard.spec.ts
@@ -0,0 +1,17 @@
+import { TestBed } from '@angular/core/testing';
+import { CanActivateFn } from '@angular/router';
+
+import { guestGuard } from './guest.guard';
+
+describe('guestGuard', () => {
+  const executeGuard: CanActivateFn = (...guardParameters) => 
+      TestBed.runInInjectionContext(() => guestGuard(...guardParameters));
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+  });
+
+  it('should be created', () => {
+    expect(executeGuard).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/guards/guest.guard.ts
+++ b/src/ClientApp/src/app/presentation/guards/guest.guard.ts
@@ -0,0 +1,16 @@
+import {CanActivateFn, Router} from '@angular/router';
+import {inject} from "@angular/core";
+import {AuthService} from "../../infrastructure/services/auth-service";
+
+
+export const guestGuard: CanActivateFn = (route, state) => {
+  const authService = inject(AuthService);
+  const router = inject(Router);
+
+  if (!authService.isLoggedIn()){
+    return true;
+  }
+  // TODO rout
+  void router.navigate(['/user-dashboard']);
+  return false;
+};
--- a/src/ClientApp/src/app/presentation/interceptors/token.interceptor.spec.ts
+++ b/src/ClientApp/src/app/presentation/interceptors/token.interceptor.spec.ts
@@ -0,0 +1,17 @@
+import {TestBed} from '@angular/core/testing';
+import {HttpInterceptorFn} from '@angular/common/http';
+
+import {tokenInterceptor} from './token.interceptor';
+
+describe('tokenInterceptor', () => {
+  const interceptor: HttpInterceptorFn = (req, next) =>
+    TestBed.runInInjectionContext(() => tokenInterceptor(req, next));
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+  });
+
+  it('should be created', () => {
+    expect(interceptor).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/interceptors/token.interceptor.ts
+++ b/src/ClientApp/src/app/presentation/interceptors/token.interceptor.ts
@@ -0,0 +1,75 @@
+import {HttpErrorResponse, HttpEvent, HttpHandlerFn, HttpInterceptorFn, HttpRequest} from '@angular/common/http';
+import {inject} from "@angular/core";
+import {AuthService} from "../../infrastructure/services/auth-service";
+import {catchError, Observable, switchMap, throwError} from "rxjs";
+import {ToastService} from "../../infrastructure/services/toast.service";
+import {Router} from '@angular/router';
+import {RefreshTokenRequest} from "../models/refresh-token-request";
+
+export const tokenInterceptor: HttpInterceptorFn = (req, next) => {
+  const authService = inject(AuthService);
+  const token = authService.getToken();
+  const toastService = inject(ToastService);
+  const router = inject(Router);
+
+  if (token) {
+    req = req.clone({
+      setHeaders: {Authorization: `Bearer ${token}`}
+    });
+  }
+
+  return next(req).pipe(
+    catchError((err: any) => {
+      if (err instanceof HttpErrorResponse) {
+        if (err.status === 401) {
+          return handleUnAuthorizedError(req, next, authService, router, toastService);
+        }
+      }
+      console.log("interceptor error",err.error?.error?.message);
+      return throwError(() => err);
+
+    })
+  );
+};
+
+function handleUnAuthorizedError(
+  req: HttpRequest<any>,
+  next: HttpHandlerFn,
+  authenticateService: AuthService,
+  router: Router,
+  toastService: ToastService
+): Observable<HttpEvent<any>> {
+
+  const refreshTokenRequest = new RefreshTokenRequest();
+  refreshTokenRequest.refreshToken = authenticateService.getRefreshToken()!;
+  refreshTokenRequest.userId = authenticateService.getUserIdFromToken()!;
+
+  return authenticateService.renewToken(refreshTokenRequest).pipe(
+    switchMap((data) => {
+      const tokenResponse = data.value;
+      authenticateService.storeRefreshToken(tokenResponse.refreshToken);
+      authenticateService.storeToken(tokenResponse.accessToken);
+
+      req = req.clone({
+        setHeaders: {Authorization: `Bearer ${tokenResponse.accessToken}`}
+      });
+
+      return next(req);
+    }),
+    catchError((err) => {
+      return throwError(() => {
+        authenticateService.signOut();
+        router.navigate(['login']).then(success => {
+          if (success) {
+            toastService.show(err.error?.error?.message ||'Token is expired, login again!', {
+              classname: 'bg-warning text-light',
+              delay: 2000
+            });
+          }
+        })
+      });
+    })
+  );
+}
+
+
--- a/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.html
+++ b/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.html
@@ -0,0 +1,19 @@
+<div class="modal fade" id="warningModal" tabindex="-1" aria-labelledby="warningModalLabel" aria-hidden="true" data-bs-backdrop="static">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header" [ngClass]="headerClass">
+        <h1 class="modal-title fs-5 text-center w-100" id="warningModalLabel">{{ title }}</h1>
+      </div>
+      <div class="modal-body">
+        <ng-content></ng-content>
+        @if (body) {
+          <p>{{ body }}</p>
+        }
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-danger" data-bs-dismiss="modal">No</button>
+        <button type="button" class="btn btn-warning" (click)="onConfirm()" data-bs-dismiss="modal">Yes</button>
+      </div>
+    </div>
+  </div>
+</div>
--- a/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.scss
+++ b/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.scss
--- a/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.spec.ts
+++ b/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupModalComponent } from './popup-modal.component';
+
+describe('PopupModalComponent', () => {
+  let component: PopupModalComponent;
+  let fixture: ComponentFixture<PopupModalComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [PopupModalComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(PopupModalComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- a/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.ts
+++ b/src/ClientApp/src/app/presentation/shared/popup-modal/popup-modal.component.ts
@@ -0,0 +1,26 @@
+import {Component, EventEmitter, Input, Output} from '@angular/core';
+import {NgClass} from "@angular/common";
+
+@Component({
+  selector: 'app-popup-modal',
+  imports: [
+    NgClass
+  ],
+  templateUrl: './popup-modal.component.html',
+  styleUrl: './popup-modal.component.scss',
+  standalone: true
+})
+export class PopupModalComponent {
+
+
+  @Input() headerClass: string = 'bg-light';
+  @Input() title: string = '';
+  @Input() body: string = '';
+
+  @Output() confirm = new EventEmitter<void>();
+  @Output() cancel = new EventEmitter<void>();
+
+  onConfirm() {
+    this.confirm.emit();
+  }
+}
--- a/src/ClientApp/src/main.ts
+++ b/src/ClientApp/src/main.ts
@@ -1,6 +1,7 @@
 import { bootstrapApplication } from '@angular/platform-browser';
 import { appConfig } from './app/app.config';
 import { AppComponent } from './app/app.component';
+import 'bootstrap';

 bootstrapApplication(AppComponent, appConfig)
  .catch((err) => console.error(err));
Author	SHA1	Message	Date
Nathalie Eugler	d26b230f91	Merge pull request 'develop' (#14 ) from develop into main Reviewed-on: #14	2026-03-16 16:46:18 +00:00
Nathalie Eugler	710735f56d	Merge pull request 'add guards admin-dashboard and user-dashboard components' (#13 ) from feature/guards into develop Reviewed-on: #13	2026-03-16 16:44:14 +00:00
Nathalie Eugler	9452732730	add guards admin-dashboard and user-dashboard components	2026-03-16 17:43:26 +01:00
Nathalie Eugler	53190c2db0	Merge pull request 'fix dropdown' (#12 ) from feature/haeder into develop Reviewed-on: #12	2026-03-15 19:02:16 +00:00
Nathalie Eugler	a9f29fff6e	fix dropdown	2026-03-15 20:01:51 +01:00
Nathalie Eugler	ee46cf09f4	Merge pull request 'update Angular core to new version' (#11 ) from feature/angular into develop Reviewed-on: #11	2026-03-15 18:11:18 +00:00
Nathalie Eugler	d853ac7486	update Angular core to new version	2026-03-15 19:10:57 +01:00
Nathalie Eugler	06675219e0	Merge pull request 'update angular cli to new Version' (#10 ) from feature/nuget into develop Reviewed-on: #10	2026-03-15 18:07:15 +00:00