Jammming is not searching

When I press search, the program does not search. Note, I DID provide the search method to an onClick attribute of a button in SearchBar.js.What could be wrong in my code?
This is App.js

import React from 'react';
import './App.css';
import SearchBar from '../SearchBar/SearchBar';
import SearchResults from '../SearchResults/SearchResults';
import Playlist from '../Playlist/Playlist';
import Spotify from '../../util/Spotify';

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      searchResults: [],
      playlistName: 'My Title',
      playlistTracks: []
    };
    this.addTrack = this.addTrack.bind(this);
    this.removeTrack = this.removeTrack.bind(this);
    this.updatePlaylistName = this.updatePlaylistName.bind(this);
    this.savePlaylist = this.savePlaylist.bind(this);
    this.search = this.search.bind(this);
  }
  
  addTrack(track) {
    const tracks = this.state.playlistTracks;
    if(tracks.find(el => el.id === track.id))
      return;
    tracks.push(track);
    this.setState({playlistTracks: tracks});
  }

  removeTrack(track){
    let tracks = this.state.playlistTracks;
    tracks = tracks.filter(cur => cur.id !== track.id);
    this.setState({playlistTracks: tracks});
  }

  updatePlaylistName(name) {
    this.setState({playlistName: name});
  }

  savePlaylist() {
    const trackUris = this.state.playlistTracks.map(track => track.uri);
    Spotify.savePlaylist(this.state.playlistName, trackUris).then(() => this.setState({playlistName: 'New Playlist', playlistTracks: []}));
  }

  search(term) {
    Spotify.search(term).then(searchResults => this.setState({searchResults: searchResults}));
  }

  render() {
    return (
      <div>
          <h1>Ja<span className="highlight">mmm</span>ing</h1>
          <div className="App">
              <SearchBar search={this.search} />
              <div className="App-playlist">
              <SearchResults searchResults={this.state.searchResults} onAdd={this.addTrack} onSearch={this.search} /> 
              <Playlist title={this.state.playlistName} 
                        tracks={this.state.playlistTracks} 
                        onRemove={this.removeTrack} 
                        onNameChange={this.updatePlaylistName} 
                        onSave={this.savePlaylist} />
              </div>
          </div>
      </div>
    );
  }
}

export default App;

This is Spotify.js

let accessToken;

const clientId = 'a406e3205d614f7599b819f88f9cf1f2';

const redirectUri = 'http://localhost:3000/';

const Spotify = {

    getAccessToken() {

        if(accessToken)

            return accessToken;

        const accessTokenMatch = window.location.href.match(/accessToken=([^&]*)/);

        const expiresInMatch = window.location.href.match(/expires_in=([^&]*)/);

        if(accessTokenMatch && expiresInMatch){

            accessToken = accessTokenMatch[1];

            const expiresIn = Number(expiresInMatch[1]);

            window.setTimeout(() => accessToken = '', expiresIn * 1000);

            window.history.pushState('Access Token', null, '/');

            return accessToken;

        } else {

            window.location = `https://accounts.spotify.com/authorize?client_id=${clientId}&response_type=token&scope=playlist-modify-public&redirect_uri=${redirectUri}`;

        }

    },

    search(term) {

        const token = Spotify.getAccessToken();

        return fetch(`https://api.spotify.com/v1/search?type=track&q=${term}`, {headers: {Authorization: `Bearer ${token}`}}).then(response => response.json())

            .then(responseJson => {

                if(!responseJson.tracks)

                    return [];

                return responseJson.tracks.items.map(track => ({id: track.id, name: track.artists[0].name, album: track.album.name, uri: track.uri}));

            });

    },

    savePlaylist(name, uris) {

        if(name && uris.length) {

            const token = Spotify.getAccessToken();

            const headers = {Authorization: `Bearer ${token}`};

            let userId; 

            return fetch(`https://api.spotify.com/v1/me`, {headers: headers}).then(response => response.json()).then(jsonResponse => {

              userId = jsonResponse.id;

              return fetch(`https://api.spotify.com/v1/users/${userId}/playlists`, 

                           {

                              headers: headers, 

                              method: 'POST', 

                              body: JSON.stringify({name: name})

                            }).then(response => response.json()

                            ).then(jsonResponse => {

                              const playlistId = jsonResponse.id;

                              return fetch(`https://api.spotify.com/v1/users/${userId}/playlists/${playlistId}/tracks`, 

                              {

                                headers: headers,

                                method: 'POST',

                                body: JSON.stringify({uris: uris})

                              })

                            })

            });

        }

    }

};

export default Spotify;

Thank you in advance!

I am also having the SAME problem in jammming after I provided the onClick={this.search} attribute to <SearchBar />.

I’m also having the same issue. Have either of you had any luck resolving it?