repository table

Author: brendan-kellam

packages/web/src/app/[domain]/components/navigationMenu/navigationItems.tsx

@@ -2,7 +2,6 @@
 
 import { NavigationMenuItem, NavigationMenuLink, NavigationMenuList, navigationMenuTriggerStyle } from "@/components/ui/navigation-menu";
 import { Badge } from "@/components/ui/badge";
-import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { cn, getShortenedNumberDisplayString } from "@/lib/utils";
 import { SearchIcon, MessageCircleIcon, BookMarkedIcon, SettingsIcon, CircleIcon } from "lucide-react";
 import { usePathname } from "next/navigation";

packages/web/src/app/[domain]/components/navigationMenu/progressIndicator.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import { useToast } from "@/components/hooks/use-toast";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Separator } from "@/components/ui/separator";
@@ -25,6 +26,7 @@ export const ProgressIndicator = ({
 }: ProgressIndicatorProps) => {
     const domain = useDomain();
     const router = useRouter();
+    const { toast } = useToast();
 
     if (numRepos === 0) {
         return null;
@@ -51,6 +53,9 @@ export const ProgressIndicator = ({
                         className="h-6 w-6 text-muted-foreground"
                         onClick={() => {
                             router.refresh();
+                            toast({
+                                description: "Page refreshed",
+                            });
                         }}
                     >
                         <RefreshCwIcon className="w-3 h-3" />
@@ -105,14 +110,13 @@ const RepoItem = ({ repo }: { repo: RepositoryQuery }) => {
 
 
     return (
-        <Link
-            href={'/'}
+        <div
             className={clsx("flex flex-row items-center gap-2 border rounded-md p-2 text-clip")}
         >
             {repoIcon}
             <span className="text-sm truncate">
                 {displayName}
             </span>
-        </Link>
+        </div>
     )
 }

packages/web/src/app/[domain]/repos/columns.tsx

@@ -2,72 +2,51 @@
 
 import { Button } from "@/components/ui/button"
 import type { ColumnDef } from "@tanstack/react-table"
-import { ArrowUpDown, Clock, Loader2, CheckCircle2, XCircle, Trash2, Check, ListFilter } from "lucide-react"
+import { ArrowUpDown, Clock, Loader2, CheckCircle2, Check, ListFilter } from "lucide-react"
 import Image from "next/image"
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
 import { cn, getRepoImageSrc } from "@/lib/utils"
-import { RepoIndexingStatus } from "@sourcebot/db";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@/components/ui/dropdown-menu"
 import Link from "next/link"
 import { getBrowsePath } from "../browse/hooks/utils"
 
+export type RepoStatus = 'syncing' | 'indexed' | 'not-indexed';
+
 export type RepositoryColumnInfo = {
     repoId: number
     repoName: string;
     repoDisplayName: string
     imageUrl?: string
-    repoIndexingStatus: RepoIndexingStatus
+    status: RepoStatus
     lastIndexed: string
 }
 
-const statusLabels = {
-    [RepoIndexingStatus.NEW]: "Queued",
-    [RepoIndexingStatus.IN_INDEX_QUEUE]: "Queued",
-    [RepoIndexingStatus.INDEXING]: "Indexing",
-    [RepoIndexingStatus.INDEXED]: "Indexed",
-    [RepoIndexingStatus.FAILED]: "Failed",
-    [RepoIndexingStatus.IN_GC_QUEUE]: "Deleting",
-    [RepoIndexingStatus.GARBAGE_COLLECTING]: "Deleting",
-    [RepoIndexingStatus.GARBAGE_COLLECTION_FAILED]: "Deletion Failed"
+const statusLabels: Record<RepoStatus, string> = {
+    'syncing': "Syncing",
+    'indexed': "Indexed",
+    'not-indexed': "Pending",
 };
 
-const StatusIndicator = ({ status }: { status: RepoIndexingStatus }) => {
+const StatusIndicator = ({ status }: { status: RepoStatus }) => {
     let icon = null
     let description = ""
     let className = ""
 
     switch (status) {
-        case RepoIndexingStatus.NEW:
-        case RepoIndexingStatus.IN_INDEX_QUEUE:
-            icon = <Clock className="h-3.5 w-3.5" />
-            description = "Repository is queued for indexing"
-            className = "text-yellow-600 bg-yellow-50 dark:bg-yellow-900/20 dark:text-yellow-400"
-            break
-        case RepoIndexingStatus.INDEXING:
+        case 'syncing':
             icon = <Loader2 className="h-3.5 w-3.5 animate-spin" />
-            description = "Repository is being indexed"
+            description = "Repository is currently syncing"
             className = "text-blue-600 bg-blue-50 dark:bg-blue-900/20 dark:text-blue-400"
             break
-        case RepoIndexingStatus.INDEXED:
+        case 'indexed':
             icon = <CheckCircle2 className="h-3.5 w-3.5" />
-            description = "Repository has been successfully indexed"
+            description = "Repository has been successfully indexed and is up to date"
             className = "text-green-600 bg-green-50 dark:bg-green-900/20 dark:text-green-400"
             break
-        case RepoIndexingStatus.FAILED:
-            icon = <XCircle className="h-3.5 w-3.5" />
-            description = "Repository indexing failed"
-            className = "text-red-600 bg-red-50 dark:bg-red-900/20 dark:text-red-400"
-            break
-        case RepoIndexingStatus.IN_GC_QUEUE:
-        case RepoIndexingStatus.GARBAGE_COLLECTING:
-            icon = <Trash2 className="h-3.5 w-3.5" />
-            description = "Repository is being deleted"
-            className = "text-gray-600 bg-gray-50 dark:bg-gray-900/20 dark:text-gray-400"
-            break
-        case RepoIndexingStatus.GARBAGE_COLLECTION_FAILED:
-            icon = <XCircle className="h-3.5 w-3.5" />
-            description = "Repository deletion failed"
-            className = "text-red-600 bg-red-50 dark:bg-red-900/20 dark:text-red-400"
+        case 'not-indexed':
+            icon = <Clock className="h-3.5 w-3.5" />
+            description = "Repository is pending initial sync"
+            className = "text-yellow-600 bg-yellow-50 dark:bg-yellow-900/20 dark:text-yellow-400"
             break
     }
 
@@ -130,9 +109,9 @@ export const columns = (domain: string): ColumnDef<RepositoryColumnInfo>[] => [
         },
     },
     {
-        accessorKey: "repoIndexingStatus",
+        accessorKey: "status",
         header: ({ column }) => {
-            const uniqueLabels = Array.from(new Set(Object.values(statusLabels)));
+            const uniqueLabels = Object.values(statusLabels);
             const currentFilter = column.getFilterValue() as string | undefined;
 
             return (
@@ -173,12 +152,12 @@ export const columns = (domain: string): ColumnDef<RepositoryColumnInfo>[] => [
             )
         },
         cell: ({ row }) => {
-            return <StatusIndicator status={row.original.repoIndexingStatus} />
+            return <StatusIndicator status={row.original.status} />
         },
         filterFn: (row, id, value) => {
             if (value === undefined) return true;
 
-            const status = row.getValue(id) as RepoIndexingStatus;
+            const status = row.getValue(id) as RepoStatus;
             return statusLabels[status] === value;
         },
     },
@@ -191,14 +170,14 @@ export const columns = (domain: string): ColumnDef<RepositoryColumnInfo>[] => [
                     onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
                     className="px-0 font-medium hover:bg-transparent focus:bg-transparent active:bg-transparent focus-visible:ring-0 focus-visible:ring-offset-0"
                 >
-                    Last Indexed
+                    Last Synced
                     <ArrowUpDown className="ml-2 h-3.5 w-3.5" />
                 </Button>
             </div>
         ),
         cell: ({ row }) => {
             if (!row.original.lastIndexed) {
-                return <div>-</div>;
+                return <div className="text-muted-foreground">Never</div>;
             }
             const date = new Date(row.original.lastIndexed)
             return (

packages/web/src/app/[domain]/repos/page.tsx

@@ -1,8 +1,20 @@
-import { RepositoryTable } from "./repositoryTable";
-import { getOrgFromDomain } from "@/data/org";
-import { PageNotFound } from "../components/pageNotFound";
-import { Header } from "../components/header";
+import { auth } from "@/auth";
 import { env } from "@/env.mjs";
+import { getPrismaClient } from "@/prisma";
+import { RepoJob } from "@sourcebot/db";
+import { Header } from "../components/header";
+import { RepoStatus } from "./columns";
+import { RepositoryTable } from "./repositoryTable";
+
+function getRepoStatus(repo: { indexedAt: Date | null, jobs: RepoJob[] }): RepoStatus {
+    const latestJob = repo.jobs[0];
+    
+    if (latestJob?.status === 'PENDING' || latestJob?.status === 'IN_PROGRESS') {
+        return 'syncing';
+    }
+    
+    return repo.indexedAt ? 'indexed' : 'not-indexed';
+}
 
 export default async function ReposPage(props: { params: Promise<{ domain: string }> }) {
     const params = await props.params;
@@ -11,22 +23,33 @@ export default async function ReposPage(props: { params: Promise<{ domain: strin
         domain
     } = params;
 
-    const org = await getOrgFromDomain(domain);
-    if (!org) {
-        return <PageNotFound />
-    }
+    const session = await auth();
+    const prisma = getPrismaClient(session?.user?.id);
+
+    const repos = await prisma.repo.findMany({
+        include: {
+            jobs: true,
+        }
+    });
 
     return (
         <div>
             <Header>
                 <h1 className="text-3xl">Repositories</h1>
             </Header>
-            <div className="flex flex-col items-center">
-                <div className="w-full">
-                    <RepositoryTable
-                        isAddReposButtonVisible={env.EXPERIMENT_SELF_SERVE_REPO_INDEXING_ENABLED === 'true'}
-                    />
-                </div>
+            <div className="px-6 py-6">
+                <RepositoryTable 
+                    repos={repos.map((repo) => ({
+                        repoId: repo.id,
+                        repoName: repo.name,
+                        repoDisplayName: repo.displayName ?? repo.name,
+                        imageUrl: repo.imageUrl ?? undefined,
+                        indexedAt: repo.indexedAt ?? undefined,
+                        status: getRepoStatus(repo),
+                    }))}
+                    domain={domain}
+                    isAddReposButtonVisible={env.EXPERIMENT_SELF_SERVE_REPO_INDEXING_ENABLED === 'true'}
+                />
             </div>
         </div>
     )