diff --git a/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts b/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts
index 196791e90..ec82eb9d5 100644
--- a/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts
+++ b/apps/red-ui/src/app/modules/admin/dialogs/add-edit-user-dialog/user-details/user-details.component.ts
@@ -1,7 +1,7 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnDestroy, Output } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { AdminDialogService } from '../../../services/admin-dialog.service';
-import { IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui';
+import { AutoUnsubscribe, IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui';
 import { rolesTranslations } from '../../../../../translations/roles-translations';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 import { User } from '@red/domain';
@@ -13,7 +13,7 @@ import { HttpStatusCode } from '@angular/common/http';
     templateUrl: './user-details.component.html',
     styleUrls: ['./user-details.component.scss'],
 })
-export class UserDetailsComponent {
+export class UserDetailsComponent extends AutoUnsubscribe implements OnChanges, OnDestroy {
     readonly iconButtonTypes = IconButtonTypes;
 
     @Input() user: User;
@@ -22,8 +22,8 @@ export class UserDetailsComponent {
 
     readonly ROLES = ['RED_USER', 'RED_MANAGER', 'RED_USER_ADMIN', 'RED_ADMIN'];
     readonly translations = rolesTranslations;
+    form: FormGroup;
     private readonly _ROLE_REQUIREMENTS = { RED_MANAGER: 'RED_USER', RED_ADMIN: 'RED_USER_ADMIN' };
-    readonly form: FormGroup = this._getForm();
 
     constructor(
         private readonly _formBuilder: FormBuilder,
@@ -32,7 +32,7 @@ export class UserDetailsComponent {
         private readonly _loadingService: LoadingService,
         readonly userService: UserService,
     ) {
-        this._setRolesRequirements();
+        super();
     }
 
     get changed(): boolean {
@@ -67,36 +67,6 @@ export class UserDetailsComponent {
         }, []);
     }
 
-    shouldBeDisabled(role: string): boolean {
-        if (!this.user) {
-            return false;
-        }
-
-        const isCurrentAdminUser = this.user.isAdmin && this.user.id === this.userService.currentUser.id;
-        return (
-            (role === 'RED_ADMIN' && isCurrentAdminUser) ||
-            Object.keys(this._ROLE_REQUIREMENTS).reduce(
-                (value, key) => value || (role === this._ROLE_REQUIREMENTS[key] && this.user.roles.includes(key)),
-                false,
-            )
-        );
-    }
-
-    private _getForm(): FormGroup {
-        return this._formBuilder.group({
-            firstName: [this.user?.firstName, Validators.required],
-            lastName: [this.user?.lastName, Validators.required],
-            email: [
-                {
-                    value: this.user?.email,
-                    disabled: !!this.user,
-                },
-                [Validators.required, Validators.email],
-            ],
-            ...this._rolesControls,
-        });
-    }
-
     private get _rolesControls(): any {
         return this.ROLES.reduce(
             (prev, role) => ({
@@ -112,6 +82,26 @@ export class UserDetailsComponent {
         );
     }
 
+    ngOnChanges() {
+        this.form = this._getForm();
+        this._setRolesRequirements();
+    }
+
+    shouldBeDisabled(role: string): boolean {
+        if (!this.user) {
+            return false;
+        }
+
+        const isCurrentAdminUser = this.user.isAdmin && this.user.id === this.userService.currentUser.id;
+        return (
+            (role === 'RED_ADMIN' && isCurrentAdminUser) ||
+            Object.keys(this._ROLE_REQUIREMENTS).reduce(
+                (value, key) => value || (role === this._ROLE_REQUIREMENTS[key] && this.user.roles.includes(key)),
+                false,
+            )
+        );
+    }
+
     async save() {
         this._loadingService.start();
         const userData = { ...this.form.getRawValue(), roles: this.activeRoles };
@@ -143,9 +133,24 @@ export class UserDetailsComponent {
         });
     }
 
+    private _getForm(): FormGroup {
+        return this._formBuilder.group({
+            firstName: [this.user?.firstName, Validators.required],
+            lastName: [this.user?.lastName, Validators.required],
+            email: [
+                {
+                    value: this.user?.email,
+                    disabled: !!this.user,
+                },
+                [Validators.required, Validators.email],
+            ],
+            ...this._rolesControls,
+        });
+    }
+
     private _setRolesRequirements() {
         for (const key of Object.keys(this._ROLE_REQUIREMENTS)) {
-            this.form.controls[key].valueChanges.subscribe(checked => {
+            this.addSubscription = this.form.controls[key].valueChanges.subscribe(checked => {
                 if (checked) {
                     this.form.patchValue({ [this._ROLE_REQUIREMENTS[key]]: true });
                     this.form.controls[this._ROLE_REQUIREMENTS[key]].disable();