phase 3 initial completion

2026-05-07 00:22:45 +02:00
parent 5d8662595c
commit ce2aa2c776
19 changed files with 1216 additions and 37 deletions
@@ -0,0 +1,58 @@
+import { useParams, useSearchParams, Link } from 'react-router-dom'
+import { useRepo } from '../api/queries/repos'
+import { TreeBrowser } from '../components/repos/TreeBrowser'
+import { RepoListSkeleton } from '../ui/Skeleton'
+
+export default function RepoPage() {
+  const { owner = '', repo: repoName = '' } = useParams<{ owner: string; repo: string }>()
+  const [searchParams] = useSearchParams()
+  const path = searchParams.get('path') ?? ''
+  const ref = searchParams.get('ref') ?? ''
+
+  const { data: repo, isLoading, isError } = useRepo(owner, repoName)
+
+  if (isLoading) return <div className="p-6"><RepoListSkeleton /></div>
+  if (isError || !repo) return <div className="p-6 text-sm text-[#DE350B]">Repository not found.</div>
+
+  const branch = ref || repo.defaultBranch
+
+  return (
+    <div className="max-w-5xl mx-auto px-4 md:px-6 py-6 space-y-6">
+      {/* Breadcrumb */}
+      <div className="flex items-center gap-1 text-sm">
+        <Link to="/repos" className="text-[#0052CC] hover:underline">Repositories</Link>
+        <span className="text-[#5E6C84]">/</span>
+        <span className="font-semibold text-[#172B4D]">{repo.name}</span>
+        {repo.isPrivate && (
+          <span className="text-[10px] font-medium px-1.5 py-0.5 rounded-full border border-[#DFE1E6] text-[#5E6C84] ml-1">
+            Private
+          </span>
+        )}
+      </div>
+
+      {/* Description */}
+      {repo.description && (
+        <p className="text-sm text-[#5E6C84]">{repo.description}</p>
+      )}
+
+      {/* Branch + nav tabs */}
+      <div className="flex items-center gap-3 flex-wrap">
+        <div className="flex items-center gap-1.5 px-2.5 py-1.5 border border-[#DFE1E6] rounded text-sm text-[#172B4D]">
+          <svg width="14" height="14" fill="none" stroke="currentColor" strokeWidth="1.5" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" d="M9.568 3H5.25A2.25 2.25 0 0 0 3 5.25v4.318c0 .597.237 1.17.659 1.591l9.581 9.581c.699.699 1.78.872 2.607.33a18.095 18.095 0 0 0 5.223-5.223c.542-.827.369-1.908-.33-2.607L11.16 3.66A2.25 2.25 0 0 0 9.568 3Z" />
+          </svg>
+          {branch}
+        </div>
+        <Link
+          to={`/repos/${owner}/${repoName}/pulls`}
+          className="text-sm text-[#0052CC] hover:underline"
+        >
+          Pull requests
+        </Link>
+      </div>
+
+      {/* File tree */}
+      <TreeBrowser owner={owner} repo={repoName} ref={branch} path={path} />
+    </div>
+  )
+}