added messages

src/app/components/message/message.component.ts

@@ -1,16 +1,58 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, inject, input, OnInit, signal} from '@angular/core';
+import {GetGroupDetailsDto, GetMessageDto, MessagesService} from "../../services/api";
+import {firstValueFrom} from "rxjs";
+import {IonicModule, LoadingController, ToastController} from "@ionic/angular";
+import {AuthManageService} from "../../services/auth-manage";
+import {jwtDecode} from "jwt-decode";
+import {DatePipe} from "@angular/common";
+import {addIcons} from "ionicons";
+import {chatbubbleEllipsesOutline, moonOutline} from 'ionicons/icons';
+
+addIcons({
+    "chatbubble-ellipses-outline" : chatbubbleEllipsesOutline,
+    "moon-outline" : moonOutline,
+})
 
 @Component({
     selector: 'app-message',
     templateUrl: './message.component.html',
     styleUrls: ['./message.component.scss'],
+    imports: [
+        DatePipe,
+        IonicModule
+    ]
 })
 export class MessageComponent implements OnInit {
+    private messagesService = inject(MessagesService);
+    private authService = inject(AuthManageService);
+    private loadCtrl = inject(LoadingController);
+    private toastCtrl = inject(ToastController);
 
-    constructor() {
+    messages = signal<GetMessageDto[]>([]);
+    groupId = input.required<GetGroupDetailsDto["id"]>();
+
+    currentUser = 0;
+
+    async ngOnInit() {
+        const loading = await this.loadCtrl.create({
+            message: 'Chargement...',
+            spinner: 'lines-sharp-small'
+        });
+        await loading.present();
+
+        try {
+            const messages = await firstValueFrom(this.messagesService.getMessagesEndpoint(this.groupId()));
+            this.messages.set(messages);
+            this.currentUser = Number(jwtDecode<any>(this.authService.getToken()).UserId);
+        }
+        catch {
+            const toast = await this.toastCtrl.create({
+                message: 'Impossible de charger les messages.',
+                duration: 2000,
+                color: 'danger'
+            });
+            await toast.present();
+        }
+        await loading.dismiss();
     }
-
-    ngOnInit() {
-    }
-
 }