mirror of
https://github.com/sourcebot-dev/sourcebot.git
synced 2025-12-13 04:45:19 +00:00
Fix bug with repository snapshot
This commit is contained in:
parent
fcf0b836ee
commit
85d7b1e098
2 changed files with 55 additions and 64 deletions
|
|
@ -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>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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" />
|
||||
|
|
|
|||
Loading…
Reference in a new issue