DBC22-6145: not showing all 30km away stations for cameras

DBC22-6145: fixed elevation not found error

DBC22-6145: not showing all 30km away stations for cameras

DBC22-6145: fixed elevation not found error

DBC22-6145: fixed the issue that spin all the time when not stations

DBC22-6145: fixed weather station not updated when camera switched

DBC22-6145: updated nearbyweather ui when there is no station associated

added missing file

Author: bcgov-brwang

package-lock.json

@@ -550,6 +550,10 @@ def update_camera_weather_station(camera, weather_class):
             elevation__lte=camera.elevation + 300,
             elevation__gte=camera.elevation - 300,
         )
+    elif weather_class == RegionalWeather or weather_class == HighElevationForecast:
+        stations_qs = stations_qs.filter(
+            distance__lte=D(km=30),
+        )
 
     closest_station = stations_qs.order_by('distance').first()
 

src/backend/apps/webcam/tasks.py

@@ -54,10 +54,13 @@ export default function NearbyWeathers(props) {
   const defaultActiveTab = weatherTabs.length ? weatherTabs[0].key : null;
   const [activeTab, setActiveTab] = useState(defaultActiveTab);
 
+  const hasWeather = localWeather || regionalWeather || hef;
+
   // Effects
   // find regional weather and set state
   useEffect(() => {
     if (!regionalWeatherList || !camera.regional_weather_station) {
+      setRegionalWeather(null);
       return;
     }
 
@@ -69,6 +72,7 @@ export default function NearbyWeathers(props) {
   // find local weather and set state
   useEffect(() => {
     if (!currentWeatherList || !camera.local_weather_station) {
+      setLocalWeather(null);
       return;
     }
 
@@ -80,6 +84,7 @@ export default function NearbyWeathers(props) {
   // find hef and set state
   useEffect(() => {
     if (!hefList || !camera.hev_station) {
+      setHef(null);
       return;
     }
 
@@ -102,7 +107,7 @@ export default function NearbyWeathers(props) {
 
   /* Rendering */
   // Loading state
-  if (!regionalWeather && !localWeather && !hef) {
+  if ((regionalWeather || localWeather || hef) && (!regionalWeather && !localWeather && !hef)) {
     return (
       <div>
         <Skeleton height={48}/>
@@ -139,18 +144,30 @@ export default function NearbyWeathers(props) {
             })}
           </div>
         </div>
-
-        { activeTab === 'Roadside' && localWeather &&
-          <NearbyLocalWeather weather={localWeather} />
-        }
-
-        { activeTab === 'Regional' && regionalWeather &&
-          <NearbyRegionalWeather weather={regionalWeather} />
-        }
-
-        { activeTab === 'High elevation' && hef &&
-          <NearbyHevWeather weather={hef} />
-        }
+        <div>
+        {!hasWeather ? (
+          <div className="weather-empty">
+            <h3>No nearby weather available</h3>
+            <p>
+              Unfortunately there is no nearby weather data available for this camera.
+            </p>
+          </div>
+        ) : (
+          <>
+            {activeTab === 'Roadside' && localWeather && (
+              <NearbyLocalWeather weather={localWeather} />
+            )}
+
+            {activeTab === 'Regional' && regionalWeather && (
+              <NearbyRegionalWeather weather={regionalWeather} />
+            )}
+
+            {activeTab === 'High elevation' && hef && (
+              <NearbyHevWeather weather={hef} />
+            )}
+          </>
+        )}
+        </div>
       </div>
     </React.Fragment>
   );