Added all setting's group (except add user to group)

src/app/components/groups/groups.component.ts

@@ -1,8 +1,9 @@
-import {Component, input} from '@angular/core';
-import {IonicModule} from "@ionic/angular";
-import {GetGroupDto} from "../../services/api";
+import {Component, inject, input, output} from '@angular/core';
+import {IonicModule, LoadingController, ToastController} from "@ionic/angular";
+import {GetGroupDetailsDto, GetGroupDto, GroupsService} from "../../services/api";
 import {addIcons} from "ionicons";
 import {chatbubblesOutline, chevronForwardOutline} from "ionicons/icons";
+import {firstValueFrom} from "rxjs";
 
 addIcons({
     'group': chatbubblesOutline,
@@ -18,5 +19,32 @@ addIcons({
     ]
 })
 export class GroupsComponent {
+    private groupsService = inject(GroupsService);
+    private toastCtrl = inject(ToastController);
+    private loadCtrl = inject(LoadingController);
+
     groups = input.required<GetGroupDto[]>();
+
+    group = output<GetGroupDetailsDto>();
+
+    async selectedGroup(id: number) {
+        const loading = await this.loadCtrl.create({
+            message: 'Chargement...',
+            spinner: 'lines-sharp-small'
+        });
+        await loading.present();
+
+        try {
+            const group = await firstValueFrom(this.groupsService.getGroupDetailsEndpoint(id));
+            this.group.emit(group);
+        } catch {
+            const toast = await this.toastCtrl.create({
+                message: 'Impossible de charger le groupe',
+                duration: 2000,
+                color: 'danger'
+            });
+            await toast.present();
+        }
+        await loading.dismiss();
+    }
 }