début affichage des utilisateurs

src/app/pages/menu/menu-users/menu-users.component.html

@@ -0,0 +1,4 @@
+<button class="users-btn">
+    <img width="50" height="50" src="https://img.icons8.com/ios/50/user-male-circle--v1.png" alt="user"/>
+    <span class="username">INFO NOM : </span>
+</button>

src/app/pages/menu/menu-users/menu-users.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-menu-users',
+  imports: [],
+  templateUrl: './menu-users.component.html',
+  styleUrl: './menu-users.component.css'
+})
+export class MenuUsersComponent {
+
+}

src/app/pages/menu/menu/menu.component.html

@@ -3,4 +3,11 @@
         <app-menu-nav/>
         <app-menu-param/>
     </div>
+
+    <div class="users">
+        <app-menu-users/>
+
+    </div>
+
+
 </div>

src/app/pages/menu/menu/menu.component.ts

@@ -1,16 +1,44 @@
-import { Component } from '@angular/core';
+import {Component, inject, signal} from '@angular/core';
 import {MenuNav} from "../menu-nav/menu-nav.component";
 import {MenuParamComponent} from "../menu-param/menu-param.component";
+import {MenuUsersComponent} from "../menu-users/menu-users.component";
+import {KnotsDTOUserGetUserDto, UsersService} from "../../../services/api";
+import {Router} from "@angular/router";
+import {firstValueFrom} from "rxjs";
 
 @Component({
   selector: 'app-menu',
-  imports: [
-    MenuNav,
-    MenuParamComponent
-  ],
+    imports: [
+        MenuNav,
+        MenuParamComponent,
+        MenuUsersComponent
+    ],
   templateUrl: './menu.component.html',
   styleUrl: './menu.component.css'
 })
 export class Menu {
+    private usersService = inject(UsersService);
+
+    router = inject(Router);
+
+    users = signal<KnotsDTOUserGetUserDto[]>([]);
+    usersLoading = signal<boolean>(false);
+
+    async ngOnInit() {
+
+    }
+
+    async fetchUsers() {
+        this.usersLoading.set(true);
+        try {
+            const users = await firstValueFrom(this.usersService.getAllUsersEndpoint());
+            this.users.set(users);
+
+        } catch (e) {
+            console.log('Erreur', 'Erreur de communication avec l\'API');
+        }
+
+        this.usersLoading.set(false);
+    }
 
 }