blue-twilight/resources/views/themes/base/partials/photo_comments.blade.php

<div class="row">
    <div class="col mt-4">
        <h2>@lang('gallery.photo_comments_heading')</h2>

        @if (\App\User::currentOrAnonymous()->can('post-comment', $photo))
            <h3>@lang('gallery.photo_comments_reply_form_heading')</h3>
            <p>@lang('gallery.photo_comments_reply_form_p1')</p>
            <hr/>
            @include(Theme::viewName('partials.photo_comments_reply_form'))
        @endif

        @foreach ($photo->comments()->whereNull('parent_comment_id')->get() as $comment)
            @if ($comment->isApproved())
                @include(Theme::viewName('partials.photo_single_comment'))
            @elseif (!$comment->isModerated() && Gate::allows('moderate-comments', $photo))
                @include(Theme::viewName('partials.photo_single_comment_moderate'))
            @endif
        @endforeach
    </div>
</div>

<div class="modal" tabindex="-1" role="dialog" id="comment-reply-modal">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">@lang('gallery.photo_comments_reply_modal_title')</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div v-if="is_reply_form_loading" class="text-center">
                    <p class="m-2"><img src="{{ asset('ripple.svg') }}" alt="@lang('global.please_wait')" title="@lang('global.please_wait')"></p>
                    <p>@lang('global.please_wait')</p>
                </div>

                <div id="comment-reply-form-content" v-bind:style="replyFormStyle">
                </div>
            </div>
        </div>
    </div>
</div>