Completed 2.14 (fix error)

part2/2.12-2.14/src/App.js

@@ -9,7 +9,7 @@ const App = () => {
   const [CountryList, setCountryList] = useState([])
   const [ResultList, setResultList] = useState([])
   const [WeatherData, setWeatherdata] = useState([])
-
+  console.log(WeatherData)
   useEffect(() => {
     axios
       .get('https://restcountries.eu/rest/v2/all')
@@ -19,7 +19,6 @@ const App = () => {
   }, [])
 
   useEffect(() => {
-    console.log(ResultList)
     if (ResultList.length === 1 ) {
       const capital = ResultList[0].capital.replace(/\s/g, '+')
       console.log(capital)

part2/2.12-2.14/src/components/Country.js

@@ -12,6 +12,7 @@ const Country = ({data,onClick,weather}) => {
             list > 1  ? data.map((item, index) => <CountryLongList key={item.alpha2Code} data={item} onClick={() => clickHandler(index)} weather={weather}/>) :
             data.map(item => <CountryDetail key={item.alpha2Code} data={item} weather={weather}/>)
             }
+            
         </div>
         
     )
@@ -31,8 +32,6 @@ const CountryLongList = ({data, onClick,weather}) => {
     );
 }
 const CountryDetail = ({data,weather}) => {
-    console.log("Data", data)
-    console.log("Length", data.length)
     return (
         <div>
             <h2>{data.name}</h2>
@@ -47,7 +46,7 @@ const CountryDetail = ({data,weather}) => {
             {data.languages.map(item =><li key={item.name}>{item.name}</li>)}
             </ul>
             <img src={data.flag} alt={data.name} width="200" />
-            <Weather weather={weather} capital={data.capital} />
+            {weather.length === 0 ? "" : <Weather weather={weather} capital={data.capital} />}
         </div>
     )
 }

part2/2.12-2.14/src/components/Weather.js

@@ -1,10 +1,12 @@
 import React from 'react'
 
 const Weather = ({weather,capital}) => {
+
+    console.log("Weather:", weather)
     const {current_condition} = weather
-    const temperature = current_condition[0].temp_C
+    const temperature = current_condition[0].temp_C || ''
-    const windspeed = current_condition[0].windspeedKmph
+    const windspeed = current_condition[0].windspeedKmph || ''
-    const winddirection = current_condition[0].winddir16Point
+    const winddirection = current_condition[0].winddir16Point || ''
     return (
         <div>
             <h2>Weather in {capital}</h2>