Replace Vercel AI SDK with Anthropic Claude Agent SDK. Add standalone agent server (packages/agent-server/) with MCP tools, JWT auth, and SSE streaming. Introduce bridge API routes (src/app/api/compass/) and custom SSE hooks (use-agent, use-compass-chat) replacing useChat. Remove provider.ts, tools.ts, system-prompt.ts, github-tools.ts, usage.ts, and old agent route.
35 lines
1.1 KiB
TypeScript
Executable File
35 lines
1.1 KiB
TypeScript
Executable File
import type { GeneratedImage } from "./types"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export type ImageProps = GeneratedImage & {
|
|
className?: string
|
|
alt?: string
|
|
}
|
|
|
|
export const Image = ({ base64, uint8Array, mediaType, ...props }: ImageProps) => (
|
|
<img
|
|
{...props}
|
|
alt={props.alt}
|
|
className={cn("h-auto max-w-full overflow-hidden rounded-md", props.className)}
|
|
height={400}
|
|
src={`data:${mediaType};base64,${base64}`}
|
|
width={400}
|
|
/>
|
|
)
|
|
|
|
/** Demo component for preview */
|
|
export default function ImageDemo() {
|
|
return (
|
|
<div className="flex items-center justify-center p-8">
|
|
<div className="flex flex-col items-center gap-4">
|
|
<div className="relative h-[200px] w-[200px] overflow-hidden rounded-md border bg-gradient-to-br from-purple-500 via-pink-500 to-orange-400">
|
|
<div className="absolute inset-0 flex items-center justify-center">
|
|
<span className="font-medium text-white text-xl">AI Generated</span>
|
|
</div>
|
|
</div>
|
|
<p className="text-muted-foreground text-sm">Base64-encoded image from AI SDK</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|