{#each groupMessages($messages) as { user, messages, type, date }} {/each}

<button class='btn d-flex mt-auto align-items-center justify-content-center ml-20 border-0 px-0 shadow-none' type='button' use:click={sendMessage} style='height: 3.75rem !important; width: 3.75rem !important;'> <SendHorizontal size='1.8rem' strokeWidth={2.5} /> </button> </div> </div> <div class='d-flex flex-column w-350 mw-full px-20'> {#if peers} <div class='font-size-20 font-weight-bold pl-5 pb-10'> {Object.values($peers).length} Member(s) </div> {#each Object.values($peers) as { user }} <User {user} /> {/each} {/if} </div> </div> <!-- {#each Object.values($peers) as peer} <div class='d-flex align-items-center pb-10'> {#if peer.user?.avatar?.medium} <img src={peer.user?.avatar?.medium} alt='avatar' class='w-50 h-50 img-fluid rounded' /> {:else} <span class='w-50 h-50 anon d-flex align-items-center'><User size='4rem' /></span> {/if} <h4 class='my-0 pl-20 mr-auto line-height-normal'>{peer.user?.name || 'Anonymous'}</h4> {#if peer.user?.name} <span class='pointer text-primary d-flex align-items-center' use:click={() => IPC.emit('open', 'https://anilist.co/user/' + peer.user?.name)}><ExternalLink size='2.5rem' /></span> {/if} </div> {/each} --> </div>