fix(codebase): optimize layout for editor view

- Removes top PageHeader to maximize vertical space.

- Sets layout padding tighter.

- Dynamically replaces 'Code files' header with the repository name (if single repo).

- Hides redundant nested tile header when there's only one codebase.
This commit is contained in:
2026-06-14 13:25:35 -07:00
parent 9766990e70
commit c56a39d763

View File

@@ -53,18 +53,23 @@ export default function CodeTab() {
minHeight: "100vh", minHeight: "100vh",
background: THEME.canvasGradient, background: THEME.canvasGradient,
fontFamily: THEME.font, fontFamily: THEME.font,
padding: "36px 48px", padding: "24px",
}} }}
> >
<div style={{ maxWidth: 1400, margin: "0 auto" }}> <div
<PageHeader title="Codebase" /> style={{
maxWidth: "100%",
margin: "0 auto",
height: "calc(100vh - 48px)",
}}
>
<Card <Card
padding={0} padding={0}
style={{ style={{
overflow: "hidden", overflow: "hidden",
display: "flex", display: "flex",
flexDirection: "column", flexDirection: "column",
minHeight: "calc(100vh - 150px)", height: "100%",
}} }}
> >
<div style={grid}> <div style={grid}>
@@ -104,7 +109,14 @@ export default function CodeTab() {
{anatomy && ( {anatomy && (
<> <>
{/* Code Files */} {/* Code Files */}
<RailGroup title="Code files" count={codebases?.length ?? 0}> <RailGroup
title={
codebases?.length === 1
? codebases[0].label
: "Code files"
}
count={codebases?.length ?? 0}
>
{codebases && codebases.length === 0 && ( {codebases && codebases.length === 0 && (
<RailEmpty> <RailEmpty>
{reason === "no_repo" ? ( {reason === "no_repo" ? (
@@ -134,33 +146,47 @@ export default function CodeTab() {
flex: 1, flex: 1,
}} }}
> >
<div {codebases.length > 1 && (
style={{ ...tileHeader, padding: "20px 24px 12px" }} <div
> style={{
<span style={chevronCell}> ...tileHeader,
<ChevronDown padding: "20px 24px 12px",
size={13} }}
style={{ color: THEME.mid }} >
<span style={chevronCell}>
<ChevronDown
size={13}
style={{ color: THEME.mid }}
/>
</span>
<Box
size={14}
style={{ color: THEME.mid, flexShrink: 0 }}
/> />
</span> <div style={{ minWidth: 0, textAlign: "left" }}>
<Box <div
size={14} style={{
style={{ color: THEME.mid, flexShrink: 0 }} fontSize: "0.95rem",
/> fontWeight: 600,
<div style={{ minWidth: 0, textAlign: "left" }}> color: THEME.ink,
<div }}
style={{ >
fontSize: "0.95rem", {cb.label}
fontWeight: 600, </div>
color: THEME.ink, {cb.hint && (
}} <div style={tileHint}>{cb.hint}</div>
> )}
{cb.label}
</div> </div>
{cb.hint && <div style={tileHint}>{cb.hint}</div>}
</div> </div>
</div> )}
<div style={{ padding: "0 10px 24px 10px" }}> <div
style={{
padding:
codebases.length > 1
? "0 10px 24px 10px"
: "10px 10px 24px 10px",
}}
>
<GiteaFileTree <GiteaFileTree
projectId={projectId} projectId={projectId}
rootPath={cb.path} rootPath={cb.path}