Upload 4 files

Add Google Maps ETA and ui fixes

utils/config.py

@@ -1,102 +1,103 @@
-import os
-from dotenv import dotenv_values
-from pathlib import Path
-from ipyleaflet import basemaps
-
-from shiny.express import ui
-
-
-# Paths
-# ENV when using standalone shiny server, shiny for python runs from the root of the project
-ENV_PATH = Path("env/online.env")
-
-DATA = Path(__file__).parent.parent / "data/"
-TEST_FILE = DATA / "Test.csv"
-TRAIN_FILE = DATA / "Train.csv"
-WEATHER_FILE = DATA / "Weather.csv"
-HISTORY = DATA / "history/"
-HISTORY_FILE = HISTORY / "history.csv"
-
-
-# Models
-ALL_MODELS = [
-    "AdaBoostRegressor",
-    "DecisionTreeRegressor",
-    "GradientBoostingRegressor",
-    "HistGradientBoostingRegressor",
-    "LinearRegression",
-    # "RandomForestRegressor",
-    "XGBRegressor",
-]
-
-BEST_MODELS = ["RandomForestRegressor", "XGBRegressor"]
-
-
-# Urls
-TEST_FILE_URL = "https://raw.githubusercontent.com/valiantezabuku/Yassir-ETA-Prediction-Challenge-For-Azubian-Team-Curium/main/Data/Test.csv"
-TRAIN_FILE_URL = "https://raw.githubusercontent.com/valiantezabuku/Yassir-ETA-Prediction-Challenge-For-Azubian-Team-Curium/main/Data/Train.csv"
-WEATHER_FILE_URL = "https://raw.githubusercontent.com/valiantezabuku/Yassir-ETA-Prediction-Challenge-For-Azubian-Team-Curium/main/Data/Weather.csv"
-
-
-# Load environment variables from .env file into a dictionary
-# environment_variables = dotenv_values(ENV_PATH)
-
-
-# Google Maps Directions API
-# https://maps.googleapis.com/maps/api/distancematrix/
-MAPS_API_KEY = os.getenv("MAPS_API_KEY")
-
-# https://maps.app.goo.gl/Fx5rdPs1KeA6jCeB8
-KENYA_LAT = 0.15456
-KENYA_LON = 37.908383
-
-
-BASEMAPS = {
-    "DarkMatter": basemaps.CartoDB.DarkMatter,
-    "Mapnik": basemaps.OpenStreetMap.Mapnik,
-    "NatGeoWorldMap": basemaps.Esri.NatGeoWorldMap,
-    "WorldImagery": basemaps.Esri.WorldImagery,
-}
-
-# Yassir
-BRANDCOLORS = {
-    "red": "#FB2576",
-    "purple-light": "#6316DB",
-    "purple-dark": "#08031A",
-}
-
-BRANDTHEMES = {
-    "red": ui.value_box_theme(bg=BRANDCOLORS['red'], fg='white'),
-    "purple-light": ui.value_box_theme(bg=BRANDCOLORS['purple-light'], fg='white'),
-    "purple-dark": ui.value_box_theme(bg=BRANDCOLORS['purple-dark'], fg='white'),
-}
-
-
-# Nairobi, https://maps.app.goo.gl/oPbLBYHuicjrC22J9
-# National Museum of Kenya, https://maps.app.goo.gl/zbmUpe71admABU9i9
-# Closest location
-LOCATIONS = {
-    "Nairobi": {"latitude": -1.3032036, "longitude": 36.6825914},
-    "National Museum of Kenya": {"latitude": -1.2739575, "longitude": 36.8118501},
-    "Mombasa": {"latitude": -1.3293123, "longitude": 36.8717466},
-}
-
-
-HOURS = [f"{i:02}" for i in range(0, 24)]
-
-MINUTES = [f"{i:02}" for i in range(0, 12)]
-
-SECONDS = [f"{i:02}" for i in range(0, 60)]
-
-
-ONE_MINUTE_SEC = 60
-
-ONE_HOUR_SEC = ONE_MINUTE_SEC * 60
-
-ONE_DAY_SEC = ONE_HOUR_SEC * 24
-
-ONE_WEEK_SEC = ONE_DAY_SEC * 7
-
-
-# Default trip distance
-TRIP_DISTANCE = 30275.7
+import os
+from dotenv import load_dotenv
+from pathlib import Path
+from ipyleaflet import basemaps
+
+from shiny.express import ui
+
+
+# Paths
+# ENV when using standalone shiny server, shiny for python runs from the root of the project
+ENV_PATH = Path("online.env")
+
+DATA = Path(__file__).parent.parent / "data/"
+TEST_FILE = DATA / "Test.csv"
+TRAIN_FILE = DATA / "Train.csv"
+WEATHER_FILE = DATA / "Weather.csv"
+HISTORY = DATA / "history/"
+HISTORY_FILE = HISTORY / "history.csv"
+
+
+# Models
+ALL_MODELS = [
+    "AdaBoostRegressor",
+    "DecisionTreeRegressor",
+    "GradientBoostingRegressor",
+    "HistGradientBoostingRegressor",
+    "LinearRegression",
+    # "RandomForestRegressor",
+    "XGBRegressor",
+]
+
+BEST_MODELS = ["RandomForestRegressor", "XGBRegressor"]
+
+
+# Urls
+TEST_FILE_URL = "https://raw.githubusercontent.com/valiantezabuku/Yassir-ETA-Prediction-Challenge-For-Azubian-Team-Curium/main/Data/Test.csv"
+TRAIN_FILE_URL = "https://raw.githubusercontent.com/valiantezabuku/Yassir-ETA-Prediction-Challenge-For-Azubian-Team-Curium/main/Data/Train.csv"
+WEATHER_FILE_URL = "https://raw.githubusercontent.com/valiantezabuku/Yassir-ETA-Prediction-Challenge-For-Azubian-Team-Curium/main/Data/Weather.csv"
+
+
+# Load environment variables from .env file into a dictionary
+load_dotenv(ENV_PATH)
+
+
+# Google Maps Directions API
+# https://maps.googleapis.com/maps/api/distancematrix/
+MAPS_API_KEY = os.getenv("MAPS_API_KEY")
+
+# https://maps.app.goo.gl/Fx5rdPs1KeA6jCeB8
+KENYA_LAT = 0.15456
+KENYA_LON = 37.908383
+
+
+BASEMAPS = {
+    "DarkMatter": basemaps.CartoDB.DarkMatter,
+    "Mapnik": basemaps.OpenStreetMap.Mapnik,
+    "NatGeoWorldMap": basemaps.Esri.NatGeoWorldMap,
+    "WorldImagery": basemaps.Esri.WorldImagery,
+}
+
+# Yassir
+BRANDCOLORS = {
+    "red": "#FB2576",
+    "purple-light": "#6316DB",
+    "purple-dark": "#08031A",
+}
+
+BRANDTHEMES = {
+    "red": ui.value_box_theme(bg=BRANDCOLORS['red'], fg='white'),
+    "purple-light": ui.value_box_theme(bg=BRANDCOLORS['purple-light'], fg='white'),
+    "purple-dark": ui.value_box_theme(bg=BRANDCOLORS['purple-dark'], fg='white'),
+}
+
+
+# Nairobi, https://maps.app.goo.gl/oPbLBYHuicjrC22J9
+# National Museum of Kenya, https://maps.app.goo.gl/zbmUpe71admABU9i9
+# Closest location
+LOCATIONS = {
+    "Nairobi": {"latitude": -1.3032036, "longitude": 36.6825914},
+    "National Museum of Kenya": {"latitude": -1.2739575, "longitude": 36.8118501},
+    "Mombasa": {"latitude": -1.3293123, "longitude": 36.8717466},
+}
+
+
+HOURS = [f"{i:02}" for i in range(0, 24)]
+
+MINUTES = [f"{i:02}" for i in range(0, 12)]
+
+SECONDS = [f"{i:02}" for i in range(0, 60)]
+
+
+ONE_MINUTE_SEC = 60
+
+ONE_HOUR_SEC = ONE_MINUTE_SEC * 60
+
+ONE_DAY_SEC = ONE_HOUR_SEC * 24
+
+ONE_WEEK_SEC = ONE_DAY_SEC * 7
+
+
+# Default trip distance
+TRIP_DISTANCE = 30275.7
+ETA = 18000

utils/home.py

@@ -73,7 +73,7 @@ def home_page(input: Inputs, output: Outputs, session: Session):
                     For companies like Yassir, the ability to 
                 """,
                 ui.strong("predict the estimated time of arrival (ETA)"),
-                "for trips in ",
+                " for trips in ",
                 ui.strong("real-time"),
                 " is crucial. Our mission is to enhance the Yassir experience by leveraging ",
                 ui.strong("data"),

utils/predict.py

@@ -1,442 +1,454 @@
-import os
-import re
-import sys
-from dotenv import load_dotenv
-from datetime import datetime
-import time
-import logging
-
-import httpx
-import pandas as pd
-
-from pydantic import BaseModel, Field
-from typing import List, Optional
-
-from shiny import reactive, Inputs, Outputs, Session
-from shiny.express import module, render, ui
-from shinywidgets import render_widget
-
-import ipyleaflet as L
-from faicons import icon_svg
-from geopy.distance import geodesic
-
-from utils.utils import *
-from utils.config import LOCATIONS, BRANDTHEMES, KENYA_LAT, KENYA_LON, HOURS, MINUTES, SECONDS, ALL_MODELS
-from utils.config import HISTORY_FILE, ENV_PATH
-from utils.url_to_coordinates import get_full_url, on_convert
-
-load_dotenv(ENV_PATH)
-
-
-class EtaFeatures(BaseModel):
-    timestamp: List[datetime] = Field(
-        description="Timestamp: Time that the trip was started")
-    origin_lat: List[float] = Field(
-        description="Origin_lat: Origin latitude (in degrees)")
-    origin_lon: List[float] = Field(
-        description="Origin_lon: Origin longitude (in degrees)")
-    destination_lat: List[float] = Field(
-        description="Destination_lat: Destination latitude (in degrees)")
-    destination_lon: List[float] = Field(
-        description="Destination_lon: Destination longitude (in degrees)")
-    trip_distance: List[float] = Field(
-        description="Trip_distance: Distance in meters on a driving route")
-
-
-# Log
-logging.basicConfig(level=logging.ERROR,
-                    format='%(asctime)s - %(levelname)s - %(message)s')
-
-
-lat_min, lat_max, lon_min, lon_max = get_bounds(country='Kenya')
-
-
-async def endpoint(model_name: str) -> str:
-    api_url = os.getenv("API_URL")
-    model_endpoint = f"{api_url}={model_name}"
-    return model_endpoint
-
-
-async def predict_eta(data: EtaFeatures, model_name: str) -> Optional[float]:
-    prediction = None
-    try:
-        # Get model endpoint
-        model_endpoint = await endpoint(model_name)
-
-        if "pyodide" in sys.modules:
-            import pyodide.http
-
-            response = await pyodide.http.pyfetch(
-                model_endpoint,
-                method="POST",
-                body=data,
-                headers={"Content-Type": "application/json"}
-            )
-
-            # Handle the response
-            if response.ok:
-                # .json() parses the response as JSON and converts to dictionary.
-                result = await response.json()['result']
-
-        else:
-            # Send POST request with JSON data using the json parameter
-            async with httpx.AsyncClient() as client:
-                response = await client.post(model_endpoint, json=data, timeout=30)
-                response.raise_for_status()  # Ensure we catch any HTTP errors
-
-            if (response.status_code == 200):
-                result = response.json()['result']
-
-        if result:
-            prediction = float(result['prediction'][0])
-
-            # Create dataframe
-            df = pd.DataFrame.from_dict(data)
-            df['eta_prediction'] = prediction
-            df['time_of_prediction'] = pd.Timestamp(datetime.now())
-            df['model_used'] = model_name
-
-            # Save to history csv file
-            df.to_csv(HISTORY_FILE, mode='a',
-                      header=not (HISTORY_FILE.exists()), index=False)
-    except Exception as e:
-        logging.error(f"Oops, an error occured: {e} {response}")
-
-    return prediction
-
-
-@module
-def predict_page(input: Inputs, output: Outputs, session: Session):
-    # Disable loading spinners, use elegant pulse
-    ui.busy_indicators.use(spinners=False)
-
-    ui.panel_title(title=ui.h1(ui.strong("Eta Prediction 🔮")),
-                   window_title="Eta Prediction")
-
-    with ui.layout_sidebar():
-        with ui.sidebar():
-            # Cordinates features
-            ui.input_numeric("origin_lat", "Origin Latitude °",
-                             value=LOCATIONS["Nairobi"]['latitude'], min=lat_min, max=lat_max, step=1)
-            ui.input_numeric("origin_lon", "Origin Longitude °",
-                             value=LOCATIONS["Nairobi"]['longitude'], min=lon_min, max=lon_max, step=1)
-            ui.input_numeric("destination_lat", "Destination Latitude °",
-                             value=LOCATIONS["National Museum of Kenya"]['latitude'], min=lat_min, max=lat_max, step=1)
-            ui.input_numeric("destination_lon", "Destination Longitude °",
-                             value=LOCATIONS["National Museum of Kenya"]['longitude'], min=lon_min, max=lon_max, step=1)
-
-            # Google Maps Url to Coordinates
-            ui.help_text("Convert Google Maps Url to Latitude and Longitudes")
-            ui.input_action_button("map_url", "Convert")
-
-            @reactive.effect
-            @reactive.event(input.map_url)
-            def maps_url_modal():
-                m = ui.modal(
-                    ui.help_text("From Origin:"),
-                    ui.input_text("origin_url", "Google Maps url:"),
-
-                    ui.help_text("To Destination:"),
-                    ui.input_text("destination_url", "Google Maps url:"),
-
-                    ui.input_action_button("convert_url", "Convert"),
-
-                    title="Google Maps Url to Coordinates",
-                    easy_close=True,
-                    footer=None,
-                )
-                ui.modal_show(m)
-
-            @reactive.effect
-            @reactive.event(input.convert_url, ignore_init=True)
-            def update_coordinates_from_url() -> Optional[float]:
-                try:
-                    origin_url = get_full_url(input.origin_url())
-                    destination_url = get_full_url(input.destination_url())
-
-                    # Coordinates are yet to be known
-                    origin_latitude = None
-                    origin_longitude = None
-                    destination_latitude = None
-                    destination_longitude = None
-
-                    # Regular expression to find coordinates in the URL
-                    pattern = re.compile(r"@(-?\d+\.\d+),(-?\d+\.\d+)")
-                    match = []
-                    for url in [origin_url, destination_url]:
-                        match.append(pattern.search(url))
-
-                    if all(match):
-                        origin_latitude = float(match[0].group(1))
-                        origin_longitude = float(match[0].group(2))
-                        destination_latitude = float(match[1].group(1))
-                        destination_longitude = float(match[1].group(2))
-
-                        valid.set(on_convert(origin_latitude, origin_longitude,
-                                  destination_latitude, destination_longitude))
-
-                    if valid():
-                        ui.notification_show(
-                            f"✅ The coordinates have been updated", duration=3, type="default")
-                    else:
-                        raise Exception
-                except Exception as e:
-                    logging.error(
-                        f"Oops, update_coordinates_from_url says an error occured converting maps url to coordinates: {e}")
-                    ui.notification_show(
-                        f"Error: {e}", duration=3, type="error")
-                    ui.notification_show(
-                        "🚨 Could not convert url to coordinates. Try again!", duration=6, type="error")
-
-                finally:
-                    ui.modal_remove()
-
-            # Rest coordinates back to Kenyan region
-            ui.input_action_button(
-                "reset", "Back to Nairobi", icon=icon_svg("crosshairs"))
-
-            # Trip Distance feature
-            ui.input_numeric("trip_distance", "Trip Distance (meters)",
-                             value=1, min=1, max=600000, step=10)
-            ui.input_switch("manual_distance",
-                            "Use manual distance", False),
-
-            # Date feature
-            ui.input_date("date", "Select a Date")
-            ui.help_text("Select the UTC time")
-            ui.input_select("hours", "24-hour",
-                            choices=HOURS, selected=HOURS[0])
-            ui.input_select("minutes", "Minutes",
-                            choices=MINUTES, selected=MINUTES[0])
-            ui.input_select("seconds", "Seconds",
-                            choices=SECONDS, selected=SECONDS[0])
-
-            # Select model
-            ui.input_selectize(
-                "modelname",
-                "Choose a model",
-                choices=ALL_MODELS,
-                selected="XGBRegressor",
-            )
-
-            # Base map
-            ui.input_selectize(
-                "basemap",
-                "Choose a basemap",
-                choices=list(BASEMAPS.keys()),
-                selected="Mapnik",
-            )
-
-        # Top 3 cards
-        with ui.layout_column_wrap(fill=False):
-            with ui.value_box(showcase=icon_svg("route"), theme=BRANDTHEMES['purple-dark']):
-                "Trip Distance"
-
-                @render.text
-                def trip_dist_km():
-                    return f"{trip_distance()/1000:,.1f} km" if valid else ""
-
-                @render.text
-                def trip_dist_m():
-                    return f"{trip_distance():,.1f} m" if valid and trip_distance is not None else ""
-
-            with ui.value_box(showcase=icon_svg("egg"), theme=BRANDTHEMES['purple-dark']):
-                "Geodisic Distance"
-
-                @reactive.calc
-                def geo_dist():
-                    dist = geodesic(loc1xy(), loc2xy())
-                    return (f"{dist.meters:,.1f} m", f"{dist.kilometers:,.1f} km") if valid and trip_distance is not None else ""
-
-                @render.text
-                def geo_dist_km():
-                    return geo_dist()[1] if valid and trip_distance is not None else ""
-
-                @render.text
-                def geo_dist_m():
-                    return geo_dist()[0] if valid and trip_distance is not None else ""
-
-            with ui.value_box(showcase=icon_svg("clock"), theme=BRANDTHEMES['red']):
-                "Est. time of arrival"
-
-                @reactive.calc
-                async def eta():
-                    try:
-                        # print(valid())
-                        # print(notification_error())
-                        if validate_inputs(origin_lat(), origin_lon(), destination_lat(), destination_lon()) and valid():
-                            data: EtaFeatures = {
-                                'timestamp': [datetz()],
-                                'origin_lat': [origin_lat()],
-                                'origin_lon': [origin_lon()],
-                                'destination_lat': [destination_lat()],
-                                'destination_lon': [destination_lon()],
-                                'trip_distance': [trip_distance()]
-                            }
-
-                            eta_sec = await predict_eta(data, input.modelname())
-
-                            eta_hms = time.strftime(
-                                '%H:%M:%S', time.gmtime(eta_sec))
-
-                            ui.notification_show(
-                                f"⏰ ETA: {eta_hms} H:M:S", duration=6, type="default")
-
-                            return f"{eta_sec:,.0f} s", f"{eta_hms}"
-                        else:
-                            raise Exception
-                    except Exception as e:
-                        logging.error({e})
-                        ui.notification_show(
-                            "🚨 Could not predict Eta. Median eta is 1000 seconds", duration=3, type="error")
-                        return None
-
-                @render.text
-                async def eta_sec():
-                    text = await eta()
-                    return text[0] if text else ""
-
-                @render.text
-                async def eta_hms():
-                    text = await eta()
-                    return text[1] if text else ""
-
-        # Map (2 indents)
-        with ui.card():
-            ui.card_header(
-                "💡 Map (drag the markers to change locations)")
-
-            @render_widget
-            def map():
-                return L.Map(zoom=9, center=(KENYA_LAT, KENYA_LON))
-
-    ######################################################
-    # Reactive values to store location information
-    origin_lat = reactive.value()
-    origin_lon = reactive.value()
-    destination_lat = reactive.value()
-    destination_lon = reactive.value()
-
-    valid = reactive.value()
-
-    # Reactive value to store trip_distance information
-    trip_distance = reactive.value()
-
-    @reactive.effect(priority=100)
-    def _():
-        if (
-            validate_inputs(input.origin_lat(), input.origin_lon(),
-                            input.destination_lat(), input.destination_lon())
-            or
-            validate_inputs(origin_lat(), origin_lon(),
-                            destination_lat(), destination_lon())
-        ):
-            value = True
-        else:
-            value = False
-
-        valid.set(value)
-
-    @reactive.calc
-    def datetz():
-        return f"{input.date()}T{input.hours()}:{input.minutes()}:{input.seconds()}Z"
-
-    @reactive.effect
-    def _():
-        origin_lat.set(input.origin_lat()
-                       if valid else LOCATIONS["Nairobi"]['latitude'])
-        origin_lon.set(input.origin_lon()
-                       if valid else LOCATIONS["Nairobi"]['longitude'])
-        destination_lat.set(input.destination_lat(
-        ) if valid else LOCATIONS["National Museum of Kenya"]['latitude'])
-        destination_lon.set(input.destination_lon(
-        ) if valid else LOCATIONS["National Museum of Kenya"]['longitude'])
-
-        # Automate trip distance
-        google_td = google_maps_trip_distance(loc1xy(), loc2xy())
-        if isinstance(google_td, float):
-            trip_distance.set(google_td)
-        else:
-            ui.notification_show(
-                            "🚨 Could not estimate trip distance. Using Geosidic distance...", duration=3, type="warning")
-            trip_distance.set(geo_dist())
-
-        # Manual
-        if input.manual_distance() and input.trip_distance() not in [0, None]:
-            trip_distance.set(input.trip_distance())
-
-    @reactive.effect
-    @reactive.event(trip_distance)
-    def _():
-        if valid():
-            # Update the trip distance input with current calculated or manual trip distance
-            ui.update_numeric("trip_distance", value=trip_distance())
-
-    @reactive.calc
-    def loc1xy():
-        return origin_lat(), origin_lon()
-
-    @reactive.calc
-    def loc2xy():
-        return destination_lat(), destination_lon()
-
-    # Add marker for first location
-
-    @reactive.effect
-    def _():
-        if valid():
-            update_marker(map.widget, loc1xy(), on_move1, "origin", icon=L.AwesomeIcon(
-                name='fa-map-marker', marker_color='darkpurple'))
-
-    # Add marker for second location
-
-    @reactive.effect
-    def _():
-        if valid():
-            update_marker(map.widget, loc2xy(), on_move2, "destination", icon=L.AwesomeIcon(
-                name='fa-map-marker', marker_color='purple'))
-
-    # Add line and fit bounds when either marker is moved
-
-    @reactive.effect
-    def _():
-        if valid():
-            update_line(map.widget, loc1xy(), loc2xy())
-
-    # If new bounds fall outside of the current view, fit the bounds if valid coordinates
-
-    @reactive.effect
-    def _():
-        if valid():
-            l1 = loc1xy()
-            l2 = loc2xy()
-
-            lat_rng = [min(l1[0], l2[0]), max(l1[0], l2[0])]
-            lon_rng = [min(l1[1], l2[1]), max(l1[1], l2[1])]
-            new_bounds = [
-                [lat_rng[0], lon_rng[0]],
-                [lat_rng[1], lon_rng[1]],
-            ]
-
-            b = map.widget.bounds
-            if len(b) == 0:
-                map.widget.fit_bounds(new_bounds)
-            elif (
-                lat_min < b[0][0]
-                or lat_max > b[1][0]
-                or lon_min < b[0][1]
-                or lon_max > b[1][1]
-            ):
-                map.widget.fit_bounds(new_bounds)
-
-    # Update the basemap
-
-    @reactive.effect(priority=-100)  # The last effect that runs
-    def _():
-        if valid():
-            update_basemap(map.widget, input.basemap())
-
-    @reactive.effect(priority=95)
-    @reactive.event(input.reset)
-    def _():
-        back_to_nairobi()
+import os
+import re
+import sys
+from dotenv import load_dotenv
+from datetime import datetime
+import time
+import logging
+
+import httpx
+import pandas as pd
+
+from pydantic import BaseModel, Field
+from typing import List, Optional
+
+from shiny import reactive, Inputs, Outputs, Session
+from shiny.express import module, render, ui
+from shinywidgets import render_widget
+
+import ipyleaflet as L
+from faicons import icon_svg
+from geopy.distance import geodesic
+
+from utils.utils import *
+from utils.config import LOCATIONS, BRANDTHEMES, KENYA_LAT, KENYA_LON, HOURS, MINUTES, SECONDS, ALL_MODELS
+from utils.config import HISTORY_FILE, ENV_PATH
+from utils.url_to_coordinates import get_full_url, on_convert
+
+load_dotenv(ENV_PATH)
+
+
+class EtaFeatures(BaseModel):
+    timestamp: List[datetime] = Field(
+        description="Timestamp: Time that the trip was started")
+    origin_lat: List[float] = Field(
+        description="Origin_lat: Origin latitude (in degrees)")
+    origin_lon: List[float] = Field(
+        description="Origin_lon: Origin longitude (in degrees)")
+    destination_lat: List[float] = Field(
+        description="Destination_lat: Destination latitude (in degrees)")
+    destination_lon: List[float] = Field(
+        description="Destination_lon: Destination longitude (in degrees)")
+    trip_distance: List[float] = Field(
+        description="Trip_distance: Distance in meters on a driving route")
+
+
+# Log
+logging.basicConfig(level=logging.ERROR,
+                    format='%(asctime)s - %(levelname)s - %(message)s')
+
+
+lat_min, lat_max, lon_min, lon_max = get_bounds(country='Kenya')
+
+
+async def endpoint(model_name: str) -> str:
+    api_url = os.getenv("API_URL")
+    model_endpoint = f"{api_url}={model_name}"
+    return model_endpoint
+
+
+async def predict_eta(data: EtaFeatures, model_name: str) -> Optional[float]:
+    prediction = None
+    try:
+        # Get model endpoint
+        model_endpoint = await endpoint(model_name)
+
+        if "pyodide" in sys.modules:
+            import pyodide.http
+
+            response = await pyodide.http.pyfetch(
+                model_endpoint,
+                method="POST",
+                body=data,
+                headers={"Content-Type": "application/json"}
+            )
+
+            # Handle the response
+            if response.ok:
+                # .json() parses the response as JSON and converts to dictionary.
+                result = await response.json()['result']
+
+        else:
+            # Send POST request with JSON data using the json parameter
+            async with httpx.AsyncClient() as client:
+                response = await client.post(model_endpoint, json=data, timeout=30)
+                response.raise_for_status()  # Ensure we catch any HTTP errors
+            
+            # print(response.json())            
+            if (response.status_code == 200):
+                result = response.json()['result']
+
+        if result:
+            prediction = float(result['prediction'][0])
+
+            # Create dataframe
+            df = pd.DataFrame.from_dict(data)
+            df['eta_prediction'] = prediction
+            df['time_of_prediction'] = pd.Timestamp(datetime.now())
+            df['model_used'] = model_name
+
+            # Save to history csv file
+            df.to_csv(HISTORY_FILE, mode='a',
+                      header=not (HISTORY_FILE.exists()), index=False)
+    except Exception as e:
+        logging.error(f"Oops, an error occured: {e} {response}")
+
+    return prediction
+
+
+@module
+def predict_page(input: Inputs, output: Outputs, session: Session):
+    # Disable loading spinners, use elegant pulse
+    ui.busy_indicators.use(spinners=False)
+
+    ui.panel_title(title=ui.h1(ui.strong("Eta Prediction 🔮")),
+                   window_title="Eta Prediction")
+
+    with ui.layout_sidebar():
+        with ui.sidebar():
+            # Cordinates features
+            ui.input_numeric("origin_lat", "Origin Latitude °",
+                             value=LOCATIONS["Nairobi"]['latitude'], min=lat_min, max=lat_max, step=1)
+            ui.input_numeric("origin_lon", "Origin Longitude °",
+                             value=LOCATIONS["Nairobi"]['longitude'], min=lon_min, max=lon_max, step=1)
+            ui.input_numeric("destination_lat", "Destination Latitude °",
+                             value=LOCATIONS["National Museum of Kenya"]['latitude'], min=lat_min, max=lat_max, step=1)
+            ui.input_numeric("destination_lon", "Destination Longitude °",
+                             value=LOCATIONS["National Museum of Kenya"]['longitude'], min=lon_min, max=lon_max, step=1)
+
+            # Google Maps Url to Coordinates
+            ui.help_text("Convert Google Maps Url to Latitude and Longitudes")
+            ui.input_action_button("map_url", "Convert")
+
+            @reactive.effect
+            @reactive.event(input.map_url)
+            def maps_url_modal():
+                m = ui.modal(
+                    ui.help_text("From Origin:"),
+                    ui.input_text("origin_url", "Google Maps url:"),
+
+                    ui.help_text("To Destination:"),
+                    ui.input_text("destination_url", "Google Maps url:"),
+
+                    ui.input_action_button("convert_url", "Convert"),
+
+                    title="Google Maps Url to Coordinates",
+                    easy_close=True,
+                    footer=None,
+                )
+                ui.modal_show(m)
+
+            @reactive.effect
+            @reactive.event(input.convert_url, ignore_init=True)
+            def update_coordinates_from_url() -> Optional[float]:
+                try:
+                    origin_url = get_full_url(input.origin_url())
+                    destination_url = get_full_url(input.destination_url())
+
+                    # Coordinates are yet to be known
+                    origin_latitude = None
+                    origin_longitude = None
+                    destination_latitude = None
+                    destination_longitude = None
+
+                    # Regular expression to find coordinates in the URL
+                    pattern = re.compile(r"@(-?\d+\.\d+),(-?\d+\.\d+)")
+                    match = []
+                    for url in [origin_url, destination_url]:
+                        match.append(pattern.search(url))
+
+                    if all(match):
+                        origin_latitude = float(match[0].group(1))
+                        origin_longitude = float(match[0].group(2))
+                        destination_latitude = float(match[1].group(1))
+                        destination_longitude = float(match[1].group(2))
+
+                        valid.set(on_convert(origin_latitude, origin_longitude,
+                                  destination_latitude, destination_longitude))
+
+                    if valid():
+                        ui.notification_show(
+                            f"✅ The coordinates have been updated", duration=3, type="default")
+                    else:
+                        raise Exception
+                except Exception as e:
+                    logging.error(
+                        f"Oops, update_coordinates_from_url says an error occured converting maps url to coordinates: {e}")
+                    ui.notification_show(
+                        f"Error: {e}", duration=3, type="error")
+                    ui.notification_show(
+                        "🚨 Could not convert url to coordinates. Try again!", duration=6, type="error")
+
+                finally:
+                    ui.modal_remove()
+
+            # Rest coordinates back to Kenyan region
+            ui.input_action_button(
+                "reset", "Back to Nairobi", icon=icon_svg("crosshairs"))
+
+            # Trip Distance feature
+            ui.input_numeric("trip_distance", "Trip Distance (meters)",
+                             value=1, min=1, max=600000, step=10)
+            ui.input_switch("manual_distance",
+                            "Use manual distance", False),
+
+            # Date feature
+            ui.input_date("date", "Select a Date")
+            ui.help_text("Select the UTC time")
+            ui.input_select("hours", "24-hour",
+                            choices=HOURS, selected=HOURS[0])
+            ui.input_select("minutes", "Minutes",
+                            choices=MINUTES, selected=MINUTES[0])
+            ui.input_select("seconds", "Seconds",
+                            choices=SECONDS, selected=SECONDS[0])
+
+            # Select model
+            ui.input_selectize(
+                "modelname",
+                "Choose a model",
+                choices=ALL_MODELS,
+                selected="XGBRegressor",
+            )
+
+            # Base map
+            ui.input_selectize(
+                "basemap",
+                "Choose a basemap",
+                choices=list(BASEMAPS.keys()),
+                selected="Mapnik",
+            )
+
+        # Top 3 cards
+        with ui.layout_column_wrap(fill=False):
+            with ui.value_box(showcase=icon_svg("route"), theme=BRANDTHEMES['purple-dark']):
+                "Trip Distance"
+
+                @render.text
+                def trip_dist_km():
+                    return f"{trip_distance()/1000:,.1f} km" if valid else ""
+
+                @render.text
+                def trip_dist_m():
+                    return f"{trip_distance():,.1f} m" if valid and trip_distance is not None else ""
+
+            with ui.value_box(showcase=icon_svg("egg"), theme=BRANDTHEMES['purple-dark']):
+                "Geodisic Distance"
+
+                @reactive.calc
+                def geo_dist():
+                    dist = geodesic(loc1xy(), loc2xy())
+                    return (f"{dist.meters:,.1f} m", f"{dist.kilometers:,.1f} km") if valid and trip_distance is not None else ""
+
+                @render.text
+                def geo_dist_km():
+                    return geo_dist()[1] if valid and trip_distance is not None else ""
+
+                @render.text
+                def geo_dist_m():
+                    return geo_dist()[0] if valid and trip_distance is not None else ""
+
+            with ui.value_box(showcase=icon_svg("clock"), theme=BRANDTHEMES['red']):
+                "Est. time of arrival"
+
+                @reactive.calc
+                async def eta():
+                    try:
+                        # print(valid())
+                        # print(notification_error())
+                        if validate_inputs(origin_lat(), origin_lon(), destination_lat(), destination_lon()) and valid():                        
+                            data: EtaFeatures = {
+                                'timestamp': [datetz()],
+                                'origin_lat': [origin_lat()],
+                                'origin_lon': [origin_lon()],
+                                'destination_lat': [destination_lat()],
+                                'destination_lon': [destination_lon()],
+                                'trip_distance': [trip_distance()]
+                            }
+
+                            eta_sec = await predict_eta(data, input.modelname())
+
+                            eta_hms = time.strftime(
+                                '%H:%M:%S', time.gmtime(eta_sec))
+
+                            ui.notification_show(
+                                f"⏰ ETA: {eta_hms} H:M:S", duration=6, type="default")
+
+                            return f"{eta_sec:,.0f} s", f"{eta_hms}"
+                        else:
+                            raise Exception
+                    except Exception as e:
+                        logging.error({e})
+                        ui.notification_show(
+                            "🚨 Could not predict Eta. Median eta is 1000 seconds", duration=3, type="error")
+                        return None
+
+                @render.text
+                async def eta_sec():
+                    text = await eta()
+                    return text[0] if text else ""
+
+                @render.text
+                async def eta_hms():
+                    text = await eta()
+                    return text[1] if text else ""
+
+                @render.express
+                def eta_info():
+                    with ui.tooltip(title="Google Maps ETA"):
+                        icon_svg("google")
+                        f"{trip_eta():,.0f} s | {time.strftime('%H:%M:%S', time.gmtime(trip_eta()))}"
+                        
+                    
+                    
+                    
+        # Map (2 indents)
+        with ui.card():
+            ui.card_header(
+                "💡 Map (drag the markers to change locations)")
+
+            @render_widget
+            def map():
+                return L.Map(zoom=9, center=(KENYA_LAT, KENYA_LON))
+
+    ######################################################
+    # Reactive values to store location information
+    origin_lat = reactive.value()
+    origin_lon = reactive.value()
+    destination_lat = reactive.value()
+    destination_lon = reactive.value()
+
+    valid = reactive.value()
+
+    # Reactive value to store trip_distance information
+    trip_distance = reactive.value()
+    trip_eta = reactive.value()
+
+    @reactive.effect(priority=100)
+    def _():
+        if (
+            validate_inputs(input.origin_lat(), input.origin_lon(),
+                            input.destination_lat(), input.destination_lon())
+            or
+            validate_inputs(origin_lat(), origin_lon(),
+                            destination_lat(), destination_lon())
+        ):
+            value = True
+        else:
+            value = False
+
+        valid.set(value)
+
+    @reactive.calc
+    def datetz():
+        return f"{input.date()}T{input.hours()}:{input.minutes()}:{input.seconds()}Z"
+
+    @reactive.effect
+    def _():
+        origin_lat.set(input.origin_lat()
+                       if valid else LOCATIONS["Nairobi"]['latitude'])
+        origin_lon.set(input.origin_lon()
+                       if valid else LOCATIONS["Nairobi"]['longitude'])
+        destination_lat.set(input.destination_lat(
+        ) if valid else LOCATIONS["National Museum of Kenya"]['latitude'])
+        destination_lon.set(input.destination_lon(
+        ) if valid else LOCATIONS["National Museum of Kenya"]['longitude'])
+
+        # Automate trip distance, eta from Google Maps
+        google_td, google_eta = google_maps_trip_distance_eta(loc1xy(), loc2xy())
+        if isinstance(google_td, float):
+            trip_distance.set(google_td)
+            trip_eta.set(google_eta)
+        else:
+            ui.notification_show(
+                            "🚨 Could not estimate trip distance. Using Geosidic distance...", duration=3, type="warning")
+            trip_distance.set(geo_dist())
+
+        # Manual
+        if input.manual_distance() and input.trip_distance() not in [0, None]:
+            trip_distance.set(input.trip_distance())
+
+    @reactive.effect
+    @reactive.event(trip_distance)
+    def _():
+        if valid():
+            # Update the trip distance input with current calculated or manual trip distance
+            ui.update_numeric("trip_distance", value=trip_distance())
+
+    @reactive.calc
+    def loc1xy():
+        return origin_lat(), origin_lon()
+
+    @reactive.calc
+    def loc2xy():
+        return destination_lat(), destination_lon()
+
+    # Add marker for first location
+
+    @reactive.effect
+    def _():
+        if valid():
+            update_marker(map.widget, loc1xy(), on_move1, "origin", icon=L.AwesomeIcon(
+                name='fa-map-marker', marker_color='darkpurple'))
+
+    # Add marker for second location
+
+    @reactive.effect
+    def _():
+        if valid():
+            update_marker(map.widget, loc2xy(), on_move2, "destination", icon=L.AwesomeIcon(
+                name='fa-map-marker', marker_color='purple'))
+
+    # Add line and fit bounds when either marker is moved
+
+    @reactive.effect
+    def _():
+        if valid():
+            update_line(map.widget, loc1xy(), loc2xy())
+
+    # If new bounds fall outside of the current view, fit the bounds if valid coordinates
+
+    @reactive.effect
+    def _():
+        # if valid():
+            l1 = loc1xy()
+            l2 = loc2xy()
+
+            lat_rng = [min(l1[0], l2[0]), max(l1[0], l2[0])]
+            lon_rng = [min(l1[1], l2[1]), max(l1[1], l2[1])]
+            new_bounds = [
+                [lat_rng[0], lon_rng[0]],
+                [lat_rng[1], lon_rng[1]],
+            ]
+
+            b = map.widget.bounds
+            if len(b) == 0:
+                map.widget.fit_bounds(new_bounds)
+            elif (
+                lat_min < b[0][0]
+                or lat_max > b[1][0]
+                or lon_min < b[0][1]
+                or lon_max > b[1][1]
+            ):
+                map.widget.fit_bounds(new_bounds)
+
+    # Update the basemap
+
+    @reactive.effect(priority=-100)  # The last effect that runs
+    def _():
+        if valid():
+            update_basemap(map.widget, input.basemap())
+
+    @reactive.effect(priority=95)
+    @reactive.event(input.reset)
+    def _():
+        back_to_nairobi()

utils/utils.py

@@ -1,169 +1,172 @@
-import json
-import requests
-import requests_cache as R
-from cachetools import TTLCache, cached
-
-from typing import Literal, Tuple, Optional
-
-import ipyleaflet as L
-from ipyleaflet import AwesomeIcon
-
-from shiny.express import ui
-
-from utils.config import MAPS_API_KEY, BRANDCOLORS, BASEMAPS, ONE_WEEK_SEC, LOCATIONS, TRIP_DISTANCE
-
-
-# Cache expires after 1 week
-# R.install_cache('/client/requests_cache/yassir_requests_cache',  expire_after=ONE_WEEK_SEC)  # Sqlite
-R.install_cache(backend='memory',  expire_after=ONE_WEEK_SEC)  # Sqlite
-
-
-# ---------------------------------------------------------------
-# Helper functions for map and location inputs on predict page
-# ---------------------------------------------------------------
-
-@cached(cache=TTLCache(maxsize=300, ttl=ONE_WEEK_SEC))  # Memory
-def get_bounds(country: str) -> Tuple[float]:
-    headers = {
-        'User-Agent': 'Yassir ETA Shiny App/1.0 ([email protected])'
-    }
-
-    response = requests.get(
-        f"http://nominatim.openstreetmap.org/search?q={country}&format=json", headers=headers)
-
-    boundingbox = json.loads(response.text)[0]["boundingbox"]
-
-    # Extract the bounds as float datatype
-    lat_min, lat_max, lon_min, lon_max = (float(b) for b in boundingbox)
-
-    return lat_min, lat_max, lon_min, lon_max
-
-
-@cached(cache=TTLCache(maxsize=3000, ttl=ONE_WEEK_SEC))  # Memory
-def google_maps_trip_distance(origin: tuple, destination: tuple) -> float:
-    """
-    The road distance calculated using Google Maps distance matrix api with the driving car is the shortest 
-    or optimal road distance based on the available road data and routing algorithm.
-
-    origin is a tuple of lat, lon
-    destination is a tuple of lat, lon
-    
-    Returns: the calculiated trip distance or a default value
-    """
-
-    # Google Maps API URL
-    url = f"https://maps.googleapis.com/maps/api/distancematrix/json?origins={origin[0]},{origin[1]}&destinations={destination[0]},{destination[1]}&key={MAPS_API_KEY}"
-
-
-    # Send request
-    response = requests.get(url)
-
-    if response.status_code == 200:
-        # Decode the response
-        data = response.json()
-    
-        # Extract distance information
-        if "rows" in data and len(data["rows"]) > 0:
-            distance_info = data["rows"][0]["elements"][0]["distance"]
-            distance = float(distance_info['value'])
-        else:
-            distance = TRIP_DISTANCE # Default
-            back_to_nairobi()
-    else:
-        distance = TRIP_DISTANCE # Default
-        # print(response.status_code)
-        back_to_nairobi()
-
-    return distance
-
-
-def update_marker(map: L.Map, loc: tuple, on_move: object, name: str, icon: AwesomeIcon):
-    remove_layer(map, name)
-    m = L.Marker(location=loc, draggable=True, name=name, icon=icon)
-    m.on_move(on_move)
-    map.add_layer(m)
-
-
-def update_line(map: L.Map, loc1: tuple, loc2: tuple):
-    remove_layer(map, "line")
-    map.add_layer(
-        L.Polyline(locations=[loc1, loc2],
-                   color=BRANDCOLORS['red'], weight=3, name="line")
-    )
-
-
-def update_basemap(map: L.Map, basemap: str):
-    for layer in map.layers:
-        if isinstance(layer, L.TileLayer):
-            map.remove_layer(layer)
-    map.add_layer(L.basemap_to_tiles(BASEMAPS[basemap]))
-
-
-def remove_layer(map: L.Map, name: str):
-    for layer in map.layers:
-        if layer.name == name:
-            map.remove_layer(layer)
-
-
-def on_move1(**kwargs):
-    return on_move("origin", **kwargs)
-
-
-def on_move2(**kwargs):
-    return on_move("destination", **kwargs)
-
-# When the markers are moved, update the numeric location inputs to include the new
-# location (which results in the locations() reactive value getting updated,
-# which invalidates any downstream reactivity that depends on it)
-
-
-def on_move(loc_type: Literal['origin', 'destination'], **kwargs):
-    location = kwargs["location"]
-    loc_lat, loc_lon = location
-
-    ui.update_numeric(f"{loc_type}_lat", value=loc_lat)
-    ui.update_numeric(f"{loc_type}_lon", value=loc_lon)
-
-    # origin_lat
-    # origin_lon
-    # destination_lat
-    # destination_lon
-
-    # Re-center to Kenya region
-
-
-def back_to_nairobi():
-    ui.update_numeric("origin_lat", value=LOCATIONS["Nairobi"]['latitude'])
-    ui.update_numeric(
-        "origin_lon", value=LOCATIONS["Nairobi"]['longitude'])
-    ui.update_numeric(
-        "destination_lat", value=LOCATIONS["National Museum of Kenya"]['latitude'])
-    ui.update_numeric(
-        "destination_lon", value=LOCATIONS["National Museum of Kenya"]['longitude'])
-
-
-def validate_inputs(origin_lat: float = None, origin_lon: float = None, destination_lat: float = None, destination_lon: float = None) -> bool:
-    lat_min, lat_max, lon_min, lon_max = get_bounds(country='Kenya')
-
-    valid = True
-    
-    for lat, lon in [(origin_lat, origin_lon), (destination_lat, destination_lon)]:
-        if lat is not None and lon is not None:
-            if (lat < lat_min or lat > lat_max) or (lon < lon_min or lon > lon_max):
-                ui.notification_show(
-                    "😮 Location is outside Kenya, taking you back to Nairobi", type="error")
-                valid = False
-                back_to_nairobi()
-                break
-
-
-    return valid
-
-
-# Footer
-footer = ui.tags.footer(
-    ui.tags.div(
-        "© 2024. Made with 💖",
-        style=f"text-align: center; padding: 10px; color: #fff; background-color: {BRANDCOLORS['purple-dark']}; margin-top: 50px;"
-    )
-)
+import json
+import requests
+import requests_cache as R
+from cachetools import TTLCache, cached
+
+from typing import Literal, Tuple, Optional
+
+import ipyleaflet as L
+from ipyleaflet import AwesomeIcon
+
+from shiny.express import ui
+
+from utils.config import MAPS_API_KEY, BRANDCOLORS, BASEMAPS, ONE_WEEK_SEC, LOCATIONS, TRIP_DISTANCE, ETA
+
+
+# Cache expires after 1 week
+# R.install_cache('yassir_requests_cache',  expire_after=ONE_WEEK_SEC)  # Sqlite
+
+
+# ---------------------------------------------------------------
+# Helper functions for map and location inputs on predict page
+# ---------------------------------------------------------------
+
+# @cached(cache=TTLCache(maxsize=300, ttl=ONE_WEEK_SEC))  # Memory
+def get_bounds(country: str) -> Tuple[float]:
+    headers = {
+        'User-Agent': 'Yassir ETA Shiny App/1.0 ([email protected])'
+    }
+
+    response = requests.get(
+        f"http://nominatim.openstreetmap.org/search?q={country}&format=json", headers=headers)
+
+    boundingbox = json.loads(response.text)[0]["boundingbox"]
+
+    # Extract the bounds as float datatype
+    lat_min, lat_max, lon_min, lon_max = (float(b) for b in boundingbox)
+
+    return lat_min, lat_max, lon_min, lon_max
+
+
+# @cached(cache=TTLCache(maxsize=3000, ttl=ONE_WEEK_SEC))  # Memory
+def google_maps_trip_distance_eta(origin: Tuple[float], destination: Tuple[float]) -> Tuple[float]:
+    """
+    The road distance calculated using Google Maps distance matrix api with the driving car is the shortest 
+    or optimal road distance based on the available road data and routing algorithm.
+
+    origin is a tuple of lat, lon
+    destination is a tuple of lat, lon
+    
+    Returns: the calculiated trip distance or a default value
+    """
+
+    # Google Maps API URL
+    url = f"https://maps.googleapis.com/maps/api/distancematrix/json?origins={origin[0]},{origin[1]}&destinations={destination[0]},{destination[1]}&key={MAPS_API_KEY}"
+
+
+    # Send request
+    response = requests.get(url)
+    
+
+    if response.status_code == 200:
+        # Decode the response
+        data = response.json()
+    
+        # Extract distance information
+        if "rows" in data and len(data["rows"]) > 0:
+            distance_info = data["rows"][0]["elements"][0]["distance"]
+            eta_info = data["rows"][0]["elements"][0]["duration"]
+            distance = float(distance_info['value'])
+            eta = float(eta_info['value'])
+        else:
+            distance = TRIP_DISTANCE # Default
+            back_to_nairobi()
+    else:
+        distance = TRIP_DISTANCE # Default
+        eta = ETA # Default
+    
+        back_to_nairobi()
+
+    return distance, eta
+
+
+def update_marker(map: L.Map, loc: tuple, on_move: object, name: str, icon: AwesomeIcon):
+    remove_layer(map, name)
+    m = L.Marker(location=loc, draggable=True, name=name, icon=icon)
+    m.on_move(on_move)
+    map.add_layer(m)
+
+
+def update_line(map: L.Map, loc1: tuple, loc2: tuple):
+    remove_layer(map, "line")
+    map.add_layer(
+        L.Polyline(locations=[loc1, loc2],
+                   color=BRANDCOLORS['red'], weight=3, name="line")
+    )
+
+
+def update_basemap(map: L.Map, basemap: str):
+    for layer in map.layers:
+        if isinstance(layer, L.TileLayer):
+            map.remove_layer(layer)
+    map.add_layer(L.basemap_to_tiles(BASEMAPS[basemap]))
+
+
+def remove_layer(map: L.Map, name: str):
+    for layer in map.layers:
+        if layer.name == name:
+            map.remove_layer(layer)
+
+
+def on_move1(**kwargs):
+    return on_move("origin", **kwargs)
+
+
+def on_move2(**kwargs):
+    return on_move("destination", **kwargs)
+
+# When the markers are moved, update the numeric location inputs to include the new
+# location (which results in the locations() reactive value getting updated,
+# which invalidates any downstream reactivity that depends on it)
+
+
+def on_move(loc_type: Literal['origin', 'destination'], **kwargs):
+    location = kwargs["location"]
+    loc_lat, loc_lon = location
+
+    ui.update_numeric(f"{loc_type}_lat", value=loc_lat)
+    ui.update_numeric(f"{loc_type}_lon", value=loc_lon)
+
+    # origin_lat
+    # origin_lon
+    # destination_lat
+    # destination_lon
+
+    # Re-center to Kenya region
+
+
+def back_to_nairobi():
+    ui.update_numeric("origin_lat", value=LOCATIONS["Nairobi"]['latitude'])
+    ui.update_numeric(
+        "origin_lon", value=LOCATIONS["Nairobi"]['longitude'])
+    ui.update_numeric(
+        "destination_lat", value=LOCATIONS["National Museum of Kenya"]['latitude'])
+    ui.update_numeric(
+        "destination_lon", value=LOCATIONS["National Museum of Kenya"]['longitude'])
+
+
+def validate_inputs(origin_lat: float = None, origin_lon: float = None, destination_lat: float = None, destination_lon: float = None) -> bool:
+    lat_min, lat_max, lon_min, lon_max = get_bounds(country='Kenya')
+
+    valid = True
+    
+    for lat, lon in [(origin_lat, origin_lon), (destination_lat, destination_lon)]:
+        if lat is not None and lon is not None:
+            if (lat < lat_min or lat > lat_max) or (lon < lon_min or lon > lon_max):
+                ui.notification_show(
+                    "😮 Location is outside Kenya, taking you back to Nairobi", type="error")
+                valid = False
+                back_to_nairobi()
+                break
+
+
+    return valid
+
+
+# Footer
+footer = ui.tags.footer(
+    ui.tags.div(
+        "© 2024. Made with 💖",
+        style=f"text-align: center; padding: 10px; color: #fff; background-color: {BRANDCOLORS['purple-dark']}; margin-top: 50px;"
+    )
+)