Wanderlust Step 27 - TypeError: Can not read ".properties"

//Link to project:
(https://www.codecademy.com/paths/web-development/tracks/webdev-intermediate-javascript/modules/intermediate-javascript-requests/projects/wanderlust)

// Foursquare API Info
const foursquareKey = 'fsq3DSF3G6W/FJvFTO02NmodBxgOQO7o8dRcweTiKmtsoTk=';
const url = 'https://api.foursquare.com/v3/places/search?near=';

// OpenWeather Info
const openWeatherKey = '3f848d9f55fe7bc1d9416621c4b21ebd';
const weatherUrl = 'https://api.openweathermap.org/data/2.5/weather';

// Page Elements
const $input = $('#city');
const $submit = $('#button');
const $destination = $('#destination');
const $container = $('.container');
const $placeDivs = [$("#place1"), $("#place2"), $("#place3"), $("#place4")];
const $weatherDiv = $("#weather1");
const weekDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];

const options = {
  method: 'GET',
  headers: {
    Accept: 'application/json',
    Authorization: foursquareKey,
  }
};

// Add AJAX functions here:
const getPlaces = async () => { 
    const city = $input.val();
    const urlToFetch = `${url}${city}&limit=10`;
    try {
      const response = await fetch(urlToFetch, options);
      if (response.ok) {
        const jsonResponse = await response.json();
        const places = jsonResponse.results;
        console.log(places);
      };
      return places;
    }
    catch(error) {
      console.log(error);
    }
};

const getForecast = async () => {
  const urlToFetch = `${weatherUrl}?q=${$input.val()}&APPID=${openWeatherKey}`;
  try {
    const response = await fetch(urlToFetch);
    if (response.ok) {
      const jsonResponse = await response.json();
      return jsonResponse;
    };
  } catch(error) {
    console.log(error);
  };
};


// Render functions
const renderPlaces = (places) => {
  $placeDivs.forEach(($place, index) => {
    const place = places[index];
    const placeIcon = place.categories[0].icon;
    const placeImgSrc = `${placeIcon.prefix}bg_64${placeIcon.suffix}`;
    const placeContent = createPlaceHTML(place.name, place.location, placeImgSrc);
    $place.append(placeContent);
  });
  $destination.append(`<h2>${places[0].location.locality}</h2>`);
}

const renderForecast = (forecast) => {
  const weatherContent = '';
  $weatherDiv.append(weatherContent);
};

const executeSearch = () => {
  $placeDivs.forEach(place => place.empty());
  $weatherDiv.empty();
  $destination.empty();
  $container.css("visibility", "visible");
  getPlaces()
  .then((places)=>{
    return renderPlaces(places)
  })
  getForecast();
  return false;
}

$submit.click(executeSearch);

Code above.

I am currently on the " Render Data From Foursquare API" secton of this project (steps 23 - 27) and upon attempting to return the API and have the data from the renderPlaces() function display in the generated page on the right, I am seeing a typeError: that reads as such:

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'categories')
    at main.js:62:29
    at Array.forEach (<anonymous>)
    at renderPlaces (main.js:60:14)
    at main.js:82:12

I have followed all the steps and even copied and pasted from the code in the hint in step 22. It is saying that “categories” is not defined and it is not returning the location array into the webpage (but it is returning the object in the console).

Help!

The only thing that seems different in my code is that I had await on this line in the getPlaces function: