swadhinbiswas feat: implement production-grade security and fix critical vulnerabilities · 1/1/2026
0c17327
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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
"use client";
import { HoverEffect } from "@/components/ui/card-hover-effect";
import { motion } from "framer-motion";
import {
Code,
GitBranch,
Activity,
Users,
BookOpen,
Settings,
Layers,
Bot,
GitMerge,
BarChart3,
MessageSquare,
Terminal,
} from "lucide-react";
const graphiteFeatures = [
{
title: "Stacked Pull Requests",
description:
"Break large changes into reviewable stacks. Each PR builds on the previous, enabling faster feedback cycles.",
icon: <Layers className="h-6 w-6 text-primary" />,
link: "/inbox",
},
{
title: "AI Code Review",
description:
"Get instant feedback from AI reviewers. Catch bugs, suggest improvements, and enforce best practices automatically.",
icon: <Bot className="h-6 w-6 text-purple-400" />,
},
{
title: "Smart Merge Queue",
description:
"Stack-aware merge queue with automatic rebasing. Never deal with merge conflicts again.",
icon: <GitMerge className="h-6 w-6 text-green-400" />,
},
{
title: "Developer Metrics",
description:
"Track PR velocity, review efficiency, and team performance with actionable insights.",
icon: <BarChart3 className="h-6 w-6 text-orange-400" />,
},
{
title: "Slack Notifications",
description:
"Get actionable PR notifications in Slack. Review, approve, and merge without leaving chat.",
icon: <MessageSquare className="h-6 w-6 text-blue-400" />,
},
{
title: "och CLI",
description:
"Powerful CLI for managing stacks. Create, sync, and submit PRs from your terminal.",
icon: <Terminal className="h-6 w-6 text-cyan-400" />,
},
];
const coreFeatures = [
{
title: "Git Hosting",
description:
"Full Git support with SSH and HTTP protocols. Manage branches, tags, and commits with ease.",
icon: <Code className="h-6 w-6 text-primary" />,
},
{
title: "Pull Requests",
description:
"Review code changes with inline comments, approvals, and merge strategies.",
icon: <GitBranch className="h-6 w-6 text-primary" />,
},
{
title: "CI/CD Pipelines",
description:
"GitHub Actions compatible workflows. Build, test, and deploy automatically.",
icon: <Activity className="h-6 w-6 text-primary" />,
},
{
title: "Team Collaboration",
description:
"Collaborators, teams, and fine-grained permissions for enterprise workflows.",
icon: <Users className="h-6 w-6 text-primary" />,
},
{
title: "Documentation",
description:
"Built-in wiki, README rendering, and project documentation support.",
icon: <BookOpen className="h-6 w-6 text-primary" />,
},
{
title: "Administration",
description:
"Advanced controls, audit logs, and monitoring for system administrators.",
icon: <Settings className="h-6 w-6 text-primary" />,
},
];
export default function FeaturesSection() {
return (
<div className="py-20 relative">
{/* Graphite Features */}
<div className="max-w-7xl mx-auto px-4 mb-20">
<motion.div
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5 }}
viewport={{ once: true }}
className="text-center mb-10"
>
<span className="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-primary/20 bg-primary/5 text-sm text-primary mb-4">
✨ New Features
</span>
<h2 className="text-3xl md:text-4xl font-bold bg-clip-text text-transparent bg-gradient-to-b from-neutral-50 to-neutral-400">
Graphite-Inspired Developer Experience
</h2>
<p className="mt-4 text-muted-foreground max-w-2xl mx-auto">
Stack your PRs, automate reviews, and ship faster with our modern code review workflow
</p>
</motion.div>
<HoverEffect items={graphiteFeatures} />
</div>
{/* Core Features */}
<div className="max-w-7xl mx-auto px-4 border-t border-white/5 pt-20">
<motion.div
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5 }}
viewport={{ once: true }}
className="text-center mb-10"
>
<h2 className="text-2xl md:text-3xl font-bold text-foreground">
Everything you need to ship code
</h2>
<p className="mt-4 text-muted-foreground">
A complete platform for version control, code review, and continuous integration
</p>
</motion.div>
<HoverEffect items={coreFeatures} />
</div>
</div>
);
}