next-ucap-messenger/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts

import { Component, OnInit } from '@angular/core';

import { Observable } from 'rxjs';

import { Store, select } from '@ngrx/store';

import { ucapAnimations } from '@ucap-webmessenger/ui';
import { UserInfo, GroupDetailData } from '@ucap-webmessenger/protocol-sync';

import * as AppStore from '@app/store';

@Component({
  selector: 'app-layout-chat-left-sidenav-group',
  templateUrl: './group.component.html',
  styleUrls: ['./group.component.scss'],
  animations: ucapAnimations
})
export class GroupComponent implements OnInit {
  groupList$: Observable<GroupDetailData[]>;

  constructor(private store: Store<any>) {}

  ngOnInit() {
    this.groupList$ = this.store.pipe(
      select(AppStore.MessengerSelector.SyncSelector.groupList)
    );
  }
}