Using Laravel blade syntax for Bootstrap tabs and routing - laravel

Question

I have already read some links regarding Bootstrap tab in Laravel but none of them is working for me.
I have 3 views (movies, scheduled_movies, group_movies) each view has its respective controller. Now I want to show all these views using bootstrap tab component. I tried a lot, but tabs don't work properly or sometimes all the data of three view shown in the first tab and sometimes only tabs are shown but not the data.
Here is my code-
app.blade.php
#include('components.navbar')
#yield('base')
base.blade.php
#extends('layouts.app')
#section('base')
<div class="container-fluid">
<div class="row">
<div class="col-2 d-none d-md-block bg-light sidebar" >
#include('components.sidebar')
</div>
<main id="main" class="col-10 ml-sm-auto col-lg-10 px-3">
#yield('content')
</main>
</div>
</div>
#endsection
I have separate tab.blade.php where all my bootstrap tab code is written. and I have included all 3 views using #include
tab.blade.php
#extends('layouts.base')
#section('content')
<div class="p-3">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link" id="movies-tab" data-toggle="tab" href="#movies" role="tab" aria-controls="movies"
aria-selected="true">All movies</a>
</li>
<li class="nav-item">
<a class="nav-link" id="scheduled-movies-tab" data-toggle="tab" href="#scheduled-movies" role="tab"
aria-controls="scheduled-movies" aria-selected="false">Scheduled Movies</a>
</li>
<li class="nav-item">
<a class="nav-link" id="group-movies-tab" data-toggle="tab" href="#group-movies" role="tab" aria-controls="group-movies"
aria-selected="false">Group Movies</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show" id="movies" role="tabpanel" aria-labelledby="movies-tab">
#include('movies.all_movies.index')
</div>
<div class="tab-pane fade" id="scheduled-movies" role="tabpanel" aria-labelledby="scheduled-movies-tab">
#include('movies.scheduled-movies.index')
</div>
<div class="tab-pane fade" id="group-movies" role="tabpanel" aria-labelledby="group-movies-tab">
#include('movies.group-movies.index')
</div>
</div>
</div>
#endsection
MoviesController
class MoviesController extends Controller
{
public function index()
{
$movies = Movie::all();
return view('movies.all_movies.index')->with('movies', $movies);
}
}
The same code is written in ScheduledMoviesController.
This is my web.php file
Route::get('movies', 'MoviesController#index');
Route::get('scheduled-movies', 'ScheduledMoviesController#index');
Route::get('group-videos', 'GroupMoviesController#index')->middleware('verified');
Till now I have figured out some cases
Maybe my blade syntax #yield or #include is wrong.
Maybe routing is wrong (because of the first page of the tab showing data from all three).