refactor(admin/profile): move Create Account action from profile page to admin dashboard header

Author: Diogo-Ferraz

src/app/features/admin/components/admin-dashboard/admin-dashboard.component.html

@@ -12,6 +12,18 @@ <h2>Admin Dashboard</h2>
           <span class="meta-pill" *ngIf="previewDetail">{{ previewDetail }}</span>
         </div>
       </div>
+
+      <div class="admin-header__actions">
+        <button
+          *ngIf="canCreateAccount"
+          pButton
+          type="button"
+          label="Create Account"
+          icon="pi pi-user-plus"
+          class="p-button-outlined"
+          (click)="createAccount()">
+        </button>
+      </div>
     </div>
   </p-card>
 

src/app/features/admin/components/admin-dashboard/admin-dashboard.component.scss

@@ -28,6 +28,13 @@
   gap: 0.45rem;
 }
 
+.admin-header__actions {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  flex-wrap: wrap;
+}
+
 .meta-pill {
   display: inline-flex;
   align-items: center;

src/app/features/admin/components/admin-dashboard/admin-dashboard.component.ts

@@ -99,6 +99,10 @@ export class AdminDashboardComponent implements OnInit {
     return this.users.filter((user) => user.roles.includes(AppRole.User)).length;
   }
 
+  get canCreateAccount(): boolean {
+    return this.authService.hasRole(AppRole.Administrator);
+  }
+
   ngOnInit(): void {
     this.rows = this.preferencesService.preferences().defaultTablePageSize;
     this.loadUsers();
@@ -195,6 +199,10 @@ export class AdminDashboardComponent implements OnInit {
       });
   }
 
+  createAccount(): void {
+    void this.authService.openRegisterPage();
+  }
+
   trackByUserId(index: number, user: UserSummaryDto): string {
     return user.id;
   }

src/app/features/profile/components/user-profile-security/user-profile-security.component.html

@@ -21,15 +21,6 @@ <h2>User Profile & Security</h2>
       </div>
 
       <div class="profile-header__actions">
-        <button
-          *ngIf="canCreateAccount()"
-          pButton
-          type="button"
-          label="Create Account"
-          icon="pi pi-user-plus"
-          class="p-button-outlined"
-          (click)="register()">
-        </button>
         <button pButton type="button" label="Logout" icon="pi pi-sign-out" class="p-button-outlined" (click)="logout()"></button>
       </div>
     </div>

src/app/features/profile/components/user-profile-security/user-profile-security.component.ts

@@ -24,7 +24,6 @@ export class UserProfileSecurityComponent {
   readonly claims = computed(() => this.authService.userClaims());
   readonly roles = computed(() => this.authService.userRoles());
   readonly currentUserId = computed(() => this.authService.currentUserId());
-  readonly canCreateAccount = computed(() => this.authService.hasRole(AppRole.Administrator));
 
   readonly userDisplayName = computed(() => {
     const claims = this.claims();
@@ -121,10 +120,6 @@ export class UserProfileSecurityComponent {
     this.authService.logout();
   }
 
-  register(): void {
-    void this.authService.openRegisterPage();
-  }
-
   private serializeClaimValue(value: unknown): string {
     if (Array.isArray(value)) {
       return value.map((item) => String(item)).join(', ');