diff --git a/apps/onelauncher/frontend/src/hooks/useBrowser.tsx b/apps/onelauncher/frontend/src/hooks/useBrowser.tsx
index 20ce789b..522af87b 100644
--- a/apps/onelauncher/frontend/src/hooks/useBrowser.tsx
+++ b/apps/onelauncher/frontend/src/hooks/useBrowser.tsx
@@ -1,9 +1,10 @@
-import type { ClusterModel, Paginated, Provider, SearchQuery, SearchResult } from '@/bindings.gen';
+import type { ClusterModel, GameLoader, ManagedPackage, ManagedVersion, Paginated, Provider, SearchQuery, SearchResult } from '@/bindings.gen';
 import type { UndefinedInitialDataOptions } from '@tanstack/react-query';
 import { bindings } from '@/main';
 import { PROVIDERS } from '@/utils';
 import { useCommand } from '@onelauncher/common';
 import { createContext, useContext, useEffect, useMemo, useState } from 'react';
+import { useNavigate } from '@tanstack/react-router';
 
 export interface BrowserControllerType {
 	cluster: ClusterModel | undefined;
@@ -28,6 +29,7 @@ export function BrowserProvider(props: any) {
 	const { children } = props;
 	const [cluster, setCluster] = useState<ClusterModel | undefined>(undefined);
 	const [provider, setProvider] = useState<Provider>(PROVIDERS[0]);
+	const navigate = useNavigate()
 	const [query, setQuery] = useState<SearchQuery>({
 		filters: null,
 		query: null,
@@ -36,6 +38,11 @@ export function BrowserProvider(props: any) {
 		sort: null,
 	});
 
+	useEffect(()=>{
+		if(query.filters?.categories || query.query)
+			navigate({to: "/app/browser/search"})
+	},[query])
+
 	const context = useMemo<BrowserControllerType>(() => ({
 		cluster,
 		setCluster,
@@ -57,3 +64,11 @@ export function useBrowserSearch(provider: Provider, query: SearchQuery, options
 	const validFilters = useMemo(() => Object.values(query.filters ?? {}).filter(a => a).length > 0, [query.filters]);
 	return useCommand('searchPackages', () => bindings.core.searchPackages(provider, validFilters ? query : { ...query, filters: null }), options);
 }
+
+export function usePackageData(provider: Provider, slug: string, options?: Omit<UndefinedInitialDataOptions<ManagedPackage>, "queryKey" | "queryFn"> | undefined){
+	return useCommand("getPackage", () => bindings.core.getPackage(provider, slug), options)
+}
+
+export function usePackageVersions(provider: Provider, slug: string, {mc_versions, loaders, offset, limit, ...options}:{mc_versions?:Array<string>|null, loaders?:Array<GameLoader>|null, offset?:number, limit: number} & Omit<UndefinedInitialDataOptions<Paginated<ManagedVersion>>, "queryKey" | "queryFn">){
+	return useCommand("getPackageVersions", ()=>bindings.core.getPackageVersions(provider, slug, mc_versions??null, loaders??null, (offset??0) as unknown as bigint, limit as unknown as bigint), options)
+}
diff --git a/apps/onelauncher/frontend/src/routes/app/browser/search.tsx b/apps/onelauncher/frontend/src/routes/app/browser/search.tsx
index aec3657f..d02f5caa 100644
--- a/apps/onelauncher/frontend/src/routes/app/browser/search.tsx
+++ b/apps/onelauncher/frontend/src/routes/app/browser/search.tsx
@@ -25,11 +25,15 @@ function Search() {
 	});
 	useEffect(() => {
 		search.refetch();
-	}, [context.provider, context.query]);
+	}, [context.provider, context.query, context.cluster]);
 
 	return (
-		<Show when={search.isSuccess}>
-			<PackageGrid items={search.data!.items} provider={context.provider} />
-		</Show>
+		<>
+			{
+			search.data
+				? <PackageGrid items={search.data.items} provider={context.provider} />
+				: <h1>Loading</h1>
+			}
+		</>
 	);
 }