mirror of
https://gitbruv.vercel.app/api/git/bruv/gitbruv.git
synced 2025-12-20 23:24:09 +01:00
mvp
This commit is contained in:
Ahmet Kilinc
parent
8f672d012c
commit
46cab693db
49 changed files with 4725 additions and 118 deletions
114
app/(main)/[username]/[repo]/blob/[...path]/page.tsx
Normal file
114
app/(main)/[username]/[repo]/blob/[...path]/page.tsx
Normal file
|
|
@ -0,0 +1,114 @@
|
|||
import { notFound } from "next/navigation";
|
||||
import Link from "next/link";
|
||||
import { getRepository, getRepoFile } from "@/actions/repositories";
|
||||
import { CodeViewer } from "@/components/code-viewer";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Lock, Globe, ChevronRight, Home, FileCode } from "lucide-react";
|
||||
|
||||
const LANGUAGE_MAP: Record<string, string> = {
|
||||
ts: "typescript",
|
||||
tsx: "typescript",
|
||||
js: "javascript",
|
||||
jsx: "javascript",
|
||||
py: "python",
|
||||
rb: "ruby",
|
||||
go: "go",
|
||||
rs: "rust",
|
||||
java: "java",
|
||||
md: "markdown",
|
||||
json: "json",
|
||||
yaml: "yaml",
|
||||
yml: "yaml",
|
||||
css: "css",
|
||||
html: "html",
|
||||
sh: "bash",
|
||||
bash: "bash",
|
||||
zsh: "bash",
|
||||
};
|
||||
|
||||
function getLanguage(filename: string): string {
|
||||
const ext = filename.split(".").pop()?.toLowerCase() || "";
|
||||
return LANGUAGE_MAP[ext] || "text";
|
||||
}
|
||||
|
||||
export default async function BlobPage({ params }: { params: Promise<{ username: string; repo: string; path: string[] }> }) {
|
||||
const { username, repo: repoName, path: pathSegments } = await params;
|
||||
const branch = pathSegments[0];
|
||||
const filePath = pathSegments.slice(1).join("/");
|
||||
|
||||
const repo = await getRepository(username, repoName);
|
||||
|
||||
if (!repo) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const file = await getRepoFile(username, repoName, branch, filePath);
|
||||
|
||||
if (!file) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const pathParts = filePath.split("/").filter(Boolean);
|
||||
const fileName = pathParts[pathParts.length - 1];
|
||||
const language = getLanguage(fileName);
|
||||
const lineCount = file.content.split("\n").length;
|
||||
|
||||
return (
|
||||
<div className="container px-4 py-6">
|
||||
<div className="flex flex-col lg:flex-row items-start lg:items-center justify-between gap-4 mb-6">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
<Link href={`/${username}`} className="text-accent hover:underline">
|
||||
<span className="text-xl font-bold">{username}</span>
|
||||
</Link>
|
||||
<span className="text-muted-foreground">/</span>
|
||||
<Link href={`/${username}/${repoName}`} className="text-accent hover:underline font-bold">
|
||||
{repoName}
|
||||
</Link>
|
||||
<Badge variant="secondary" className="text-xs font-normal">
|
||||
{repo.visibility === "private" ? (
|
||||
<>
|
||||
<Lock className="h-3 w-3 mr-1" />
|
||||
Private
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Globe className="h-3 w-3 mr-1" />
|
||||
Public
|
||||
</>
|
||||
)}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="border border-border rounded-lg overflow-hidden">
|
||||
<nav className="flex items-center gap-1 px-4 py-2 bg-card border-b border-border text-sm">
|
||||
<Link href={`/${username}/${repoName}`} className="text-accent hover:underline flex items-center gap-1">
|
||||
<Home className="h-4 w-4" />
|
||||
{repoName}
|
||||
</Link>
|
||||
{pathParts.map((part, i) => (
|
||||
<span key={i} className="flex items-center gap-1">
|
||||
<ChevronRight className="h-4 w-4 text-muted-foreground" />
|
||||
{i === pathParts.length - 1 ? (
|
||||
<span className="font-medium">{part}</span>
|
||||
) : (
|
||||
<Link href={`/${username}/${repoName}/tree/${branch}/${pathParts.slice(0, i + 1).join("/")}`} className="text-accent hover:underline">
|
||||
{part}
|
||||
</Link>
|
||||
)}
|
||||
</span>
|
||||
))}
|
||||
</nav>
|
||||
|
||||
<div className="flex items-center justify-between px-4 py-2 bg-muted/30 border-b border-border">
|
||||
<div className="flex items-center gap-2 text-sm text-muted-foreground">
|
||||
<FileCode className="h-4 w-4" />
|
||||
<span>{lineCount} lines</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<CodeViewer content={file.content} language={language} showLineNumbers />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
131
app/(main)/[username]/[repo]/page.tsx
Normal file
131
app/(main)/[username]/[repo]/page.tsx
Normal file
|
|
@ -0,0 +1,131 @@
|
|||
import { notFound } from "next/navigation";
|
||||
import { getRepository, getRepoFileTree, getRepoFile } from "@/actions/repositories";
|
||||
import { FileTree } from "@/components/file-tree";
|
||||
import { CodeViewer } from "@/components/code-viewer";
|
||||
import { CloneUrl } from "@/components/clone-url";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { GitBranch, Lock, Globe, FileCode } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
|
||||
export default async function RepoPage({ params }: { params: Promise<{ username: string; repo: string }> }) {
|
||||
const { username, repo: repoName } = await params;
|
||||
|
||||
const repo = await getRepository(username, repoName);
|
||||
|
||||
if (!repo) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const fileTree = await getRepoFileTree(username, repoName, repo.defaultBranch);
|
||||
const readmeFile = fileTree?.files.find((f) => f.name.toLowerCase() === "readme.md" && f.type === "blob");
|
||||
|
||||
let readmeContent = null;
|
||||
if (readmeFile) {
|
||||
const file = await getRepoFile(username, repoName, repo.defaultBranch, readmeFile.name);
|
||||
readmeContent = file?.content;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container px-4 py-6">
|
||||
<div className="flex flex-col lg:flex-row items-start lg:items-center justify-between gap-4 mb-6">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
<Link href={`/${username}`} className="text-accent hover:underline">
|
||||
<span className="text-xl font-bold">{username}</span>
|
||||
</Link>
|
||||
<span className="text-muted-foreground">/</span>
|
||||
<h1 className="text-xl font-bold">{repo.name}</h1>
|
||||
<Badge variant="secondary" className="text-xs font-normal">
|
||||
{repo.visibility === "private" ? (
|
||||
<>
|
||||
<Lock className="h-3 w-3 mr-1" />
|
||||
Private
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Globe className="h-3 w-3 mr-1" />
|
||||
Public
|
||||
</>
|
||||
)}
|
||||
</Badge>
|
||||
</div>
|
||||
<CloneUrl username={username} repoName={repo.name} />
|
||||
</div>
|
||||
|
||||
{repo.description && <p className="text-muted-foreground mb-6">{repo.description}</p>}
|
||||
|
||||
<div className="grid lg:grid-cols-4 gap-6">
|
||||
<div className="lg:col-span-3 space-y-6">
|
||||
<div className="border border-border rounded-lg overflow-hidden">
|
||||
<div className="flex items-center gap-2 px-4 py-3 bg-card border-b border-border">
|
||||
<GitBranch className="h-4 w-4 text-muted-foreground" />
|
||||
<span className="text-sm font-medium">{repo.defaultBranch}</span>
|
||||
</div>
|
||||
|
||||
{fileTree?.isEmpty ? (
|
||||
<EmptyRepoGuide username={username} repoName={repo.name} />
|
||||
) : (
|
||||
<FileTree files={fileTree?.files || []} username={username} repoName={repo.name} branch={repo.defaultBranch} />
|
||||
)}
|
||||
</div>
|
||||
|
||||
{readmeContent && (
|
||||
<div className="border border-border rounded-lg overflow-hidden">
|
||||
<div className="flex items-center gap-2 px-4 py-3 bg-card border-b border-border">
|
||||
<FileCode className="h-4 w-4 text-muted-foreground" />
|
||||
<span className="text-sm font-medium">README.md</span>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<CodeViewer content={readmeContent} language="markdown" />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<aside className="space-y-6">
|
||||
<div className="border border-border rounded-lg p-4">
|
||||
<h3 className="font-semibold mb-3">About</h3>
|
||||
<p className="text-sm text-muted-foreground">{repo.description || "No description provided."}</p>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function EmptyRepoGuide({ username, repoName }: { username: string; repoName: string }) {
|
||||
const cloneUrl = `${process.env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"}/api/git/${username}/${repoName}.git`;
|
||||
|
||||
return (
|
||||
<div className="p-6 space-y-6">
|
||||
<div className="text-center py-8">
|
||||
<GitBranch className="h-12 w-12 mx-auto mb-4 text-muted-foreground" />
|
||||
<h3 className="text-lg font-medium mb-2">This repository is empty</h3>
|
||||
<p className="text-muted-foreground">Get started by cloning or pushing to this repository.</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<h4 className="text-sm font-medium mb-2">Create a new repository on the command line</h4>
|
||||
<pre className="bg-muted p-4 rounded-lg text-sm overflow-x-auto">
|
||||
<code>{`echo "# ${repoName}" >> README.md
|
||||
git init
|
||||
git add README.md
|
||||
git commit -m "first commit"
|
||||
git branch -M main
|
||||
git remote add origin ${cloneUrl}
|
||||
git push -u origin main`}</code>
|
||||
</pre>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4 className="text-sm font-medium mb-2">Push an existing repository from the command line</h4>
|
||||
<pre className="bg-muted p-4 rounded-lg text-sm overflow-x-auto">
|
||||
<code>{`git remote add origin ${cloneUrl}
|
||||
git branch -M main
|
||||
git push -u origin main`}</code>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
83
app/(main)/[username]/[repo]/tree/[...path]/page.tsx
Normal file
83
app/(main)/[username]/[repo]/tree/[...path]/page.tsx
Normal file
|
|
@ -0,0 +1,83 @@
|
|||
import { notFound } from "next/navigation";
|
||||
import Link from "next/link";
|
||||
import { getRepository, getRepoFileTree } from "@/actions/repositories";
|
||||
import { FileTree } from "@/components/file-tree";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { GitBranch, Lock, Globe, ChevronRight, Home } from "lucide-react";
|
||||
|
||||
export default async function TreePage({ params }: { params: Promise<{ username: string; repo: string; path: string[] }> }) {
|
||||
const { username, repo: repoName, path: pathSegments } = await params;
|
||||
const branch = pathSegments[0];
|
||||
const dirPath = pathSegments.slice(1).join("/");
|
||||
|
||||
const repo = await getRepository(username, repoName);
|
||||
|
||||
if (!repo) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const fileTree = await getRepoFileTree(username, repoName, branch, dirPath);
|
||||
|
||||
if (!fileTree) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const pathParts = dirPath.split("/").filter(Boolean);
|
||||
|
||||
return (
|
||||
<div className="container px-4 py-6">
|
||||
<div className="flex flex-col lg:flex-row items-start lg:items-center justify-between gap-4 mb-6">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
<Link href={`/${username}`} className="text-accent hover:underline">
|
||||
<span className="text-xl font-bold">{username}</span>
|
||||
</Link>
|
||||
<span className="text-muted-foreground">/</span>
|
||||
<Link href={`/${username}/${repoName}`} className="text-accent hover:underline font-bold">
|
||||
{repoName}
|
||||
</Link>
|
||||
<Badge variant="secondary" className="text-xs font-normal">
|
||||
{repo.visibility === "private" ? (
|
||||
<>
|
||||
<Lock className="h-3 w-3 mr-1" />
|
||||
Private
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Globe className="h-3 w-3 mr-1" />
|
||||
Public
|
||||
</>
|
||||
)}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="border border-border rounded-lg overflow-hidden">
|
||||
<div className="flex items-center gap-2 px-4 py-3 bg-card border-b border-border">
|
||||
<GitBranch className="h-4 w-4 text-muted-foreground" />
|
||||
<span className="text-sm font-medium">{branch}</span>
|
||||
</div>
|
||||
|
||||
<nav className="flex items-center gap-1 px-4 py-2 bg-muted/30 border-b border-border text-sm">
|
||||
<Link href={`/${username}/${repoName}`} className="text-accent hover:underline flex items-center gap-1">
|
||||
<Home className="h-4 w-4" />
|
||||
{repoName}
|
||||
</Link>
|
||||
{pathParts.map((part, i) => (
|
||||
<span key={i} className="flex items-center gap-1">
|
||||
<ChevronRight className="h-4 w-4 text-muted-foreground" />
|
||||
{i === pathParts.length - 1 ? (
|
||||
<span className="font-medium">{part}</span>
|
||||
) : (
|
||||
<Link href={`/${username}/${repoName}/tree/${branch}/${pathParts.slice(0, i + 1).join("/")}`} className="text-accent hover:underline">
|
||||
{part}
|
||||
</Link>
|
||||
)}
|
||||
</span>
|
||||
))}
|
||||
</nav>
|
||||
|
||||
<FileTree files={fileTree.files} username={username} repoName={repoName} branch={branch} basePath={dirPath} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
71
app/(main)/[username]/page.tsx
Normal file
71
app/(main)/[username]/page.tsx
Normal file
|
|
@ -0,0 +1,71 @@
|
|||
import { notFound } from "next/navigation";
|
||||
import { db } from "@/db";
|
||||
import { users } from "@/db/schema";
|
||||
import { eq } from "drizzle-orm";
|
||||
import { getUserRepositories } from "@/actions/repositories";
|
||||
import { RepoList } from "@/components/repo-list";
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
||||
import { CalendarDays, GitBranch } from "lucide-react";
|
||||
import { format } from "date-fns";
|
||||
|
||||
export default async function ProfilePage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ username: string }>;
|
||||
}) {
|
||||
const { username } = await params;
|
||||
|
||||
const user = await db.query.users.findFirst({
|
||||
where: eq(users.username, username),
|
||||
});
|
||||
|
||||
if (!user) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const repos = await getUserRepositories(username);
|
||||
|
||||
return (
|
||||
<div className="container px-4 py-8">
|
||||
<div className="flex flex-col lg:flex-row gap-8">
|
||||
<aside className="lg:w-72 shrink-0">
|
||||
<div className="sticky top-20">
|
||||
<Avatar className="w-64 h-64 mx-auto lg:mx-0 mb-4 border-4 border-border">
|
||||
<AvatarImage src={user.image || undefined} />
|
||||
<AvatarFallback className="text-6xl bg-accent/20">
|
||||
{user.name.charAt(0).toUpperCase()}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<h1 className="text-2xl font-bold">{user.name}</h1>
|
||||
<p className="text-lg text-muted-foreground">@{user.username}</p>
|
||||
<div className="flex items-center gap-2 mt-4 text-sm text-muted-foreground">
|
||||
<CalendarDays className="h-4 w-4" />
|
||||
<span>Joined {format(new Date(user.createdAt), "MMMM yyyy")}</span>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2 mb-6">
|
||||
<GitBranch className="h-5 w-5" />
|
||||
<h2 className="text-xl font-semibold">Repositories</h2>
|
||||
<span className="text-sm text-muted-foreground">({repos.length})</span>
|
||||
</div>
|
||||
|
||||
{repos.length === 0 ? (
|
||||
<div className="border border-dashed border-border rounded-lg p-12 text-center">
|
||||
<GitBranch className="h-12 w-12 mx-auto mb-4 text-muted-foreground" />
|
||||
<h3 className="text-lg font-medium mb-2">No repositories yet</h3>
|
||||
<p className="text-muted-foreground">
|
||||
{user.name} hasn't created any public repositories.
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<RepoList repos={repos} username={username} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Loading…
Add table
Add a link
Reference in a new issue