Add the Weather Icon

Task

Use the existing icon helper instead of hard-coding a single icon.

File / section

src/components/CurrentWeather.jsx and src/utils/weather.js

Change

Import iconForWeather and calculate const night = weather.weather[0].icon?.endsWith("n");. Render <FontAwesomeIcon icon={iconForWeather(weather.weather[0].id, night)} />.

Why this change matters

The helper keeps condition-code mapping out of the component and lets the same mapping be reused by the forecast.

Test it

Search for clear, cloudy, rainy, or snowy cities/conditions when available and verify the icon changes with the API condition code.

Checkpoint

The current card uses Font Awesome icons selected from the weather condition.

const night = weather.weather[0].icon?.endsWith("n");
const unitLabel = unit === "metric" ? "C" : "F";

<div className="temperature">
  {Math.round(weather.main.temp)}<sup>°{unitLabel}</sup>
</div>
<h3>{weather.weather[0].main}</h3>
<p>{weather.weather[0].description.replace(/\b\w/g, c => c.toUpperCase())}</p>