Fix bug with repository snapshot

This commit is contained in:
bkellam 2025-02-27 12:03:35 -08:00
parent fcf0b836ee
commit 85d7b1e098
2 changed files with 55 additions and 64 deletions

View file

@ -13,63 +13,9 @@ import {
CarouselContent,
CarouselItem,
} from "@/components/ui/carousel";
import { Plus } from "lucide-react";
import { RepoIndexingStatus } from "@sourcebot/db";
import { SymbolIcon } from "@radix-ui/react-icons";
export function EmptyRepoState({ domain }: { domain: string }) {
return (
<div className="flex flex-col items-center gap-3">
<span className="text-sm">No repositories found</span>
<div className="w-full max-w-lg">
<div className="flex flex-row items-center gap-2 border rounded-md p-4 justify-center">
<span className="text-sm text-muted-foreground">
Create a{" "}
<Link href={`/${domain}/connections`} className="text-blue-500 hover:underline inline-flex items-center gap-1">
connection
</Link>{" "}
to start indexing repositories
</span>
</div>
</div>
</div>
)
}
export default function RepoSkeleton() {
return (
<div className="flex flex-col items-center gap-3">
{/* Skeleton for "Search X repositories" text */}
<div className="flex items-center gap-1 text-sm">
<Skeleton className="h-4 w-14" /> {/* "Search X" */}
<Skeleton className="h-4 w-24" /> {/* "repositories" */}
</div>
{/* Skeleton for repository carousel */}
<Carousel
opts={{
align: "start",
loop: true,
}}
className="w-full max-w-lg"
>
<CarouselContent>
{[1, 2, 3].map((_, index) => (
<CarouselItem key={index} className="basis-auto">
<div className="flex flex-row items-center gap-2 border rounded-md p-2">
<Skeleton className="h-4 w-4 rounded-sm" /> {/* Icon */}
<Skeleton className="h-4 w-32" /> {/* Repository name */}
</div>
</CarouselItem>
))}
</CarouselContent>
</Carousel>
</div>
)
}
export function RepositorySnapshot() {
const domain = useDomain();
@ -88,7 +34,7 @@ export function RepositorySnapshot() {
}
const indexedRepos = repos.filter((repo) => repo.repoIndexingStatus === RepoIndexingStatus.INDEXED);
if (repos.length === 0 || indexedRepos.length === 0) {
if (repos.length === 0) {
return (
<EmptyRepoState domain={domain} />
)
@ -119,4 +65,56 @@ export function RepositorySnapshot() {
<RepositoryCarousel repos={indexedRepos} />
</div>
)
}
}
function EmptyRepoState({ domain }: { domain: string }) {
return (
<div className="flex flex-col items-center gap-3">
<span className="text-sm">No repositories found</span>
<div className="w-full max-w-lg">
<div className="flex flex-row items-center gap-2 border rounded-md p-4 justify-center">
<span className="text-sm text-muted-foreground">
Create a{" "}
<Link href={`/${domain}/connections`} className="text-blue-500 hover:underline inline-flex items-center gap-1">
connection
</Link>{" "}
to start indexing repositories
</span>
</div>
</div>
</div>
)
}
function RepoSkeleton() {
return (
<div className="flex flex-col items-center gap-3">
{/* Skeleton for "Search X repositories" text */}
<div className="flex items-center gap-1 text-sm">
<Skeleton className="h-4 w-14" /> {/* "Search X" */}
<Skeleton className="h-4 w-24" /> {/* "repositories" */}
</div>
{/* Skeleton for repository carousel */}
<Carousel
opts={{
align: "start",
loop: true,
}}
className="w-full max-w-lg"
>
<CarouselContent>
{[1, 2, 3].map((_, index) => (
<CarouselItem key={index} className="basis-auto">
<div className="flex flex-row items-center gap-2 border rounded-md p-2">
<Skeleton className="h-4 w-4 rounded-sm" /> {/* Icon */}
<Skeleton className="h-4 w-32" /> {/* Repository name */}
</div>
</CarouselItem>
))}
</CarouselContent>
</Carousel>
</div>
)
}

View file

@ -1,11 +1,6 @@
import { listRepositories } from "@/lib/server/searchService";
import { isServiceError } from "@/lib/utils";
import { Suspense } from "react";
import { NavigationMenu } from "./components/navigationMenu";
import { RepositoryCarousel } from "./components/repositoryCarousel";
import { SearchBar } from "./components/searchBar";
import { Separator } from "@/components/ui/separator";
import { SymbolIcon } from "@radix-ui/react-icons";
import { UpgradeToast } from "./components/upgradeToast";
import Link from "next/link";
import { getOrgFromDomain } from "@/data/org";
@ -37,9 +32,7 @@ export default async function Home({ params: { domain } }: { params: { domain: s
className="mt-4 w-full max-w-[800px]"
/>
<div className="mt-8">
<Suspense fallback={<div>...</div>}>
<RepositorySnapshot />
</Suspense>
<RepositorySnapshot />
</div>
<div className="flex flex-col items-center w-fit gap-6">
<Separator className="mt-5" />