Vmeda.Online/src/addons/messages/components/conversation-info/conversation-info.html

<ion-header>
    <ion-toolbar>
        <ion-title>{{ 'addon.messages.groupinfo' | translate }}</ion-title>
        <ion-buttons slot="end">
            <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                <ion-icon name="fas-times" slot="icon-only" aria-hidden="true"></ion-icon>
            </ion-button>
        </ion-buttons>
    </ion-toolbar>
</ion-header>
<ion-content>
    <ion-refresher slot="fixed" [disabled]="!loaded" (ionRefresh)="refreshData($event.target)">
        <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
    </ion-refresher>

    <core-loading [hideUntil]="loaded">
        <ion-item class="ion-text-center" *ngIf="conversation">
            <ion-label>
                <div class="large-avatar">
                    <img class="avatar" [src]="conversation!.imageurl" core-external-content [alt]="conversation!.name"
                    onError="this.src='assets/img/group-avatar.png'">
                </div>
                <h2>
                    <core-format-text [text]="conversation!.name" contextLevel="system" [contextInstanceId]="0"></core-format-text>
                </h2>
                <p>
                    <core-format-text *ngIf="conversation!.subname" [text]="conversation!.subname" contextLevel="system"
                        [contextInstanceId]="0">
                    </core-format-text>
                </p>
                <p>{{ 'addon.messages.numparticipants' | translate:{$a: conversation!.membercount} }}</p>
            </ion-label>
        </ion-item>

        <ion-item class="ion-text-wrap addon-messages-conversation-item" *ngFor="let member of members"
            (click)="closeModal(member.id)" detail="true" button>
            <core-user-avatar [user]="member" [linkProfile]="false" [checkOnline]="member.showonlinestatus" slot="start">
            </core-user-avatar>
            <ion-label>
                <p class="item-heading">
                    {{ member.fullname }}
                    <ion-icon name="fas-user-slash" *ngIf="member.isblocked"
                        [attr.aria-label]="'addon.messages.contactblocked' | translate">
                    </ion-icon>
                </p>
            </ion-label>
        </ion-item>

        <core-infinite-loading [enabled]="canLoadMore" (action)="loadMoreMembers($event)" [error]="loadMoreError">
        </core-infinite-loading>
    </core-loading>
</ion-content>