update breadcrumb and create account module

src/app/domains/superAdmin/users/views/single.component.ts

@@ -1,9 +1,54 @@
-import { Component } from '@angular/core';
+import { BreadcrumbService } from '@/core/services';
+import { AppCardComponent, KeyValueComponent } from '@/shared/components';
+import { Component, computed, effect, inject, signal } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { UsersComponent } from '../components/accounts/list.component';
+import { UserAccountFormComponent } from '../components/form.component';
+import { usersNamedRoutes } from '../constants';
+import { UserStore } from '../store/user.store';
 
 @Component({
-  selector: 'app-user',
+  selector: 'superAdmin-user',
   templateUrl: './single.component.html',
+  imports: [AppCardComponent, KeyValueComponent, UserAccountFormComponent, UsersComponent],
 })
 export class UserComponent {
-  constructor() {}
+  private readonly store = inject(UserStore);
+  private readonly route = inject(ActivatedRoute);
+  private readonly breadcrumbService = inject(BreadcrumbService);
+
+  readonly userId = signal<string>(this.route.snapshot.paramMap.get('userId')!);
+  editMode = signal<boolean>(false);
+
+  readonly loading = computed(() => this.store.loading());
+  readonly user = computed(() => this.store.entity());
+
+  constructor() {
+    effect(() => {
+      if (this.user()?.id) {
+        this.setBreadcrumb();
+      }
+    });
+  }
+
+  async getData() {
+    await this.store.getData(this.userId());
+    this.setBreadcrumb();
+  }
+
+  ngOnInit() {
+    this.getData();
+  }
+
+  setBreadcrumb() {
+    this.breadcrumbService.setItems([
+      {
+        ...usersNamedRoutes.users.meta,
+        routerLink: usersNamedRoutes.users.meta.pagePath!(),
+      },
+      {
+        title: this.user()?.fullname,
+      },
+    ]);
+  }
 }