fixed weather code context

app/page.tsx

@@ -26,7 +26,6 @@ export default function Home() {
       <div className='block mx-auto max-w-4xl'>
         <LocationContext.Provider value={contextValue}>
           <LocationSearch />
-          <WeatherIcon />
           <WeatherNow />
         </LocationContext.Provider>
       </div>

components/Temperature.tsx

@@ -9,5 +9,4 @@ export default function Temperature() {
     return (
     <p>{feels}°C</p>
     )
-}
-
+}

components/WeatherIcon.tsx

@@ -13,7 +13,6 @@ import sun from '../public/sun.svg'
 
 import { useContext } from "react";
 import { WeatherContext } from "./WeatherNow";
-import { HourlyForecast } from "@/types/types";
 
 
 
@@ -83,11 +82,10 @@ function getCurrentWeatherIcon(weatherCode: number) {
 
 export default function WeatherIcon() {
     const { weather } = useContext(WeatherContext)
-    const weatherCode = weather.current.weather_code
     return(
     <>
-    <Image src={getCurrentWeatherIcon(weatherCode)} alt="Weather icon"/>
-    {console.log(weatherCode)}
+    <Image src={getCurrentWeatherIcon(weather.current.weather_code)} alt="Weather icon"/>
+    {JSON.stringify(weather.current.weather_code)}
     </>
 )
 };

components/WeatherNow.tsx

@@ -6,6 +6,7 @@ import { HourlyForecast, WeatherContextType} from "@/types/types";
 import { createContext, useContext, useEffect, useState } from "react";
 import { defaultHourlyForecast } from "@/app/defaultState";
 import { LocationContext } from "@/app/page";
+import WeatherIcon from "./WeatherIcon";
 
 export const WeatherContext = createContext<WeatherContextType>({
   weather: defaultHourlyForecast,
@@ -35,6 +36,7 @@ export default function WeatherNow() {
     <>
       <h1>Here is the current weather in {geoLocation.name}</h1>
       <WeatherContext.Provider value={contextValue}>
+        <WeatherIcon />
         <Temperature />
       </WeatherContext.Provider>
     </>