Files
nextjs-startup/components/sections/features/api-terminal.tsx
T
Rami Bitar c84dc9dbe7 Organize Vertex starter into reusable sections
Use remote logos and avatars, refine landing copy, and document the template structure.
2026-09-15 10:49:07 -04:00

35 lines
1.2 KiB
TypeScript

"use client"
import {
AnimatedSpan,
Terminal,
TypingAnimation,
} from "@/components/ui/terminal"
export function ApiTerminal() {
return (
<div className="flex flex-1 items-center justify-center overflow-hidden bg-background p-5 sm:p-10">
<Terminal className="max-w-xl bg-background shadow-[0_24px_70px_rgba(0,0,0,.12)]" sequence>
<TypingAnimation duration={22}>
{"> curl https://api.vertex.ai/v1/chat/completions \\"}
</TypingAnimation>
<AnimatedSpan className="text-muted-foreground">
{` -d '{ "model": "vertex/auto", "messages": [...] }'`}
</AnimatedSpan>
<AnimatedSpan className="text-blue-500">
→ evaluating 14 available models
</AnimatedSpan>
<AnimatedSpan className="text-blue-600 dark:text-blue-400">
→ route selected: anthropic/claude-sonnet
</AnimatedSpan>
<AnimatedSpan className="text-emerald-500">
✓ response streamed in 342ms
</AnimatedSpan>
<TypingAnimation duration={18} className="text-muted-foreground">
One endpoint. Any model. No rewrites.
</TypingAnimation>
</Terminal>
</div>
)
}