include ../../sticker/components/sticker
mixin renderChatMessage (message, options = { })
  - var authorName = message.author.displayName || message.author.username;
  div(data-message-id= message._id, data-author-id= message.author._id).chat-message
    div(uk-grid).uk-grid-small.uk-flex-bottom
      .uk-width-expand
        .uk-text-small.chat-username.uk-text-truncate= authorName

      if message.author.picture && message.author.picture.small
        .uk-width-auto
          img(src=`/image/${message.author.picture.small._id}`, alt= `${authorName}'s profile picture`).chat-author-image

      if !options.hideMenu && !message.author._id.equals(user._id)
        .uk-width-auto.chat-user-menu
          button(type="button").uk-button.uk-button-link.chat-menu-button
            i.fas.fa-ellipsis-h
          div(data-message-id= message._id, uk-dropdown="mode: click").dtp-chatmsg-menu
            ul.uk-nav.uk-dropdown-nav
              li
                a(
                  href="",
                  data-message-id= message._id,
                  data-user-id= message.author._id,
                  data-username= message.author.username,
                  onclick="return dtp.app.muteChatUser(event);",
                ) Mute #{authorName}

    .chat-content.uk-text-break!= marked.parse(message.content)
    .chat-timestamp(data-created= message.created).uk-text-small

    if Array.isArray(message.stickers) && (message.stickers.length > 0)
      each sticker in message.stickers
        +renderSticker(sticker, { hideSlug: true })