@extends('layouts.app')
@section('content')
<section class="content-header">
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-6">
                <ol class="breadcrumb align-items-center">
                    <li class="breadcrumb-item"><a href="/">Home</a></li>
                    <li class="breadcrumb-item active">
                        <a href="{{route('posts.edit',$post->id)}}">{{strip_tags(Str::limit($post->content,50)) ?? ''}}</a>
                    </li>
                </ol>
            </div>
            {{ logs_button('comment') }}
        </div>
    </div><!-- /.container-fluid -->
</section>

<div class="container-fluid">
    <div class="row">
        <div class="card">
            <div class="card-body">
                <button class="btn btn-success" data-bs-toggle="modal" data-bs-target="#post-comment">
                    Comment <i class="fa-comment fa"></i>
                </button>
                <span class="label label-info mt-2 mb-2">Total Comment : {{$post->post_comments->count()}}</span>
                <ul class="list-group mt-2">
                    @if( $post->post_comments->count() > 0 )
                     @foreach($post->post_comments as $index => $comment)
                        <li class="list-group-item">
                            <div class="row">
                                <div class="col-xs-2 col-md-1">
                                
                                @php $img = !empty($comment->user->image) ? url( $comment->user->image ):url('public/assets/images/default-user.png') @endphp

                                <img src="{{$img}}" class="img-circle img-responsive" width="60" /></div>
                                <div class="col-xs-10 col-md-11">
                                    <div>
                                        <div class="mic-info">
                                            By: <a href="{{route('users.edit',$comment->user->id)}}">
                                                    {{!empty($comment->user->name)?$comment->user->name:'Guest'}}
                                                </a> on {{default_datetime_format($comment->created_at)}}
                                        </div>
                                    </div>
                                    <div class="comment-text">{!! $comment->comment !!}</div>
                                    <div class="action">
                                        {{ get_edit_button( '' , $comment->id , 'black text-primary' , 'Edit') }}
                                        {{ get_delete_button(route('comment.delete',$comment->id),$comment->id,'black text-danger deleteRecord','Delete')}}
                                        
                                    </div>
                                </div>
                            </div>
                        </li>
                     @endforeach   
                    @else
                      <li class="list-group-item text-center">
                          No comment posted yet.
                      </li>   
                    @endif
                </ul>
            </div>    
        </div>    
    </div>
</div>

<div class="modal fade" id="post-comment" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="sbl" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            
            <form action="{{route('comment.post',$post->id)}}" id="submit-form" method="post">
                @csrf
                <div class="modal-header">
                    <h5 class="modal-title" id="sbl">Comment on <span class="text-success">{{strip_tags(Str::limit($post->content,30))}}</span></h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
            
                <div class="modal-body">
                    <input type="hidden" name="post_id" value="{{$post->id}}">
                    
                    <div class="form-group mb-2">
                        <label class="col-md-12">Post User</label>
                        <select class="form-control col-md-12" name="user_id" required>
                            <option value="">{{ __('Select user') }}</option>
                            @php 
                                $pid = isset($data->parent_id) ? $data->parent_id : 0;
                                echo get_users_dropdown($pid) 
                            @endphp
                        </select>   
                    </div>                    
                    <div class="form-group height-200">
                        <textarea class="editor" id="comment" name="comment"></textarea>
                    </div>    
                </div>
            
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                    <button type="submit" id="submit-btn" class="btn btn-primary">Comment</button>
                </div>
            </form>

        </div>
    </div>
</div>
@endsection