fix message statud bag

src/app/ui/chat/modal/chat-popover/chat-popover.page.html

@@ -19,6 +19,7 @@
 
     <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
     <br *ngIf="showLoader">
+    <button (click)="details()" class="btn-cancel" shape="round">Detalhes</button>
     <button *ngIf="isAdmin" (click)="addUser()" class="btn-cancel" shape="round">Adicionar</button>
     <button (click)="leaveGroup()" class="btn-cancel" shape="round">Sair do Grupo</button>
     <button *ngIf="isAdmin" (click)="openChangeGroupName()" class="btn-cancel btn-cancel mt-10" shape="round" style="min-width: 192px;">Alterar

src/app/ui/chat/modal/chat-popover/chat-popover.page.ts

@@ -8,6 +8,7 @@ import { ZodError } from 'zod';
 import { isHttpResponse } from 'src/app/services/http.service';
 
 import { ChatServiceService } from 'src/app/module/chat/domain/chat-service.service'
+import { RoomInfoPage } from '../room-info/room-info.page';
 
 @Component({
   selector: 'app-chat-popover',
@@ -112,7 +113,7 @@ export class ChatPopoverPage implements OnInit {
   //Delete
   async deleteGroup() {
     this.showLoader = true
-    
+
     const result = await this.ChatServiceService.deleteRoomById(this.roomId)
 
 
@@ -144,4 +145,23 @@ export class ChatPopoverPage implements OnInit {
     this.close('addUser');
   }
 
+
+  async details() {
+    const modal = await this.modalController.create({
+      component: RoomInfoPage,
+      cssClass: 'modal-aside',
+      backdropDismiss: true,
+      componentProps: {
+        roomId: this.roomId
+      }
+    });
+    await modal.present();
+    modal.onDidDismiss().then((res)=>{
+      if(res.data == 'success') {
+        this.leaveGroup();
+        //this.ChatSystemService.hidingRoom(this.roomId);
+      }
+    });
+  }
+
 }

src/app/ui/chat/modal/room-info/room-info-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { RoomInfoPage } from './room-info.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: RoomInfoPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class RoomInfoPageRoutingModule {}

src/app/ui/chat/modal/room-info/room-info.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { RoomInfoPageRoutingModule } from './room-info-routing.module';
+
+import { RoomInfoPage } from './room-info.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    RoomInfoPageRoutingModule
+  ],
+  declarations: [RoomInfoPage]
+})
+export class RoomInfoPageModule {}

src/app/ui/chat/modal/room-info/room-info.page.html

@@ -0,0 +1,18 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title class="title"  *ngIf="roomData$ | async as roomData"> Nome do grupo {{ roomData.roomName }}</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content class="px-20">
+
+  <div> Membros: </div>
+
+  <ion-list class="header-bottom-contacts"  *ngIf="roomMembers$ | async as memberList">
+    <div *ngFor="let user of memberList; let i = index">
+      <div class="py-10">
+        {{ user.wxFullName }} <span *ngIf="user.isAdmin">(admin do group)</span>
+      </div>
+    </div>
+  </ion-list>
+</ion-content>

src/app/ui/chat/modal/room-info/room-info.page.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { RoomInfoPage } from './room-info.page';
+
+describe('RoomInfoPage', () => {
+  let component: RoomInfoPage;
+  let fixture: ComponentFixture<RoomInfoPage>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ RoomInfoPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(RoomInfoPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/ui/chat/modal/room-info/room-info.page.ts

@@ -0,0 +1,36 @@
+import { Component, OnInit } from '@angular/core';
+import { ModalController, NavParams, PopoverController } from '@ionic/angular';
+import { Observable } from 'rxjs';
+import { MemberTable } from 'src/app/module/chat/infra/database/dexie/schema/members';
+import { MemberListLocalRepository } from 'src/app/module/chat/data/repository/member-list-local-repository.service'
+import { Observable as  DexieObservable } from 'Dexie';
+import { RoomTable } from 'src/app/module/chat/infra/database/dexie/schema/room';
+import { RoomLocalRepository } from 'src/app/module/chat/data/repository/room/room-local-repository.service'
+
+@Component({
+  selector: 'app-room-info',
+  templateUrl: './room-info.page.html',
+  styleUrls: ['./room-info.page.scss'],
+})
+export class RoomInfoPage implements OnInit {
+
+  roomId:string;
+  roomMembers$:  Observable<MemberTable[] | undefined>
+  roomData$: DexieObservable<RoomTable | undefined>
+
+  constructor(
+    private navParams: NavParams,
+    private MemberListLocalRepository: MemberListLocalRepository,
+    private RoomLocalRepository: RoomLocalRepository,
+  ) {
+    this.roomId = this.navParams.get('roomId');
+  }
+
+  ngOnInit() {
+
+    // this.roomMessage$ = this.messageRepositoryService.getItemsLive(this.roomId)
+    this.roomMembers$ = this.MemberListLocalRepository.getRoomMemberByIdLive(this.roomId).pipe()
+    this.roomData$ = this.RoomLocalRepository.getRoomByIdLive(this.roomId)
+  }
+
+}