chargement des messages

src/app/core/auth/auth.service.ts

@@ -99,4 +99,12 @@ export class AuthService {
         localStorage.setItem(this.USER_KEY, JSON.stringify(updated));
         this.currentUser.set(updated);
     }
+
+    getCurrentUserId(): number {
+        const user = this.currentUser();
+        if (!user) {
+            throw new Error('Aucun utilisateur connecté');
+        }
+        return Number(user.id);
+    }
 }

src/app/core/chat/discussion.service.ts

@@ -3,13 +3,25 @@ import {Discussion} from "../../pages/menu/menu-users/menu-users.component";
 import { HttpClient } from "@angular/common/http";
 import { inject, Injectable } from "@angular/core";
 
+export interface Message {
+    id: number;
+    contenu: string;
+    date: string;
+    authorId: number;
+    authorName: string;
+}
+
 @Injectable({ providedIn: 'root' })
 export class discussionsService {
 
     private http = inject(HttpClient);
-    private apiUrl = 'https://localhost:5001/API';
+    private apiUrl = 'https://localhost:5250/API';
 
     getDiscussions(): Observable<Discussion[]> {
         return this.http.get<Discussion[]>(`${this.apiUrl}/discussions`);
     }
+
+    getMessages(discussionId: string): Observable<Message[]> {
+        return this.http.get<Message[]>(`${this.apiUrl}/discussions/${discussionId}/messages`);
+    }
 }

src/app/pages/messages/messages-main/messages-main.component.html

@@ -6,18 +6,17 @@
     </div>
 
     <div class="messages">
-        <div class="message received">
+        <div *ngFor="let message of messages"
-            <p>Salut, comment tu vas ?</p>
+             class="message"
-            <span class="timestamp">15:33, Hier.</span>
+             [class.sent]="isSent(message)"
-        </div>
+             [class.received]="!isSent(message)">
-        <div class="message sent">
+            <p>{{ message.contenu }}</p>
-            <p>ça va</p>
+            <span class="timestamp">{{ message.date | date:'HH:mm' }}</span>
-            <span class="timestamp">11:25, Aujd.</span>
         </div>
     </div>
 
     <div class="bottombar">
-        <app-messages-send [discussionId]="currentdiscussionId" />
+        <app-messages-send [discussionId]="currentDiscussionId" />
     </div>
 
 </div>

src/app/pages/messages/messages-main/messages-main.component.ts

@@ -1,22 +1,39 @@
 import { Component, inject, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
 import { MessagesMenu } from "../messages-menu/messages-menu.component";
 import { MessagesInfoUser } from "../messages-infouser/messages-infouser.component";
 import { MessagesSend } from "../messages-send/messages-send.component";
 import { ActivatedRoute } from '@angular/router';
+import { discussionsService, Message } from "../../../core/chat/discussion.service";
+import { AuthService } from "../../../core/auth/auth.service";
 
 @Component({
   selector: 'app-messages-main',
-  imports: [MessagesMenu, MessagesInfoUser, MessagesSend],
+  imports: [CommonModule, MessagesMenu, MessagesInfoUser, MessagesSend],
   templateUrl: './messages-main.component.html',
   styleUrl: './messages-main.component.css'
 })
 export class MessagesMain implements OnInit {
 
   private route = inject(ActivatedRoute);
+  private discussionService = inject(discussionsService);
+  private authService = inject(AuthService);
 
-  currentdiscussionId!: string;
+  currentDiscussionId!: string;
+  currentUserId!: number;
+  messages: Message[] = [];
 
   ngOnInit() {
-    this.currentdiscussionId = this.route.snapshot.paramMap.get('discussionId')!;
+    this.currentDiscussionId = this.route.snapshot.paramMap.get('discussionId')!;
+    this.currentUserId = this.authService.getCurrentUserId();
+
+    this.discussionService.getMessages(this.currentDiscussionId).subscribe({
+      next: (messages) => this.messages = messages,
+      error: (err) => console.error('Impossible de charger les messages', err)
+    });
+  }
+
+  isSent(message: Message): boolean {
+    return message.authorId === this.currentUserId;
   }
 }