From e39b16f787ba257b7a09c7bac63f69e56f72db3b Mon Sep 17 00:00:00 2001
From: Prisha Sharma <prishas0301@gmail.com>
Date: Sun, 3 May 2026 13:09:21 +0530
Subject: [PATCH] fix: resolve loader issue with proper async handling and
 fallback await

---
 script.js | 133 +++++++++++++++++++++++++++---------------------------
 1 file changed, 67 insertions(+), 66 deletions(-)

diff --git a/script.js b/script.js
index 7bb0cbe..0d9661c 100644
--- a/script.js
+++ b/script.js
@@ -162,7 +162,7 @@ function displaySuggestions(cities) {
         suggestion.addEventListener('click', () => {
             cityInput.value = city.name;
             hideSuggestions();
-            fetchWeatherData(city.name);
+            executeWeatherFetch(() => fetchWeatherData(city.name));
         });
 
         suggestionsContainer.appendChild(suggestion);
@@ -180,90 +180,89 @@ window.addEventListener('DOMContentLoaded', () => {
     detectUserLocation();
 });
 
+async function executeWeatherFetch(fetchAction) {
+    showLoading();
+    hideError();
+    hideWeather();
+
+    try {
+        await fetchAction();
+    } catch (error) {
+        console.error('Fetch error:', error);
+        showError('City not found. Please check spelling and try again.');
+    } finally {
+        hideLoading();
+    }
+}
+
 function handleSearch() {
     const city = cityInput.value.trim();
     if (city) {
-        fetchWeatherData(city);
+        executeWeatherFetch(() => fetchWeatherData(city));
     }
 }
+
 function detectUserLocation() {
-    if (!navigator.geolocation) {
-        fetchWeatherData('London');
-        return;
-    }
+    executeWeatherFetch(async () => {
+        if (!navigator.geolocation) {
+            await fetchWeatherData('London');
+            return;
+        }
 
-    navigator.geolocation.getCurrentPosition(
-        (position) => {
-            const { latitude, longitude } = position.coords;
-            fetchWeatherByCoords(latitude, longitude);
-        },
-        () => {
-            fetchWeatherData('London');
+        try {
+            const position = await new Promise((resolve, reject) => {
+                navigator.geolocation.getCurrentPosition(resolve, reject);
+            });
+            await fetchWeatherByCoords(position.coords.latitude, position.coords.longitude);
+        } catch {
+            await fetchWeatherData('London');
         }
-    );
+    });
 }
 
 async function fetchWeatherByCoords(lat, lon) {
-    showLoading();
-    hideError();
-    hideWeather();
+    const [currentResponse, forecastResponse] = await Promise.all([
+        fetch(`${API_BASE}/weather?lat=${lat}&lon=${lon}&units=standard`),
+        fetch(`${API_BASE}/forecast?lat=${lat}&lon=${lon}&units=standard`)
+    ]);
 
-    try {
-        const [currentResponse, forecastResponse] = await Promise.all([
-            fetch(`${API_BASE}/weather?lat=${lat}&lon=${lon}&units=metric`),
-            fetch(`${API_BASE}/forecast?lat=${lat}&lon=${lon}&units=metric`)
-        ]);
-
-        if (!currentResponse.ok || !forecastResponse.ok) {
-            throw new Error('Unable to fetch location weather');
-        }
+    if (!currentResponse.ok || !forecastResponse.ok) {
+        throw new Error('Unable to fetch location weather');
+    }
 
-        const currentData = await currentResponse.json();
-        const forecastData = await forecastResponse.json();
+    const currentData = await currentResponse.json();
+    const forecastData = await forecastResponse.json();
 
-        updateUI(currentData);
-        updateForecastUI(forecastData);
-        showWeather();
-    } catch (error) {
-        fetchWeatherData('London');
-    } finally {
-        hideLoading();
-    }
+    rawData.current = currentData;
+    rawData.forecast = forecastData;
+    updateUI(currentData);
+    updateForecastUI(forecastData);
+    showWeather();
 }
+
 async function fetchWeatherData(city) {
-    showLoading();
-    hideError();
-    hideWeather();
+    const [currentResponse, forecastResponse] = await Promise.all([
+        fetch(`${API_BASE}/weather?q=${encodeURIComponent(city)}&units=standard`),
+        fetch(`${API_BASE}/forecast?q=${encodeURIComponent(city)}&units=standard`)
+    ]);
 
-    try {
-        const [currentResponse, forecastResponse] = await Promise.all([
-            fetch(`${API_BASE}/weather?q=${encodeURIComponent(city)}&units=standard`),
-            fetch(`${API_BASE}/forecast?q=${encodeURIComponent(city)}&units=standard`)
-        ]);
-
-        if (!currentResponse.ok) {
-            const errorData = await parseJsonSafe(currentResponse);
-            throw new Error(errorData?.message || 'City not found');
-        }
-        if (!forecastResponse.ok) {
-            const errorData = await parseJsonSafe(forecastResponse);
-            throw new Error(errorData?.message || 'Forecast unavailable');
-        }
+    if (!currentResponse.ok) {
+        const errorData = await parseJsonSafe(currentResponse);
+        throw new Error(errorData?.message || 'City not found');
+    }
+    if (!forecastResponse.ok) {
+        const errorData = await parseJsonSafe(forecastResponse);
+        throw new Error(errorData?.message || 'Forecast unavailable');
+    }
 
-        const currentData = await currentResponse.json();
-        const forecastData = await forecastResponse.json();
+    const currentData = await currentResponse.json();
+    const forecastData = await forecastResponse.json();
 
-        rawData.current = currentData;
-        rawData.forecast = forecastData;
-        updateUI(currentData);
-        updateForecastUI(forecastData);
-        showWeather();
-    } catch (error) {
-        console.error('Fetch error:', error);
-        showError('City not found. Please check spelling and try again.');
-    } finally {
-        hideLoading();
-    }
+    rawData.current = currentData;
+    rawData.forecast = forecastData;
+    updateUI(currentData);
+    updateForecastUI(forecastData);
+    showWeather();
 }
 
 function updateUI(data) {
@@ -761,10 +760,12 @@ function renderForecastGraph(chartData) {
 
 function showLoading() {
     loading.classList.remove('hidden');
+    searchBtn.disabled = true;
 }
 
 function hideLoading() {
     loading.classList.add('hidden');
+    searchBtn.disabled = cityInput.value.trim().length === 0;
 }
 
 function showWeather() {