extends ../layouts/room
block content

  include ../../components/pagination-bar

  mixin renderRoomTile (room)
    a(href=`/chat/room/${room._id}`).uk-display-block.uk-link-reset
      div(data-room-id= room._id, data-room-name= room.name).uk-tile.uk-tile-default.uk-tile-small
        .uk-tile-body
          div(uk-grid).uk-grid-small
            .uk-width-auto
              +renderProfileIcon(room.owner)
            .uk-width-expand
              .uk-margin-small
                div(title= room.name).uk-text-bold.uk-text-truncate= room.name
                .uk-text-small.uk-text-truncate= room.description
              div(uk-grid).uk-grid-small.uk-text-small.uk-text-muted.no-select
                .uk-width-expand
                  a(href= getUserProfileUrl(room.owner))= room.owner.username
                .uk-width-auto
                  span
                    i.fas.fa-users
                  span.uk-margin-small-left= formatCount(room.members.length)

  .uk-height-1-1.uk-overflow-auto
    .uk-card.uk-card-default.uk-card-small
      .uk-card-header
        h1.uk-card-title Public Chat Rooms

      .uk-card-body
        if Array.isArray(publicRooms.rooms) && (publicRooms.rooms.length > 0)
          div(uk-grid)
            each room in publicRooms.rooms
              div(class="uk-width-1-1 uk-width-1-2@m uk-width-1-3@l")
                +renderRoomTile(room)
        else
          div #{site.name} has no public rooms.

      .uk-card-footer
        +renderPaginationBar('/chat/room', publicRooms.totalRoomCount)