assetViewerManager.closeActivityPanel()} icon={mdiClose} aria-label={$t('close')} />

{$t('activity')}

{#if innerHeight}

{#each activityManager.activities as reaction, index (reaction.id)} {#if reaction.type === ReactionType.Comment}

{reaction.comment}

{#if assetId === undefined && reaction.assetId}

{/if} {#if reaction.user.id === authManager.user.id || isAlbumOwner}

handleDeleteReaction(reaction, index)} />

{/if}

{#if (index != activityManager.activities.length - 1 && !shouldGroup(activityManager.activities[index].createdAt, activityManager.activities[index + 1].createdAt)) || index === activityManager.activities.length - 1}

{timeSince(luxon.DateTime.fromISO(reaction.createdAt, { locale: $locale }))}

{/if} {:else if reaction.type === ReactionType.Like}

{$t('user_liked', { values: { user: reaction.user.name, type: assetType ? getAssetType(assetType).toLowerCase() : null, }, })}

{#if assetId === undefined && reaction.assetId}

{/if} {#if reaction.user.id === authManager.user.id || isAlbumOwner}

handleDeleteReaction(reaction, index)} />

{/if}

{#if (index != activityManager.activities.length - 1 && isTenMinutesApart(activityManager.activities[index].createdAt, activityManager.activities[index + 1].createdAt)) || index === activityManager.activities.length - 1}

{timeSince(luxon.DateTime.fromISO(reaction.createdAt, { locale: $locale }))}

{/if}

{/if} {/each}

{/if}

({
              shortcut: { key: 'Enter' },
              onShortcut: () => handleSendComment(),
            }))}
            class="{disabled
              ? 'cursor-not-allowed'
              : ''} max-h-56 w-full resize-none items-center overflow-y-auto bg-gray-200 pe-2 leading-4 ring-0! outline-none dark:bg-gray-200"
          />
          {#if isSendingMessage}
            <div class="ms-0 flex place-items-center pb-2">
              <div class="flex w-full place-items-center">
                <LoadingSpinner size="large" />
              </div>
            </div>
          {:else if message}
            <div class="light ms-0 flex w-fit items-center">
              <IconButton
                shape="round"
                aria-label={$t('send_message')}
                variant="ghost"
                icon={mdiSend}
                onclick={() => handleSendComment()}
              />
            </div>
          {/if}
        </form>
      </div>
    </div>
  </div>
</div>

::-ms-input-placeholder {
    /* Edge 12 -18 */
    color: white;
  }
</style>