Merge pull request #151 from ddxv/main

Bugfix for Search bar in menu

Author: ddxv

backend/api_app/controllers/apps.py

@@ -79,6 +79,8 @@ def get_search_results(state: State, search_term: str) -> AppGroupByStore:
     if decoded_input[-1] == "+":
         decoded_input = decoded_input[:-1]
     df = search_apps(state, search_input=decoded_input, limit=60)
+    logger.info(df)
+    logger.info(df.columns)
     df = extend_app_icon_url(df)
     logger.info(f"{decoded_input=} returned rows: {df.shape[0]}")
     apple_apps_dict: list[AppDetail] = df[df["store"].str.startswith("Apple")].to_dict(

backend/api_app/utils.py

@@ -1,27 +1,21 @@
 """Utility functions for the api_app package."""
 
-import numpy as np
 import pandas as pd
 
 
 def extend_app_icon_url(df: pd.DataFrame) -> pd.DataFrame:
     """Extend the app icon url."""
-    if "icon_url_512" in df.columns:
-        df["app_icon_url"] = np.where(
-            df["icon_url_100"].notna(),
-            "https://media.appgoblin.info/app-icons/"
-            + df["store_id"]
-            + "/"
-            + df["icon_url_100"],
-            df["icon_url_512"],
-        )
-    else:
-        df["app_icon_url"] = np.where(
-            df["icon_url_100"].notna(),
-            "https://media.appgoblin.info/app-icons/"
-            + df["store_id"]
-            + "/"
-            + df["icon_url_100"],
-            None,
-        )
+    if df.empty:
+        df["app_icon_url"] = None
+        return df
+
+    has_icon_url = df["icon_url_100"].notna()
+    df["app_icon_url"] = None
+
+    if has_icon_url.any():
+        prefix = "https://media.appgoblin.info/app-icons/"
+        store_ids = df.loc[has_icon_url, "store_id"].astype("object")
+        icon_paths = df.loc[has_icon_url, "icon_url_100"].astype("object")
+        df.loc[has_icon_url, "app_icon_url"] = prefix + store_ids + "/" + icon_paths
+
     return df

backend/dbcon/sql/query_search_apps.sql

@@ -31,7 +31,6 @@ SELECT
     name,
     developer_name,
     icon_url_100,
-    icon_url_512,
     featured_image_url,
     installs,
     rating,

backend/dbcon/sql/query_search_devs.sql

@@ -18,7 +18,6 @@ SELECT
    a.store_id,
    a.name,
    a.icon_url_100,
-   a.icon_url_512,
    a.featured_image_url,
    agml.total_installs AS installs,
    agml.rating,

backend/dbcon/sql/query_single_developer.sql

@@ -47,7 +47,6 @@ SELECT
     sa.installs,
     sa.rating_count,
     sa.icon_url_100,
-    sa.icon_url_512,
     sa.featured_image_url,
     sa.tablet_image_url_1,
     sa.category AS app_category,

frontend/src/routes/+layout.svelte

@@ -2,7 +2,6 @@
 	import '../app.css';
 	import { page } from '$app/state';
 	import { Menu, Portal } from '@skeletonlabs/skeleton-svelte';
-	import { invalidate } from '$app/navigation';
 
 	import IconSearch from '$lib/svg/IconSearch.svelte';
 	import MenuIcon from 'lucide-svelte/icons/menu';
@@ -12,20 +11,6 @@
 	import LoginAccountButton from '$lib/LoginAccountButton.svelte';
 	import NavTabs from '$lib/NavTabs.svelte';
 
-	import { goto } from '$app/navigation';
-
-	let searchTerm: string = $state('');
-
-	function navigateToSearch(event: any) {
-		if (event.key === 'Enter' && searchTerm.trim() !== '') {
-			// Replace spaces with '+'
-			const encodedSearchTerm = encodeURIComponent(searchTerm.replace(/\s+/g, '+'));
-
-			// Navigate to the search route
-			goto(`/search/${encodedSearchTerm}`);
-		}
-	}
-
 	let { children } = $props();
 </script>
 
@@ -55,25 +40,23 @@
 
 				<AppBar.Trail class="overflow-hidden flex justify-end">
 					<div class="flex gap-1 md:gap-2">
-						<div class="input-group grid-cols-[auto_1fr_auto]">
-							<div class="ig-cell preset-tonal p-2 md:p-4">
-								<IconSearch />
-							</div>
-							<input
-								class="ig-input md:hidden"
-								type="search"
-								placeholder="Search Apps..."
-								bind:value={searchTerm}
-								onkeydown={navigateToSearch}
-							/>
+						<form
+							action="/search"
+							method="GET"
+							class="input-group grid-cols-[1fr_auto]"
+							role="search"
+						>
 							<input
-								class="ig-input hidden md:block"
+								class="ig-input"
 								type="search"
+								name="term"
 								placeholder="Search Apps & Companies"
-								bind:value={searchTerm}
-								onkeydown={navigateToSearch}
+								required
 							/>
-						</div>
+							<button class="ig-cell preset-tonal p-2 md:p-4" type="submit" aria-label="Search">
+								<IconSearch />
+							</button>
+						</form>
 
 						<LoginAccountButton />
 					</div>

frontend/src/routes/search/[term]/+page.svelte

@@ -10,7 +10,7 @@
 	}
 
 	let { data }: Props = $props();
-	let searchTerm: string | null = $state(page.params.term || '');
+	const searchTerm = $derived(page.params.term || '');
 
 	// App store filter state
 	type AppStore = 'apple' | 'google';