- <div class="comment-container" comment-container>
- @foreach($page->comments as $comment)
- @include('comments.comment', ['comment' => $comment])
- @endforeach
+ <div refs="page-comments@comment-count-bar" class="flex-container-row items-center">
+ <div role="tablist" class="flex">
+ <button type="button"
+ role="tab"
+ id="comment-tab-active"
+ aria-controls="comment-tab-panel-active"
+ refs="page-comments@active-tab"
+ aria-selected="true">{{ trans_choice('entities.comment_thread_count', $commentTree->activeThreadCount()) }}</button>
+ <button type="button"
+ role="tab"
+ id="comment-tab-archived"
+ aria-controls="comment-tab-panel-archived"
+ refs="page-comments@archived-tab"
+ aria-selected="false">{{ trans_choice('entities.comment_archived_count', count($commentTree->getArchived())) }}</button>
+ </div>
+ @if ($commentTree->empty() && userCan('comment-create-all'))
+ <div refs="page-comments@add-button-container" class="ml-m flex-container-row" >
+ <button type="button"
+ refs="page-comments@add-comment-button"
+ class="button outline mb-m ml-auto">{{ trans('entities.comment_add') }}</button>
+ </div>
+ @endif