diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/common/color-mode-bttn/color-mode-bttn.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/common/color-mode-bttn/color-mode-bttn.component.ts
index 23bde67..c29d618 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/common/color-mode-bttn/color-mode-bttn.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/common/color-mode-bttn/color-mode-bttn.component.ts
@@ -1,13 +1,16 @@
 import { Component, OnInit } from '@angular/core';
-import { ColorModeService, GetLocalTheme, Theme } from 'src/app/services/color-mode.service';
+import { ColorModeService, GetLocalTheme, Theme } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common'
 
 @Component({
+  standalone: true,
+  imports: [CommonModule],
   selector: 'app-color-mode-bttn',
   templateUrl: './color-mode-bttn.component.html',
   styleUrl: './color-mode-bttn.component.css'
 })
 export class ColorModeBttnComponent implements OnInit {
-  constructor(private cModeService: ColorModeService) { 
+  constructor(private cModeService: ColorModeService) {
     this.theme = GetLocalTheme();
   }
 
@@ -17,10 +20,10 @@ export class ColorModeBttnComponent implements OnInit {
 
   readonly Themes = Theme;
 
-  theme : Theme;
+  theme: Theme;
   onClick(theme: Theme) {
     this.theme = theme;
-    let theTheme:Theme = theme;
+    let theTheme: Theme = theme;
     this.cModeService.setTheme(theTheme);
   }
 }
\ No newline at end of file
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group-dir-import/group-dir-import.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group-dir-import/group-dir-import.component.ts
index 9c218ea..0c01d27 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group-dir-import/group-dir-import.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group-dir-import/group-dir-import.component.ts
@@ -9,6 +9,7 @@ import { DirGroup } from '../../models/user-management.api.models';
 
 @Component({
   standalone: true,
+  imports: [DirGroupTableComponent],
   selector: 'app-group-dir-import',
   templateUrl: './group-dir-import.component.html',
   styleUrl: './group-dir-import.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group/group.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group/group.component.ts
index 50a2a5c..6ba3fd1 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group/group.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/group/group.component.ts
@@ -1,7 +1,9 @@
 import { Component } from '@angular/core';
+import { GroupTableComponent } from '../../components/tables/group-table/group-table.component';
 
 @Component({
   standalone: true,
+  imports: [GroupTableComponent],
   selector: 'app-group',
   templateUrl: './group.component.html',
   styleUrl: './group.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/module/module.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/module/module.component.ts
index 3bf52fb..bbc37d9 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/module/module.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/module/module.component.ts
@@ -1,7 +1,9 @@
 import { Component } from '@angular/core';
+import { ModuleTableComponent } from '../../components/tables/module-table/module-table.component';
 
 @Component({
   standalone: true,
+  imports: [ModuleTableComponent],
   selector: 'app-module',
   templateUrl: './module.component.html',
   styleUrl: './module.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/base-table/base-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/base-table/base-table.component.ts
index d58d10b..e5eebfe 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/base-table/base-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/base-table/base-table.component.ts
@@ -1,11 +1,14 @@
-import { AfterViewInit, Component, Inject, Input, OnDestroy, OnInit, ViewChild, input } from '@angular/core';
+import { Component, Inject, Input, OnDestroy, OnInit, ViewChild, input } from '@angular/core';
 import { ApiService } from '../../../services/user-management.api.service';
-import { GuiColumn, GuiColumnMenu, GuiSorting, GuiRowDetail, GuiPaging, GuiPagingDisplay, GuiSearching, GuiCellEdit, GuiInfoPanel, GuiTitlePanel, GuiRowSelection, GuiSelectedRow, GuiGridComponent, GuiGridApi, GuiTheme } from '@generic-ui/ngx-grid';
+import { GuiGridModule, GuiColumn, GuiColumnMenu, GuiSorting, GuiRowDetail, GuiPaging, GuiPagingDisplay, GuiSearching, GuiCellEdit, GuiInfoPanel, GuiTitlePanel, GuiRowSelection, GuiSelectedRow, GuiGridComponent, GuiGridApi, GuiTheme } from '@generic-ui/ngx-grid';
 import { Subscription } from 'rxjs/internal/Subscription';
 import { ColorModeService, Theme } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule ],
   selector: 'app-base-table',
   templateUrl: './base-table.component.html',
   styleUrl: './base-table.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-group-table/dir-group-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-group-table/dir-group-table.component.ts
index f427f71..82096b0 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-group-table/dir-group-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-group-table/dir-group-table.component.ts
@@ -2,11 +2,14 @@ import { Component, Inject } from '@angular/core';
 import { BaseTableComponent } from '../base-table/base-table.component';
 import { DirGroupService } from '../../../services/dir-group.service';
 import { DirGroup } from '../../../models/user-management.api.models';
-import { GuiColumn } from '@generic-ui/ngx-grid';
+import { GuiColumn, GuiGridModule } from '@generic-ui/ngx-grid';
 import { ColorModeService } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule ],
   selector: 'app-dir-group-table',
   templateUrl: '../base-table/base-table.component.html',
   styleUrl: './dir-group-table.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-user-table/dir-user-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-user-table/dir-user-table.component.ts
index dc78d40..ecc2846 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-user-table/dir-user-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/dir-user-table/dir-user-table.component.ts
@@ -2,11 +2,14 @@ import { Component, Inject } from '@angular/core';
 import { DirUser } from '../../../models/user-management.api.models';
 import { DirUserService } from '../../../services/dir-user.service';
 import { BaseTableComponent } from '../base-table/base-table.component';
-import { GuiColumn } from '@generic-ui/ngx-grid/gui/grid/src/core/api/gui.grid.public-api';
+import { GuiGridModule, GuiColumn } from '@generic-ui/ngx-grid';
 import { ColorModeService } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule],
   selector: 'app-dir-user-table',
   templateUrl: '../base-table/base-table.component.html',
   styleUrl: './dir-user-table.component.css'
@@ -22,7 +25,7 @@ export class DirUserTableComponent extends BaseTableComponent<DirUser, DirUserSe
         this.source = response;
         this.loading = false;
       },
-      error: (error: any) => {}
+      error: (error: any) => { }
     })
   }
 }
\ No newline at end of file
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/group-table/group-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/group-table/group-table.component.ts
index b0130de..5b40c96 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/group-table/group-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/group-table/group-table.component.ts
@@ -1,12 +1,15 @@
 import { Component, Inject } from '@angular/core';
 import { GroupService } from '../../../services/group.service';
 import { Group } from '../../../models/user-management.api.models';
-import { GuiColumn } from '@generic-ui/ngx-grid';
+import { GuiGridModule, GuiColumn } from '@generic-ui/ngx-grid';
 import { BaseTableComponent } from '../base-table/base-table.component';
 import { ColorModeService } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule],
   selector: 'app-group-table',
   templateUrl: '../base-table/base-table.component.html',
   styleUrl: './group-table.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/module-table/module-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/module-table/module-table.component.ts
index e692fe0..ac90ae4 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/module-table/module-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/module-table/module-table.component.ts
@@ -1,12 +1,15 @@
 import { Component, Inject } from '@angular/core';
 import { Module } from '../../../models/user-management.api.models';
-import { GuiColumn } from '@generic-ui/ngx-grid';
+import { GuiGridModule, GuiColumn } from '@generic-ui/ngx-grid';
 import { BaseTableComponent } from '../base-table/base-table.component';
 import { ModuleService } from '../../../services/module.service'
 import { ColorModeService } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule],
   selector: 'app-module-table',
   templateUrl: '../base-table/base-table.component.html',
   styleUrl: './module-table.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts
index d202895..da724b9 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts
@@ -2,11 +2,14 @@ import { Component, Inject } from '@angular/core';
 import { UserRep } from '../../../models/user-management.api.models';
 import { UserRepService } from '../../../services/user-representation.service';
 import { BaseTableComponent } from '../base-table/base-table.component';
-import { GuiColumn } from '@generic-ui/ngx-grid';
+import { GuiGridModule, GuiColumn } from '@generic-ui/ngx-grid';
 import { ColorModeService } from '../../../services/color-mode.service';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule],
   selector: 'app-user-rep-table',
   templateUrl: '../base-table/base-table.component.html',
   styleUrl: './user-rep-table.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-table/user-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-table/user-table.component.ts
index 94833dc..04c9e35 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-table/user-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-table/user-table.component.ts
@@ -3,12 +3,15 @@ import { UserService } from '../../../services/user.service';
 import { ModuleOfUserService } from '../../../services/module-of-user.service';
 import { GroupOfUserService } from '../../../services/group-of-user.service';
 import { User } from '../../../models/user-management.api.models';
-import { GuiColumn } from '@generic-ui/ngx-grid';
+import { GuiGridModule, GuiColumn } from '@generic-ui/ngx-grid';
 import { BaseTableComponent } from '../base-table/base-table.component';
 import { ColorModeService } from '../../../services/color-mode.service'
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule, GuiGridModule],
   selector: 'app-user-table',
   templateUrl: '../base-table/base-table.component.html',
   styleUrl: './user-table.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-assignment/user-assignment.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-assignment/user-assignment.component.ts
index 1e5b663..c6c36ea 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-assignment/user-assignment.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-assignment/user-assignment.component.ts
@@ -5,17 +5,18 @@ import { UserTableComponent } from '../tables/user-table/user-table.component';
 import { ModuleTableComponent } from '../tables/module-table/module-table.component';
 import { GroupTableComponent } from '../tables/group-table/group-table.component';
 import { User } from '../../models/user-management.api.models';
+import { MatTabsModule, MatTabGroup } from '@angular/material/tabs';
 
 @Component({
   standalone: true,
-  standalone: true,
+  imports: [MatTabsModule, MatTabGroup, UserTableComponent, ModuleTableComponent, GroupTableComponent],
   selector: 'app-user-assignment',
   templateUrl: './user-assignment.component.html',
   styleUrl: './user-assignment.component.scss'
 })
 export class UserAssignmentComponent implements OnInit, AfterViewInit {
 
-  initWithoutData = () => {}
+  initWithoutData = () => { }
 
   userInLabel: string = "Benutzer in"
 
@@ -29,7 +30,7 @@ export class UserAssignmentComponent implements OnInit, AfterViewInit {
       title: 'Groups'
     }
   ]
-  
+
   @Input() activeTabTitle: string | null = null;
   @Input() activeIndex: number = 0;
   @ViewChild("unassignedUsers") unassignedUsers!: UserTableComponent;
@@ -43,7 +44,7 @@ export class UserAssignmentComponent implements OnInit, AfterViewInit {
     mode: GuiRowSelectionMode.MULTIPLE
   }
 
-  ngOnInit(): void {}
+  ngOnInit(): void { }
 
   ngAfterViewInit(): void {
     //this.unassignedUsers.loading = false;
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-group-dir-import/user-group-dir-import.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-group-dir-import/user-group-dir-import.component.ts
index 8ea3d1a..4933eeb 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-group-dir-import/user-group-dir-import.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-group-dir-import/user-group-dir-import.component.ts
@@ -7,9 +7,11 @@ import { catchError, finalize } from 'rxjs/operators';
 import { DirGroupTableComponent } from '../tables/dir-group-table/dir-group-table.component';
 import { DirUserTableComponent } from '../tables/dir-user-table/dir-user-table.component';
 import { UserService } from '../../services/user.service';
-import {User} from '../../models/user-management.api.models'
+import { User } from '../../models/user-management.api.models'
 
 @Component({
+  standalone: true,
+  imports: [DirGroupTableComponent, DirUserTableComponent],
   selector: 'app-user-group-dir-import',
   templateUrl: './user-group-dir-import.component.html',
   styleUrl: './user-group-dir-import.component.css'
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-representation/user-representation.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-representation/user-representation.component.ts
index 2b281c0..8a4c0d7 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-representation/user-representation.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user-representation/user-representation.component.ts
@@ -5,9 +5,11 @@ import { UserRepTableComponent } from '../tables/user-rep-table/user-rep-table.c
 import { GroupTableComponent } from '../tables/group-table/group-table.component';
 import { UserRepService } from '../../services/user-representation.service';
 import Swal from 'sweetalert2';
+import { MatTabsModule, MatTabGroup } from '@angular/material/tabs';
 
 @Component({
   standalone: true,
+  imports: [MatTabsModule, MatTabGroup, UserTableComponent, GroupTableComponent, UserRepTableComponent],
   selector: 'app-user-representation',
   templateUrl: './user-representation.component.html',
   styleUrl: './user-representation.component.css'
@@ -57,21 +59,21 @@ export class UserRepresentationComponent {
 
   repUserOnSelectedRows = (rows: GuiSelectedRow[]) => {
     if (rows.length == 0 && this.slRepUserId) {
-      if(!this.slUserId){
+      if (!this.slUserId) {
         Swal.fire({
           icon: "error",
           title: "Oops...",
           text: "Bitte wählen Sie den Benutzer!",
         });
       }
-      else if(!this.slRepUserId){
+      else if (!this.slRepUserId) {
         Swal.fire({
           icon: "error",
           title: "Oops...",
           text: "Bitte wählen Sie die repräsentative Benutzer!",
         });
       }
-      else if(!this.slRightGroupId){
+      else if (!this.slRightGroupId) {
         Swal.fire({
           icon: "error",
           title: "Oops...",
@@ -89,7 +91,7 @@ export class UserRepresentationComponent {
           next: (response) => {
             this.slRepUserId = null;
             this.repUsers.safelyUnselectAll()
-            if(this.slUserId != null)
+            if (this.slUserId != null)
               this.userReps.fetchData(this.slUserId)
           },
           error: (error) => {
@@ -105,28 +107,28 @@ export class UserRepresentationComponent {
 
       this.slRepUserId = null;
     }
-    else if(rows.length > 0) {
+    else if (rows.length > 0) {
       this.slRepUserId = rows[0].source?.id;
     }
   }
 
   repGroupOnSelectedRows = (rows: GuiSelectedRow[]) => {
     if (rows.length == 0 && this.slRepGroupId) {
-      if(!this.slUserId){
+      if (!this.slUserId) {
         Swal.fire({
           icon: "error",
           title: "Oops...",
           text: "Bitte wählen Sie den Benutzer!",
         });
       }
-      else if(!this.slRepGroupId){
+      else if (!this.slRepGroupId) {
         Swal.fire({
           icon: "error",
           title: "Oops...",
           text: "Bitte wählen Sie die repräsentative Gruppe!",
         });
       }
-      else if(!this.slRightGroupId){
+      else if (!this.slRightGroupId) {
         Swal.fire({
           icon: "error",
           title: "Oops...",
@@ -144,7 +146,7 @@ export class UserRepresentationComponent {
           next: (res) => {
             this.slRepGroupId = null;
             this.repUsers.safelyUnselectAll()
-            if(this.slUserId != null)
+            if (this.slUserId != null)
               this.userReps.fetchData(this.slUserId)
           },
           error: (error) => {
@@ -160,7 +162,7 @@ export class UserRepresentationComponent {
 
       this.slRepGroupId = null;
     }
-    else if(rows.length > 0) {
+    else if (rows.length > 0) {
       this.slRepGroupId = rows[0].source?.id;
     }
   }
@@ -171,7 +173,7 @@ export class UserRepresentationComponent {
         next: (res) => {
           this.slUserRepId = null;
           this.userReps.safelyUnselectAll();
-          if(this.slUserId != null)
+          if (this.slUserId != null)
             this.userReps.fetchData(this.slUserId)
         },
         error: (err) => {
@@ -186,7 +188,7 @@ export class UserRepresentationComponent {
         }
       })
     }
-    else if(rows.length > 0) {
+    else if (rows.length > 0) {
       this.slUserRepId = rows[0].source?.id;
     }
   }
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.html b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.html
index 3fa5072..96f9d0b 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.html
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.html
@@ -1 +1 @@
-<app-user-table #userTable [cellEditing] = "cellEditing"></app-user-table>
\ No newline at end of file
+<app-user-table #userTable [cellEditing]="cellEditing"></app-user-table>
\ No newline at end of file
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.ts
index 16a171a..a1fc44f 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/user/user.component.ts
@@ -4,6 +4,7 @@ import { UserTableComponent } from '../tables/user-table/user-table.component';
 
 @Component({
   standalone: true,
+  imports: [UserTableComponent],
   selector: 'app-user',
   templateUrl: './user.component.html',
   styleUrl: './user.component.css'
@@ -22,5 +23,5 @@ export class UserComponent {
 
 
 
-  @ViewChild("userTable") userTable! : UserTableComponent
+  @ViewChild("userTable") userTable!: UserTableComponent
 }
\ No newline at end of file
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/login/login.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/login/login.component.ts
index 692a5c3..7c93e54 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/login/login.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/login/login.component.ts
@@ -2,9 +2,12 @@ import { Component, Inject, Input } from '@angular/core';
 import { AuthenticationService } from '../services/authentication.service';
 import Swal from 'sweetalert2';
 import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 @Component({
   standalone: true,
+  imports: [CommonModule, FormsModule],
   selector: 'app-login',
   templateUrl: './login.component.html',
   styleUrl: './login.component.css'
@@ -14,14 +17,14 @@ export class LoginComponent {
   username: string = '';
   password: string = '';
 
-  waitRes:boolean = false;
+  waitRes: boolean = false;
 
   IsPwdHidden: boolean = true;
-  
+
   constructor(private authService: AuthenticationService, @Inject(MAT_DIALOG_DATA) public data: any) {
-      //localStorage.getItem('theme') === 'dark'
-    if(typeof(this.afterLogin) == typeof(data.afterLogin))
-    this.afterLogin = data.afterLogin;
+    //localStorage.getItem('theme') === 'dark'
+    if (typeof (this.afterLogin) == typeof (data.afterLogin))
+      this.afterLogin = data.afterLogin;
   }
 
   @Input() afterLogin: () => void = () => { }
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/nav-menu/nav-menu.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/nav-menu/nav-menu.component.ts
index 11d6afc..76c8323 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/nav-menu/nav-menu.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/nav-menu/nav-menu.component.ts
@@ -4,19 +4,23 @@ import { UserGroupDirImportComponent } from '../components/user-group-dir-import
 import { GroupDirImportComponent } from '../components/group-dir-import/group-dir-import.component';
 import { AuthenticationService, IsLogedIn } from '../services/authentication.service';
 import { LoginComponent } from '../login/login.component';
+import { RouterModule } from '@angular/router';
+import { CommonModule } from '@angular/common';
+import { ColorModeBttnComponent } from '../components/common/color-mode-bttn/color-mode-bttn.component';
 
 @Component({
-  standalone:true,
+  standalone: true,
+  imports: [RouterModule, CommonModule, ColorModeBttnComponent],
   selector: 'app-nav-menu',
   templateUrl: './nav-menu.component.html',
   styleUrls: ['./nav-menu.component.css']
 })
 export class NavMenuComponent {
   isLogedIn() {
-    return IsLogedIn(); 
+    return IsLogedIn();
   }
   isExpanded = false;
-  
+
   constructor(public dialog: MatDialog, private authService: AuthenticationService) {
     this.authService.isAuthenticated().subscribe();
   }
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/index.html b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/index.html
index b3cc115..728feb4 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/index.html
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/index.html
@@ -2,8 +2,12 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>UserManagerUi</title>
+  <title>User Manager Portal</title>
   <base href="/">
+  <user-manager-api href="/api/" user-route="user" group-route="group" module-route="module"
+    module-of-user-route="moduleOfUser" group-of-user-route="groupOfUser" user-representation-route="userRep"
+    dir-group-route="directory/Group?propName=samaccountname" dir-user-route="directory/user" dir-route="directory"
+    login-route="auth/login" , logout-route="auth/logout" , login-check-route="auth/check" />
   <meta name="api-url" content="/api">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="icon" type="image/x-icon" href="favicon.ico">