fix header on top of screen

This commit is contained in:
bkellam 2024-08-24 22:09:31 -07:00
parent 898b329fc9
commit ebb68146bc

View file

@ -58,36 +58,38 @@ export default function Home() {
// Currently we do not re-query. // Currently we do not re-query.
return ( return (
<main className="flex h-screen flex-col"> <main className="flex flex-col">
<div className="flex flex-row p-1 gap-4 items-center"> <div className="sticky top-0 left-0 right-0 bg-white z-10">
<Image <div className="flex flex-row p-1 gap-4 items-center">
src={logo} <Image
className="h-12 w-auto" src={logo}
alt={"Sourcebot logo"} className="h-12 w-auto"
/> alt={"Sourcebot logo"}
<SearchBar />
query={query} <SearchBar
numResults={numResults} query={query}
onQueryChange={(query) => setQuery(query)} numResults={numResults}
onLoadingChange={(isLoading) => setIsLoading(isLoading)} onQueryChange={(query) => setQuery(query)}
onSearchResult={(result) => { onLoadingChange={(isLoading) => setIsLoading(isLoading)}
if (result) { onSearchResult={(result) => {
setFileMatches(result.FileMatches ?? []); if (result) {
setSearchDurationMs(Math.round(result.Stats.Duration / 1000000)); setFileMatches(result.FileMatches ?? []);
} setSearchDurationMs(Math.round(result.Stats.Duration / 1000000));
}
router.push(`?query=${query}&numResults=${numResults}`); router.push(`?query=${query}&numResults=${numResults}`);
}} }}
/> />
{isLoading && ( {isLoading && (
<SymbolIcon className="h-4 w-4 animate-spin" /> <SymbolIcon className="h-4 w-4 animate-spin" />
)} )}
</div>
<Separator />
<div className="bg-accent p-2">
<p className="text-sm font-medium">Results for: {fileMatches.length} files in {searchDurationMs} ms</p>
</div>
<Separator />
</div> </div>
<Separator />
<div className="bg-accent p-2">
<p className="text-sm font-medium">Results for: {fileMatches.length} files in {searchDurationMs} ms</p>
</div>
<Separator />
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
{fileMatches.map((match, index) => ( {fileMatches.map((match, index) => (
<FileMatch key={index} match={match} /> <FileMatch key={index} match={match} />