I’m having trouble leaving a blue button on the side

Question

The problem here is: I am using a foreach to scroll through an array while trying to check $like->id_post === $post->id && $like->id_user === auth()->user()->id if it is to show a blue heart if not a white heart, he does this the problem is that as he goes through everything with the foreach he shows more than once thus placing several hearts instead of one, if anyone can help me I am grateful

                      <div class="react">
                        <a class="like" onclick="handleLike({{ auth()->user()->id }}, {{ $post->id }} )">
                          @foreach ($likes as $like)
                            
                            @if($like->id_post === $post->id && $like->id_user === auth()->user()->id)
                              <i id="heart{{ $post->id }}" class="fas fa-heart"></i> <span id="like{{ $post->id }}">{{ $post->num_likes }}</span> likes
                            @else
                              <i id="heart{{ $post->id }}" class="far fa-heart"></i> <span id="like{{ $post->id }}">{{ $post->num_likes }}</span> likes
                            @endif
                          @endforeach
                        </a>  

Answer 1

@foreach ($likes as $like)
   @if($like->id_post === $post->id && $like->id_user === auth()->user()->id)
     //Se o post tiver like

   @break // Break no foreach

   @elseif($loop->last) //Se for a última interação ( se chegar até aqui, não houve 'break', logo não houve um post com like
      //Se o post tiver não tiver like
   @endif
@endforeach