How to fix foreach loop Printing data twice in carousel bootstrap 4

I'm looping through $slides which returns all slides in my db .

the carousel is working just fine .

i have title and second title stored in my db .

so when i loop i get the slide with the title ok. when i add another slide i get the last title and the second title of my last slide in the new one.

like this :

screen shot

returning all slides in service provider:

 View::composer('main', function ($view) {
            $view->with('slides', Slide::all());
        });

my carousel :

<div id="myCarousel" class="carousel slide" data-ride="carousel">
   <ol class="carousel-indicators">
      @foreach($slides as $slider)
      <li data-target="#myCarousel" data-slide-to="" class=""></li>
      @endforeach
   </ol>
   <div class="carousel-inner">
      @foreach($slides as $s)
      <div class="carousel-item  carousel-image" style="background-size: cover;">
         <picture>
            <source srcset="" media="(min-width: 1400px)">
            <source srcset="" media="(min-width: 768px)">
            <source srcset="" media="(min-width: 576px)">
            <div style="background-image:url('');" class="d-block w-100 img-fluid carousel-image"></div>
         </picture>
         <div class="container">
            <div class="carousel-caption  text-center  animated fadeInUp  d-flex flex-column h-100 align-items-center justify-content-center">
               <h1 class="display-4"></h1>
               <p class="lead"></p>
            </div>
         </div>
      </div>
      @endforeach
   </div>
</div>

what am i doing wrong?

via Chebli Mohamed