Swadhin Biswas Feature/ai code reviewer (#79) · 8/16/2026
cfd400d
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
---
import BaseLayout from "./BaseLayout.astro";
const { title } = Astro.props;
const user = Astro.locals.user;
const navigation = [
{ name: "Public profile", href: "/settings/profile" },
{ name: "Account", href: "/settings/account" },
{ name: "Password and authentication", href: "/settings/security" },
{ name: "SSH and GPG keys", href: "/settings/ssh-keys" },
{ name: "Personal access tokens", href: "/settings/tokens" },
{ name: "OAuth apps", href: "/settings/oauth-apps" },
];
const repoNavigation = [
{ name: "Repositories", href: "/repositories" },
{ name: "Organizations", href: "/orgs" },
{ name: "Notifications", href: "/notifications" },
];
const currentPath = Astro.url.pathname;
---
<BaseLayout title={title}>
<div class="border-b border-border bg-background">
<div class="max-w-[1280px] mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center gap-3 py-3 sm:py-4">
{user?.avatarUrl ? (
<img src={user.avatarUrl} alt="" class="w-7 h-7 sm:w-8 sm:h-8 rounded-full" />
) : (
<div class="w-7 h-7 sm:w-8 sm:h-8 rounded-full bg-secondary flex items-center justify-center text-xs sm:text-sm font-medium text-muted-foreground">
{user?.username?.[0]?.toUpperCase()}
</div>
)}
<div>
<h1 class="text-base sm:text-xl font-semibold text-foreground">{user?.username}</h1>
</div>
</div>
</div>
</div>
<div class="max-w-[1280px] mx-auto px-4 sm:px-6 lg:px-8 py-4 sm:py-6">
<div class="flex flex-col lg:flex-row gap-6 lg:gap-8">
<!-- Sidebar - horizontal on mobile, vertical on desktop -->
<aside class="w-full lg:w-[260px] shrink-0">
<!-- Mobile: horizontal scroll -->
<nav class="flex lg:flex-col gap-1 overflow-x-auto no-scrollbar pb-2 lg:pb-0">
<div class="hidden lg:block text-xs font-semibold text-foreground uppercase tracking-wider mb-2 px-3">Personal settings</div>
{navigation.map((item) => {
const isActive = currentPath === item.href;
return (
<a
href={item.href}
class:list={[
"whitespace-nowrap px-3 py-1.5 text-sm rounded-md transition-colors",
isActive
? "font-semibold text-foreground bg-accent"
: "text-[#58a6ff] hover:text-[#79c0ff] hover:bg-accent/50"
]}
>
{item.name}
</a>
);
})}
<div class="hidden lg:block h-px bg-border my-3"></div>
<div class="hidden lg:block text-xs font-semibold text-foreground uppercase tracking-wider mb-2 px-3">Repository settings</div>
{repoNavigation.map((item) => {
const isActive = currentPath === item.href;
return (
<a
href={item.href}
class:list={[
"whitespace-nowrap px-3 py-1.5 text-sm rounded-md transition-colors",
isActive
? "font-semibold text-foreground bg-accent"
: "text-[#58a6ff] hover:text-[#79c0ff] hover:bg-accent/50"
]}
>
{item.name}
</a>
);
})}
</nav>
</aside>
<!-- Content -->
<div class="flex-1 min-w-0">
<slot />
</div>
</div>
</div>
</BaseLayout>