Uh oh!
There was an error while loading. Please reload this page.
- Notifications
You must be signed in to change notification settings - Fork 364
fix: Fix repo carousel thrashing#294
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Uh oh!
There was an error while loading. Please reload this page.
Changes from all commits
File filter
Filter by extension
Conversations
Uh oh!
There was an error while loading. Please reload this page.
Jump to
Uh oh!
There was an error while loading. Please reload this page.
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -15,14 +15,24 @@ import { | ||
| } from "@/components/ui/carousel"; | ||
| import { RepoIndexingStatus } from "@sourcebot/db"; | ||
| import { SymbolIcon } from "@radix-ui/react-icons"; | ||
| import { RepositoryQuery } from "@/lib/types"; | ||
| export function RepositorySnapshot({ authEnabled }: { authEnabled: boolean }) { | ||
| interface RepositorySnapshotProps { | ||
| authEnabled: boolean; | ||
| repos: RepositoryQuery[]; | ||
| } | ||
| export function RepositorySnapshot({ | ||
| authEnabled, | ||
| repos: initialRepos, | ||
| }: RepositorySnapshotProps) { | ||
| const domain = useDomain(); | ||
| const { data: repos, isPending, isError } = useQuery({ | ||
| queryKey: ['repos', domain], | ||
| queryFn: () => unwrapServiceError(getRepos(domain)), | ||
| refetchInterval: env.NEXT_PUBLIC_POLLING_INTERVAL_MS, | ||
| placeholderData: initialRepos, | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| }); | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| if (isPending || isError || !repos) { | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| @@ -33,22 +43,30 @@ export function RepositorySnapshot({ authEnabled }: { authEnabled: boolean }) { | ||
| ) | ||
| } | ||
| const numIndexedRepos = repos.filter((repo) => repo.repoIndexingStatus === RepoIndexingStatus.INDEXED).length; | ||
| const numIndexingRepos = repos.filter((repo) => repo.repoIndexingStatus === RepoIndexingStatus.INDEXING || repo.repoIndexingStatus === RepoIndexingStatus.IN_INDEX_QUEUE).length; | ||
| if (numIndexedRepos === 0 && numIndexingRepos > 0) { | ||
| return ( | ||
| <div className="flex flex-row items-center gap-3"> | ||
| <SymbolIcon className="h-4 w-4 animate-spin" /> | ||
| <span className="text-sm">indexing in progress...</span> | ||
| </div> | ||
| ) | ||
| } else if (numIndexedRepos == 0) { | ||
| return ( | ||
| <EmptyRepoState domain={domain} authEnabled={authEnabled} /> | ||
| ) | ||
| // Use `indexedAt` to determine if a repo has __ever__ been indexed. | ||
| // The repo indexing status only tells us the repo's current indexing status. | ||
| const indexedRepos = repos.filter((repo) => repo.indexedAt !== undefined); | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| // If there are no indexed repos... | ||
| if (indexedRepos.length === 0) { | ||
| // ... show a loading state if repos are being indexed now | ||
| if (repos.some((repo) => repo.repoIndexingStatus === RepoIndexingStatus.INDEXING || repo.repoIndexingStatus === RepoIndexingStatus.IN_INDEX_QUEUE)) { | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| return ( | ||
| <div className="flex flex-row items-center gap-3"> | ||
| <SymbolIcon className="h-4 w-4 animate-spin" /> | ||
| <span className="text-sm">indexing in progress...</span> | ||
| </div> | ||
| ) | ||
| // ... otherwise, show the empty state. | ||
| } else { | ||
| return ( | ||
| <EmptyRepoState domain={domain} authEnabled={authEnabled} /> | ||
| ) | ||
| } | ||
| } | ||
| const indexedRepos = repos.filter((repo) => repo.repoIndexingStatus === RepoIndexingStatus.INDEXED); | ||
| return ( | ||
| <div className="flex flex-col items-center gap-3"> | ||
| <span className="text-sm"> | ||
| @@ -57,7 +75,7 @@ export function RepositorySnapshot({ authEnabled }: { authEnabled: boolean }) { | ||
| href={`${domain}/repos`} | ||
| className="text-blue-500" | ||
| > | ||
| {repos.length > 1 ? 'repositories' : 'repository'} | ||
| {indexedRepos.length > 1 ? 'repositories' : 'repository'} | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| </Link> | ||
| </span> | ||
| <RepositoryCarousel repos={indexedRepos} /> | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -10,13 +10,17 @@ import { SourcebotLogo } from "../components/sourcebotLogo"; | ||
| import { RepositorySnapshot } from "./components/repositorySnapshot"; | ||
| import { SyntaxReferenceGuideHint } from "./components/syntaxReferenceGuideHint"; | ||
| import { env } from '@/env.mjs'; | ||
| import { getRepos } from "@/actions"; | ||
| import { isServiceError } from "@/lib/utils"; | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| export default async function Home({ params: { domain } }: { params: { domain: string } }) { | ||
| const org = await getOrgFromDomain(domain); | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| if (!org) { | ||
| return <PageNotFound /> | ||
| } | ||
| const repos = await getRepos(domain); | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| return ( | ||
| <div className="flex flex-col items-center overflow-hidden min-h-screen"> | ||
| <NavigationMenu | ||
| @@ -34,7 +38,10 @@ export default async function Home({ params: { domain } }: { params: { domain: s | ||
| className="mt-4 w-full max-w-[800px]" | ||
| /> | ||
| <div className="mt-8"> | ||
| <RepositorySnapshot authEnabled={env.SOURCEBOT_AUTH_ENABLED === 'true'} /> | ||
| <RepositorySnapshot | ||
| authEnabled={env.SOURCEBOT_AUTH_ENABLED === 'true'} | ||
| repos={isServiceError(repos) ? [] : repos} | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| /> | ||
brendan-kellam marked this conversation as resolved.
Uh oh!There was an error while loading. Please reload this page. | ||
| </div> | ||
| <div className="flex flex-col items-center w-fit gap-6"> | ||
| <Separator className="mt-5" /> | ||
Uh oh!
There was an error while loading. Please reload this page.