52 lines
1.3 KiB
TypeScript
52 lines
1.3 KiB
TypeScript
import { Button } from '@/components/ui-v2/button'
|
|
import { ArrowRight } from 'lucide-react'
|
|
|
|
const exampleMessages = [
|
|
{
|
|
heading: 'Why is Nvidia growing rapidly?',
|
|
message: 'Why is Nvidia growing rapidly?'
|
|
},
|
|
{
|
|
heading: 'Is the Apple Vision Pro worth buying?',
|
|
message: 'Is the Apple Vision Pro worth buying?'
|
|
},
|
|
{
|
|
heading: 'How does the Vercel AI SDK work?',
|
|
message: 'How does the Vercel AI SDK work?'
|
|
},
|
|
{
|
|
heading: 'Tesla vs Rivian',
|
|
message: 'Tesla vs Rivian'
|
|
}
|
|
]
|
|
export function EmptyScreen({
|
|
submitMessage,
|
|
className
|
|
}: {
|
|
submitMessage: (message: string) => void
|
|
className?: string
|
|
}) {
|
|
return (
|
|
<div className={`mx-auto w-full transition-all ${className}`}>
|
|
<div className="bg-background p-2">
|
|
<div className="mt-4 flex flex-col items-start space-y-2 mb-4">
|
|
{exampleMessages.map((message, index) => (
|
|
<Button
|
|
key={index}
|
|
variant="link"
|
|
className="h-auto p-0 text-base"
|
|
name={message.message}
|
|
onClick={async () => {
|
|
submitMessage(message.message)
|
|
}}
|
|
>
|
|
<ArrowRight size={16} className="mr-2 text-muted-foreground" />
|
|
{message.heading}
|
|
</Button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|