|
| 1 | +import Link from "fumadocs-core/link"; |
| 2 | +import { |
| 3 | + ArrowRight, |
| 4 | + Code, |
| 5 | + Zap, |
| 6 | + Shield, |
| 7 | + Rocket, |
| 8 | + Database, |
| 9 | + Sparkles, |
| 10 | + Globe, |
| 11 | + Users, |
| 12 | + Star, |
| 13 | + GitBranch, |
| 14 | + Search, |
| 15 | + Brain, |
| 16 | + BookOpen, |
| 17 | + MessageSquare, |
| 18 | + Workflow, |
| 19 | +} from "lucide-react"; |
| 20 | +import { cn } from "@/lib/cn"; |
| 21 | +import { buttonVariants } from "@/components/ui/button"; |
| 22 | +import { Panel, PanelHeader, PanelTitle, PanelContent } from "@/components/ui/panel"; |
| 23 | +import { Separator } from "@/components/ui/separator"; |
| 24 | + |
| 25 | +<div className="mx-auto md:max-w-4xl *:[[id]]:scroll-mt-22"> |
| 26 | + <section className="py-16 sm:py-20 lg:py-32 xl:py-36"> |
| 27 | + <div className="text-center"> |
| 28 | + <h1 className="text-5xl sm:text-6xl lg:text-7xl mb-6 leading-tight font-semibold"> |
| 29 | + Go AI-Friendly with Mimir |
| 30 | + </h1> |
| 31 | + |
| 32 | + <div className="text-lg sm:text-xl mb-10 max-w-2xl mx-auto leading-relaxed"> |
| 33 | + Mimir is a contextual RAG system that transforms your codebase and documentation into an intelligent knowledge base. |
| 34 | + Connect your AI assistants to your entire codebase and docs with full context understanding. |
| 35 | + </div> |
| 36 | + |
| 37 | + <div className="flex flex-col sm:flex-row gap-4 justify-center items-center"> |
| 38 | + <Link |
| 39 | + href="/docs/getting-started" |
| 40 | + className={cn( |
| 41 | + buttonVariants({ variant: 'default', size: 'lg' }), |
| 42 | + 'flex items-center justify-center gap-2' |
| 43 | + )} |
| 44 | + > |
| 45 | + Get Started |
| 46 | + <ArrowRight className="w-5 h-5" /> |
| 47 | + </Link> |
| 48 | + <Link |
| 49 | + href="/docs/configuration" |
| 50 | + className={cn( |
| 51 | + buttonVariants({ variant: 'secondary', size: 'lg' }), |
| 52 | + 'flex items-center justify-center gap-2' |
| 53 | + )} |
| 54 | + > |
| 55 | + View Configuration |
| 56 | + </Link> |
| 57 | + </div> |
| 58 | + |
| 59 | + <div className="mt-12 flex flex-wrap justify-center gap-8 text-sm text-muted-foreground"> |
| 60 | + <span className="inline-flex items-center"> |
| 61 | + <Shield className="w-4 h-4 mr-1" /> |
| 62 | + Production Ready |
| 63 | + </span> |
| 64 | + <span className="inline-flex items-center"> |
| 65 | + <Sparkles className="w-4 h-4 mr-1" /> |
| 66 | + MCP Integration |
| 67 | + </span> |
| 68 | + <span className="inline-flex items-center"> |
| 69 | + <Rocket className="w-4 h-4 mr-1" /> |
| 70 | + Fast & Scalable |
| 71 | + </span> |
| 72 | + <span className="inline-flex items-center"> |
| 73 | + <Users className="w-4 h-4 mr-1" /> |
| 74 | + Open Source |
| 75 | + </span> |
| 76 | + </div> |
| 77 | + </div> |
| 78 | + </section> |
| 79 | + |
| 80 | + |
| 81 | + <Separator fullWidth /> |
| 82 | + |
| 83 | + <Panel id="why-mimir"> |
| 84 | + <PanelHeader className="mb-4"> |
| 85 | + <PanelTitle>Why Teams Choose Mimir</PanelTitle> |
| 86 | + </PanelHeader> |
| 87 | + <PanelContent> |
| 88 | + <div className="space-y-10"> |
| 89 | + <div className="flex items-start gap-4"> |
| 90 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 91 | + <Brain className="size-5 text-primary" /> |
| 92 | + </div> |
| 93 | + <div> |
| 94 | + <h3 className="mb-2 font-semibold text-lg leading-snug">Contextual Understanding</h3> |
| 95 | + <div className="text-muted-foreground leading-relaxed"> |
| 96 | + Unlike basic RAG, Mimir provides rich context around each code entity—full file content, imports, parent classes, and surrounding code. Your AI assistant understands not just what code does, but how it fits into your system. |
| 97 | + </div> |
| 98 | + </div> |
| 99 | + </div> |
| 100 | + |
| 101 | + <div className="flex items-start gap-4"> |
| 102 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 103 | + <MessageSquare className="size-5 text-primary" /> |
| 104 | + </div> |
| 105 | + <div> |
| 106 | + <h3 className="mb-2 font-semibold text-lg leading-snug">AI Assistant Integration</h3> |
| 107 | + <div className="text-muted-foreground leading-relaxed"> |
| 108 | + Connect Claude Code, VS Code, Claude Desktop, and other MCP-compatible assistants directly to your codebase. No more copy-pasting code—your AI assistant has instant access to your entire knowledge base. |
| 109 | + </div> |
| 110 | + </div> |
| 111 | + </div> |
| 112 | + |
| 113 | + <div className="flex items-start gap-4"> |
| 114 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 115 | + <Code className="size-5 text-primary" /> |
| 116 | + </div> |
| 117 | + <div> |
| 118 | + <h3 className="mb-2 font-semibold text-lg leading-snug">Automatic Entity Extraction</h3> |
| 119 | + <div className="text-muted-foreground leading-relaxed"> |
| 120 | + Automatically extracts and indexes functions, classes, interfaces, and more from TypeScript, Python, and other languages. Each entity includes JSDoc comments, parameters, return types, and direct links to source code. |
| 121 | + </div> |
| 122 | + </div> |
| 123 | + </div> |
| 124 | + </div> |
| 125 | + </PanelContent> |
| 126 | + </Panel> |
| 127 | + |
| 128 | + <div className="py-8"> |
| 129 | + <Separator fullWidth /> |
| 130 | + </div> |
| 131 | + |
| 132 | + <Panel id="features"> |
| 133 | + <PanelHeader className="mb-4"> |
| 134 | + <PanelTitle> |
| 135 | + Everything You Need to Go AI-Friendly |
| 136 | + </PanelTitle> |
| 137 | + </PanelHeader> |
| 138 | + <PanelContent> |
| 139 | + <div className="space-y-8"> |
| 140 | + <div className="flex items-start gap-4"> |
| 141 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 142 | + <GitBranch className="size-5 text-primary" /> |
| 143 | + </div> |
| 144 | + <div> |
| 145 | + <h3 className="mb-1 font-semibold leading-snug">Multiple Repositories</h3> |
| 146 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 147 | + Ingest from multiple code and documentation repositories. Perfect for monorepos, microservices, or teams with separate code and docs repos. |
| 148 | + </div> |
| 149 | + </div> |
| 150 | + </div> |
| 151 | + |
| 152 | + <div className="flex items-start gap-4"> |
| 153 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 154 | + <BookOpen className="size-5 text-primary" /> |
| 155 | + </div> |
| 156 | + <div> |
| 157 | + <h3 className="mb-1 font-semibold leading-snug">Documentation & Code</h3> |
| 158 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 159 | + Index both MDX documentation and source code. Your AI assistant can answer questions about APIs, implementation details, and usage examples. |
| 160 | + </div> |
| 161 | + </div> |
| 162 | + </div> |
| 163 | + |
| 164 | + <div className="flex items-start gap-4"> |
| 165 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 166 | + <Workflow className="size-5 text-primary" /> |
| 167 | + </div> |
| 168 | + <div> |
| 169 | + <h3 className="mb-1 font-semibold leading-snug">GitHub Webhooks</h3> |
| 170 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 171 | + Automatic ingestion on code changes. Keep your knowledge base up-to-date without manual triggers. Set up once and forget about it. |
| 172 | + </div> |
| 173 | + </div> |
| 174 | + </div> |
| 175 | + |
| 176 | + <div className="flex items-start gap-4"> |
| 177 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 178 | + <Search className="size-5 text-primary" /> |
| 179 | + </div> |
| 180 | + <div> |
| 181 | + <h3 className="mb-1 font-semibold leading-snug">OpenAI-Compatible API</h3> |
| 182 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 183 | + RESTful API that works with OpenAI-compatible SDKs and clients. Build custom interfaces or integrate with existing tools. |
| 184 | + </div> |
| 185 | + </div> |
| 186 | + </div> |
| 187 | + |
| 188 | + <div className="flex items-start gap-4"> |
| 189 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 190 | + <Database className="size-5 text-primary" /> |
| 191 | + </div> |
| 192 | + <div> |
| 193 | + <h3 className="mb-1 font-semibold leading-snug">Supabase Vector Store</h3> |
| 194 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 195 | + Built on Supabase for reliable, scalable vector storage. Fast semantic search with configurable similarity thresholds and match counts. |
| 196 | + </div> |
| 197 | + </div> |
| 198 | + </div> |
| 199 | + |
| 200 | + <div className="flex items-start gap-4"> |
| 201 | + <div className="flex size-10 shrink-0 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background"> |
| 202 | + <Zap className="size-5 text-primary" /> |
| 203 | + </div> |
| 204 | + <div> |
| 205 | + <h3 className="mb-1 font-semibold leading-snug">Multiple LLM Providers</h3> |
| 206 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 207 | + Use OpenAI, Anthropic, Google, or Mistral for embeddings and chat. Mix providers to optimize for cost and quality. |
| 208 | + </div> |
| 209 | + </div> |
| 210 | + </div> |
| 211 | + </div> |
| 212 | + </PanelContent> |
| 213 | + </Panel> |
| 214 | + |
| 215 | + <div className="py-8"> |
| 216 | + <Separator fullWidth /> |
| 217 | + </div> |
| 218 | + |
| 219 | + <Panel id="how-it-works"> |
| 220 | + <PanelHeader className="mb-4"> |
| 221 | + <PanelTitle>How It Works</PanelTitle> |
| 222 | + </PanelHeader> |
| 223 | + <PanelContent> |
| 224 | + <div className="grid md:grid-cols-3 gap-8"> |
| 225 | + <div className="text-center"> |
| 226 | + <div className="flex size-16 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background mb-4 mx-auto"> |
| 227 | + <span className="text-2xl font-bold text-primary">1</span> |
| 228 | + </div> |
| 229 | + <h3 className="mb-2 font-semibold text-lg leading-snug">Ingest</h3> |
| 230 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 231 | + Mimir fetches your code and documentation from GitHub repositories, extracts entities, and creates rich contextual embeddings. |
| 232 | + </div> |
| 233 | + </div> |
| 234 | + |
| 235 | + <div className="text-center"> |
| 236 | + <div className="flex size-16 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background mb-4 mx-auto"> |
| 237 | + <span className="text-2xl font-bold text-primary">2</span> |
| 238 | + </div> |
| 239 | + <h3 className="mb-2 font-semibold text-lg leading-snug">Store</h3> |
| 240 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 241 | + Embeddings are stored in Supabase with source URLs, metadata, and full context. Everything is indexed and ready for semantic search. |
| 242 | + </div> |
| 243 | + </div> |
| 244 | + |
| 245 | + <div className="text-center"> |
| 246 | + <div className="flex size-16 items-center justify-center rounded-lg border border-muted-foreground/15 bg-muted ring-1 ring-edge ring-offset-1 ring-offset-background mb-4 mx-auto"> |
| 247 | + <span className="text-2xl font-bold text-primary">3</span> |
| 248 | + </div> |
| 249 | + <h3 className="mb-2 font-semibold text-lg leading-snug">Query</h3> |
| 250 | + <div className="text-sm text-muted-foreground leading-relaxed"> |
| 251 | + Your AI assistant queries Mimir via MCP or REST API, gets relevant chunks with full context, and provides accurate answers with source links. |
| 252 | + </div> |
| 253 | + </div> |
| 254 | + </div> |
| 255 | + </PanelContent> |
| 256 | + </Panel> |
| 257 | + |
| 258 | + <div className="py-8"> |
| 259 | + <Separator fullWidth /> |
| 260 | + </div> |
| 261 | + |
| 262 | + <Panel id="cta"> |
| 263 | + <PanelHeader className="mb-4"> |
| 264 | + <PanelTitle>Ready to Go AI-Friendly?</PanelTitle> |
| 265 | + </PanelHeader> |
| 266 | + <PanelContent> |
| 267 | + <div className="text-center"> |
| 268 | + <div className="mb-6 text-muted-foreground leading-relaxed"> |
| 269 | + Get your codebase and documentation queryable by AI in minutes. Start building with Mimir today. |
| 270 | + </div> |
| 271 | + |
| 272 | + <div className="flex flex-col sm:flex-row gap-4 justify-center items-center"> |
| 273 | + <Link |
| 274 | + href="/docs/getting-started" |
| 275 | + className={cn( |
| 276 | + buttonVariants({ variant: 'default', size: 'lg' }), |
| 277 | + 'flex items-center justify-center gap-2' |
| 278 | + )} |
| 279 | + > |
| 280 | + Get Started |
| 281 | + <ArrowRight className="w-5 h-5" /> |
| 282 | + </Link> |
| 283 | + |
| 284 | + <Link |
| 285 | + href="/docs/configuration" |
| 286 | + className={cn( |
| 287 | + buttonVariants({ variant: 'secondary', size: 'lg' }), |
| 288 | + 'flex items-center justify-center gap-2' |
| 289 | + )} |
| 290 | + > |
| 291 | + <Globe className="w-5 h-5" /> |
| 292 | + View Documentation |
| 293 | + </Link> |
| 294 | + </div> |
| 295 | + </div> |
| 296 | + </PanelContent> |
| 297 | + </Panel> |
| 298 | + |
| 299 | + <Separator fullWidth /> |
| 300 | +</div> |
0 commit comments