그룹 > 즐겨찾기 영역 생성

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

@@ -36,11 +36,8 @@
     </mat-menu>
   </div>
   <div>
-    <ucap-group-expansion-panel
+    <ucap-group-expansion-panel #groupExpansionPanel [groupBuddyList]="groupBuddyList$ | async"
-      #groupExpansionPanel
+      [favoritBuddyList]="favoritBuddyList$ | async" (selectBuddy)="onSelectBuddy($event)">
-      [groupBuddyList]="groupBuddyList$ | async"
-      (selectBuddy)="onSelectBuddy($event)"
-    >
     </ucap-group-expansion-panel>
   </div>
 </div>

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

@@ -37,6 +37,7 @@ export class GroupComponent implements OnInit {
   groupBuddyList$: Observable<
     { group: GroupDetailData; buddyList: UserInfo[] }[]
   >;
+  favoritBuddyList$: Observable<UserInfo[]>;
   companyList$: Observable<Company[]>;
   companyCode: string;
 
@@ -110,6 +111,16 @@ export class GroupComponent implements OnInit {
           return groupBuddyList;
         })
       );
+
+    this.favoritBuddyList$ = this.store
+      .pipe(select(AppStore.MessengerSelector.SyncSelector.buddyInfoList))
+      .pipe(
+        map(buddyInfoList => {
+          return buddyInfoList
+            .filter(buddy => buddy.isFavorit)
+            .sort((a, b) => (a.name < b.name ? -1 : a.name > b.name ? 1 : 0));
+        })
+      );
   }
 
   async onClickGroupMenu(menuType: string) {

projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html

@@ -1,9 +1,13 @@
 <mat-accordion #groupAccordion="matAccordion" [multi]="true">
-  <mat-expansion-panel *ngIf="true">
+  <mat-expansion-panel *ngIf="favoritBuddyList.length > 0">
     <mat-expansion-panel-header>
       <mat-panel-title> 즐겨찾기 </mat-panel-title>
       <mat-panel-description> </mat-panel-description>
     </mat-expansion-panel-header>
+
+    <ucap-profile-user-list-item *ngFor="let favUserList of favoritBuddyList" [userInfo]="favUserList"
+      (click)="onClickBuddy(favUserList)">
+    </ucap-profile-user-list-item>
   </mat-expansion-panel>
 
   <mat-expansion-panel *ngFor="let groupBuddy of groupBuddyList">

projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.ts

@@ -22,6 +22,9 @@ export class ExpansionPanelComponent implements OnInit {
   @Input()
   groupBuddyList: { group: GroupDetailData; buddyList: UserInfo[] }[];
 
+  @Input()
+  favoritBuddyList: UserInfo[];
+
   @Output()
   selectBuddy = new EventEmitter<UserInfo>();