Typeahead not working in my laravel blade page

I want to search a client by his name from DB.
I have the following controller function(note: I saved them with “nume” instead of “name”)

namespace AppHttpControllers;
use AppModelsPlati;
use AppModelsClients;
use IlluminateHttpRequest;
use IlluminateSupportFacadesDB;
use Datatables;
use IlluminateHttpRedirectResponse;
use SymfonyComponentHttpFoundationResponse;

public function autocomplete(Request $request)
        {
            $data = Clients::select("nume")
                ->where("nume","LIKE","%{$request->get('query')}%")
                ->get();
   
        return response()->json($data);

}

This function outputs this:enter image description here

This is each’s client’s name.

In my blade page I have the following:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <meta name="csrf-token" content="{{ csrf_token() }}">
  <title></title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
  <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js" ></script>
 <style>
    .container{
    padding: 10%;
    text-align: center;
   } 
 </style>
</head>
<body>
 
<div class="container mt-3">
    <h1 class="mb-3">Laravel 8 Autocomplete Search using Bootstrap Typeahead JS - LaraTutorials</h1>   
    <input id="search" class="typeahead form-control" type="text">
</div>
 
<script type="text/javascript">
    var path = "{{ url('autocomplete') }}";
    $('#search').typeahead({
        return $.get(route, {
                    query: query
                }, function ($data) {
                    return process($data);
                });
        }
    });
</script>
   
</body>
</html>

But when I type it doesn’t show me anything.
Does anyone know why?