Skip to content

Commit d0ce627

Browse files
📝 Add docstrings to feature/landing-page-v2-complete
Docstrings generation was requested by @DevanshuNEU. * #215 (comment) The following files were modified: * `frontend/src/App.tsx` * `frontend/src/components/landing/FAQ.tsx` * `frontend/src/components/landing/Features.tsx` * `frontend/src/components/landing/Footer.tsx` * `frontend/src/components/landing/GitHubStars.tsx` * `frontend/src/components/landing/Hero.tsx` * `frontend/src/components/landing/MobileMenu.tsx` * `frontend/src/components/landing/Navbar.tsx` * `frontend/src/components/landing/Pricing.tsx` * `frontend/src/components/landing/ThemeToggle.tsx` * `frontend/src/components/providers/ThemeProvider.tsx` * `frontend/src/hooks/useGitHubStars.ts` * `frontend/src/pages/LandingPage.tsx`
1 parent dd0a34f commit d0ce627

13 files changed

Lines changed: 1073 additions & 158 deletions

File tree

frontend/src/App.tsx

Lines changed: 25 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
22
import { AuthProvider, useAuth } from './contexts/AuthContext';
3+
import { ThemeProvider } from './components/providers/ThemeProvider';
4+
import { TooltipProvider } from './components/ui/tooltip';
35
import { LoginPage } from './pages/LoginPage';
46
import { SignupPage } from './pages/SignupPage';
57
import { LandingPage } from './pages/LandingPage';
@@ -78,12 +80,29 @@ function AppRoutes() {
7880
);
7981
}
8082

83+
/**
84+
* Root application component that sets up global providers and routing.
85+
*
86+
* Wraps the app with theme and tooltip contexts, initializes the router, and
87+
* provides authentication state to the route tree.
88+
*
89+
* @returns The root React element with ThemeProvider, TooltipProvider, BrowserRouter, and AuthProvider applied.
90+
*/
8191
export function App() {
8292
return (
83-
<BrowserRouter>
84-
<AuthProvider>
85-
<AppRoutes />
86-
</AuthProvider>
87-
</BrowserRouter>
93+
<ThemeProvider
94+
attribute="class"
95+
defaultTheme="dark"
96+
enableSystem={false}
97+
disableTransitionOnChange
98+
>
99+
<TooltipProvider>
100+
<BrowserRouter>
101+
<AuthProvider>
102+
<AppRoutes />
103+
</AuthProvider>
104+
</BrowserRouter>
105+
</TooltipProvider>
106+
</ThemeProvider>
88107
);
89-
}
108+
}
Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
import { motion } from 'framer-motion'
2+
import {
3+
Accordion,
4+
AccordionContent,
5+
AccordionItem,
6+
AccordionTrigger,
7+
} from '@/components/ui/accordion'
8+
9+
const FAQS = [
10+
{
11+
q: 'How is this different from GitHub search or grep?',
12+
a: `Think about the last time you joined a new codebase. You knew what you needed ("the function that retries API calls") but had no idea what it was called. GitHub search and grep need exact keywords. If the function is named make_request_with_backoff, you'd never find it by searching "retry logic."
13+
14+
CodeIntel actually understands what code does, not just what it's named. We use AI embeddings trained specifically on code semantics. So you can search "retry logic with exponential backoff" and find it, even if those words appear nowhere in the file.`,
15+
},
16+
{
17+
q: 'What languages do you support?',
18+
a: `Right now, Python is our focus. We have deep support for Flask, FastAPI, and Django, meaning we understand routes, middleware, decorators, and framework-specific patterns.
19+
20+
TypeScript and JavaScript are next on our roadmap, followed by Go and Rust. The good news: CodeIntel is completely open source. If you need a language we don't support yet, you can contribute a parser or sponsor its development. Our architecture is built to be language-agnostic from day one.`,
21+
},
22+
{
23+
q: 'How does MCP integration work?',
24+
a: `MCP (Model Context Protocol) is how AI assistants like Claude and Cursor talk to external tools. CodeIntel runs as an MCP server that these tools can connect to.
25+
26+
Once connected, your AI assistant gains the ability to semantically search your entire codebase. When you ask Claude "how does authentication work in this project?", it can actually find and read the relevant code instead of guessing. It's like giving your AI assistant a senior developer's knowledge of your codebase.`,
27+
},
28+
{
29+
q: 'Is my code stored on your servers?',
30+
a: `We never store your raw source code. What we store are vector embeddings, which are mathematical representations of what your code does. Think of it like storing a summary, not the actual document. You can delete these anytime from your dashboard.
31+
32+
But if you want complete control, you can self-host CodeIntel on your own infrastructure. It's fully open source under MIT license. Your code never leaves your servers, and you get the same search quality. Many teams with sensitive codebases go this route.`,
33+
},
34+
{
35+
q: 'How fast is indexing?',
36+
a: `For most repositories under 100,000 lines of code, initial indexing takes about 1-2 minutes. We parse your code, generate embeddings, and build the search index in parallel.
37+
38+
After the first index, updates are incremental. Change a file, and only that file gets re-indexed. This usually takes seconds. Search itself returns results in under 100ms regardless of how large your codebase is, because we're searching vectors, not scanning text.`,
39+
},
40+
]
41+
42+
/**
43+
* Renders the FAQ section with an animated header, an accordion of frequently asked questions, and a contact link.
44+
*
45+
* @returns The section element containing the FAQ accordion and contact paragraph
46+
*/
47+
export function FAQ() {
48+
return (
49+
<section id="faq" className="py-24 px-6 relative">
50+
<div className="max-w-3xl mx-auto">
51+
<motion.div
52+
className="text-center mb-12"
53+
initial={{ opacity: 0, y: 20 }}
54+
whileInView={{ opacity: 1, y: 0 }}
55+
viewport={{ once: true, margin: "-100px" }}
56+
transition={{ duration: 0.5 }}
57+
>
58+
<h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4">
59+
Questions? Answers.
60+
</h2>
61+
</motion.div>
62+
63+
<motion.div
64+
initial={{ opacity: 0, y: 20 }}
65+
whileInView={{ opacity: 1, y: 0 }}
66+
viewport={{ once: true, margin: "-50px" }}
67+
transition={{ duration: 0.5, delay: 0.1 }}
68+
>
69+
<Accordion type="single" collapsible className="space-y-3">
70+
{FAQS.map((faq, i) => (
71+
<AccordionItem
72+
key={i}
73+
value={`faq-${i}`}
74+
className="border border-border/50 rounded-xl px-6 bg-card/20"
75+
>
76+
<AccordionTrigger className="text-left text-foreground hover:no-underline py-5 text-[15px]">
77+
{faq.q}
78+
</AccordionTrigger>
79+
<AccordionContent className="text-muted-foreground pb-5 leading-relaxed text-sm">
80+
{faq.a}
81+
</AccordionContent>
82+
</AccordionItem>
83+
))}
84+
</Accordion>
85+
</motion.div>
86+
87+
<motion.p
88+
className="text-center text-sm text-muted-foreground mt-10"
89+
initial={{ opacity: 0 }}
90+
whileInView={{ opacity: 1 }}
91+
viewport={{ once: true }}
92+
transition={{ delay: 0.3 }}
93+
>
94+
More questions?{' '}
95+
<a href="mailto:devanshurajesh@gmail.com" className="text-accent hover:underline">
96+
Get in touch
97+
</a>
98+
</motion.p>
99+
</div>
100+
</section>
101+
)
102+
}
Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
import { motion } from 'framer-motion'
2+
import { Search, Zap, GitBranch, Brain, Lock, Terminal } from 'lucide-react'
3+
4+
const FEATURES = [
5+
{
6+
icon: Search,
7+
title: 'Semantic Search',
8+
description: 'Find code by what it does, not what it\'s named. Ask "retry logic with exponential backoff" and get exactly that.',
9+
color: 'text-blue-400',
10+
bg: 'bg-blue-500/10',
11+
glow: 'group-hover:shadow-blue-500/20',
12+
},
13+
{
14+
icon: Brain,
15+
title: 'Understands Context',
16+
description: 'Knows the difference between a Flask route handler and a FastAPI dependency. Context-aware results every time.',
17+
color: 'text-violet-400',
18+
bg: 'bg-violet-500/10',
19+
glow: 'group-hover:shadow-violet-500/20',
20+
},
21+
{
22+
icon: Zap,
23+
title: 'Instant Results',
24+
description: 'Sub-100ms search across your entire codebase. No waiting, no spinning, just answers.',
25+
color: 'text-amber-400',
26+
bg: 'bg-amber-500/10',
27+
glow: 'group-hover:shadow-amber-500/20',
28+
},
29+
{
30+
icon: GitBranch,
31+
title: 'Dependency Graph',
32+
description: 'See how code connects. Trace imports, find usages, understand impact before you change anything.',
33+
color: 'text-emerald-400',
34+
bg: 'bg-emerald-500/10',
35+
glow: 'group-hover:shadow-emerald-500/20',
36+
},
37+
{
38+
icon: Terminal,
39+
title: 'MCP Integration',
40+
description: 'Works with Claude, Cursor, and any MCP-compatible AI. Your AI assistant finally understands your code.',
41+
color: 'text-cyan-400',
42+
bg: 'bg-cyan-500/10',
43+
glow: 'group-hover:shadow-cyan-500/20',
44+
},
45+
{
46+
icon: Lock,
47+
title: 'Self-Host Option',
48+
description: 'Keep your code private. Run CodeIntel on your own infrastructure with full control.',
49+
color: 'text-rose-400',
50+
bg: 'bg-rose-500/10',
51+
glow: 'group-hover:shadow-rose-500/20',
52+
},
53+
]
54+
55+
const containerVariants = {
56+
hidden: { opacity: 0 },
57+
visible: {
58+
opacity: 1,
59+
transition: { staggerChildren: 0.08, delayChildren: 0.1 }
60+
}
61+
}
62+
63+
const itemVariants = {
64+
hidden: { opacity: 0, y: 30, scale: 0.95 },
65+
visible: {
66+
opacity: 1,
67+
y: 0,
68+
scale: 1,
69+
transition: { type: 'spring', stiffness: 200, damping: 20 }
70+
}
71+
}
72+
73+
/**
74+
* Renders the "Features" section with an animated, responsive grid of feature cards.
75+
*
76+
* Each card displays an icon, title, and description and includes hover interactions and reveal animations.
77+
*
78+
* @returns A section element containing the animated, responsive grid of feature cards.
79+
*/
80+
export function Features() {
81+
return (
82+
<section id="features" className="py-20 px-6 relative">
83+
{/* Subtle gradient background */}
84+
<div className="absolute inset-0 bg-gradient-to-b from-transparent via-accent/[0.02] to-transparent pointer-events-none" />
85+
86+
<div className="max-w-6xl mx-auto relative">
87+
{/* Section header */}
88+
<motion.div
89+
className="text-center mb-14"
90+
initial={{ opacity: 0, y: 20 }}
91+
whileInView={{ opacity: 1, y: 0 }}
92+
viewport={{ once: true, margin: "-100px" }}
93+
transition={{ duration: 0.6, ease: [0.25, 0.4, 0.25, 1] }}
94+
>
95+
<h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4">
96+
Built for how developers actually work
97+
</h2>
98+
<p className="text-lg text-muted-foreground max-w-2xl mx-auto">
99+
Not another code search tool. CodeIntel understands your codebase the way you do.
100+
</p>
101+
</motion.div>
102+
103+
{/* Features grid */}
104+
<motion.div
105+
className="grid md:grid-cols-2 lg:grid-cols-3 gap-5"
106+
variants={containerVariants}
107+
initial="hidden"
108+
whileInView="visible"
109+
viewport={{ once: true, margin: "-50px" }}
110+
>
111+
{FEATURES.map((feature, index) => (
112+
<motion.div
113+
key={feature.title}
114+
variants={itemVariants}
115+
whileHover={{
116+
y: -8,
117+
transition: { type: 'spring', stiffness: 400, damping: 25 }
118+
}}
119+
className={`group relative p-6 rounded-xl border border-border/50 bg-card/30
120+
hover:bg-card/50 hover:border-border transition-colors duration-300
121+
hover:shadow-xl ${feature.glow}`}
122+
>
123+
{/* Icon */}
124+
<motion.div
125+
className={`w-11 h-11 rounded-xl ${feature.bg} flex items-center justify-center mb-4`}
126+
whileHover={{ scale: 1.1, rotate: 5 }}
127+
transition={{ type: 'spring', stiffness: 400, damping: 15 }}
128+
>
129+
<feature.icon className={`w-5 h-5 ${feature.color}`} />
130+
</motion.div>
131+
132+
<h3 className="text-lg font-semibold text-foreground mb-2 group-hover:text-accent transition-colors">
133+
{feature.title}
134+
</h3>
135+
<p className="text-sm text-muted-foreground leading-relaxed">
136+
{feature.description}
137+
</p>
138+
139+
{/* Subtle corner accent on hover */}
140+
<div className="absolute top-0 right-0 w-20 h-20 opacity-0 group-hover:opacity-100 transition-opacity duration-500">
141+
<div className={`absolute top-3 right-3 w-1.5 h-1.5 rounded-full ${feature.bg}`} />
142+
</div>
143+
</motion.div>
144+
))}
145+
</motion.div>
146+
</div>
147+
</section>
148+
)
149+
}

0 commit comments

Comments
 (0)