diff --git a/pages/index.js b/pages/index.js
index 65e5151..66553f4 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -4,6 +4,7 @@ import Image from "next/image";
export default function Home() {
const [input, setInput] = useState();
+ const [defaultValue, setDefaultValue] = useState("Search a city...");
const [isCurrentActive, setIsCurrentActive] = useState(true);
const [weatherData, setWeatherData] = useState();
@@ -16,7 +17,9 @@ export default function Home() {
const data = await res.json();
console.log(data);
setWeatherData({ ...data });
+
setInput("");
+ // setDefaultValue("sss");
};
const something = (event) => {
@@ -69,43 +72,59 @@ export default function Home() {
{Math.round(weatherData.main.temp)}°
Feels like {Math.round(weatherData.main.feels_like)}°
- Humidity: {weatherData.main.humidity}
-
- Wind:{" "}
- {`${weatherData.wind.speed} to ${
- weatherData.wind.gust
- } ${degToCompass(weatherData.wind.deg)}`}
-
+
Time:{" "}
{new Date(
weatherData.dt * 1000 + weatherData.timezone * 1000
).toLocaleString("en-US")}
- Sunrise: {weatherData.sys.sunrise}
- Sunstet: {weatherData.sys.sunset}
)}
-
Stats info
-
-
Stats card1
-
Stats card2
-
Stats card3
-
Stats card4
-
Stats card5
-
Stats card6
-
+
(e.target.value = "")}
+ onChange={(e) => setInput(e.target.value)}
+ onKeyDown={(e) => something(e)}
+ />
+ {weatherData && (
+
+
Stats card1
+
Stats card2
+
Visibility: {weatherData.visibility / 1000} km
+
+
Humidity: {weatherData.main.humidity}
+
+
+
+ Wind:{" "}
+ {` ${weatherData.wind.speed} ${degToCompass(
+ weatherData.wind.deg
+ )}`}
+
+
+
+
+ Sunrise:{" "}
+ {new Date(
+ weatherData.sys.sunrise * 1000 + weatherData.timezone * 1000
+ ).toLocaleString("en-US")}
+
+
+ Sunset:{" "}
+ {new Date(weatherData.sys.sunset * 1000).toLocaleString(
+ "en-US"
+ )}
+
+
+
+ )}