Pipeline/frontend/src/app/git-projects/repositories/page.tsx

94 lines
3.0 KiB
TypeScript

"use client";
import { useEffect, useState } from "react";
import { useRouter } from "next/navigation";
import { Button } from "@/components/ui/button";
import { useAuth } from "@/auth/clerk";
import { DashboardPageLayout } from "@/components/templates/DashboardPageLayout";
import { ForgejoRepositoriesTable } from "@/components/git/ForgejoRepositoriesTable";
import {
getForgejoRepositories,
deleteForgejoRepository,
type ForgejoRepository,
} from "@/lib/api-forgejo";
export default function ForgejoRepositoriesPage() {
const router = useRouter();
const auth = useAuth();
const [repositories, setRepositories] = useState<ForgejoRepository[]>([]);
const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => {
const fetchRepositories = async () => {
try {
setIsLoading(true);
const data = await getForgejoRepositories();
setRepositories(data);
setError(null);
} catch (err) {
setError(err instanceof Error ? err.message : "Failed to load repositories");
} finally {
setIsLoading(false);
}
};
if (auth.isSignedIn) {
fetchRepositories();
}
}, [auth.isSignedIn, auth.getToken]);
const handleDelete = async (repository: ForgejoRepository) => {
if (
confirm(`Are you sure you want to delete "${repository.display_name || repository.repo}"? This action cannot be undone.`)
) {
try {
await deleteForgejoRepository(repository.id);
setRepositories((prev) => prev.filter((r) => r.id !== repository.id));
alert("Repository deleted successfully");
} catch (err) {
alert(err instanceof Error ? err.message : "Failed to delete repository");
}
}
};
return (
<DashboardPageLayout
signedOut={{
message: "Sign in to manage tracked repositories.",
forceRedirectUrl: "/git-projects/repositories",
signUpForceRedirectUrl: "/git-projects/repositories",
}}
title="Tracked Repositories"
description={`${repositories.length} repository${repositories.length === 1 ? "" : "s"} being tracked.`}
stickyHeader
>
<div className="flex flex-col gap-4">
<div className="flex items-center justify-between">
<h2 className="text-sm font-medium text-slate-500">Repositories</h2>
<Button
onClick={() => router.push("/git-projects/repositories/new")}
>
Add Repository
</Button>
</div>
<div className="overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
{error ? (
<div className="p-8 text-center">
<p className="text-red-600">{error}</p>
</div>
) : (
<ForgejoRepositoriesTable
repositories={repositories}
isLoading={isLoading}
onDelete={handleDelete}
/>
)}
</div>
</div>
</DashboardPageLayout>
);
}