dmitry.galkin/chatbot-template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: remove zustand and use input and setInput

Browse source
This commit is contained in:
shadcn 2023-06-13 22:16:54 +04:00
parent 6f69b878d5
commit f476c903ef
8 changed files with 83 additions and 95 deletions
Download patch file Download diff file Expand all files Collapse all files

62
components/empty-screen.tsx
View file

@ -1,8 +1,8 @@
import { useChatStore } from '@/lib/hooks/use-chat-store'
import { cn } from '@/lib/utils'
import { Button } from '@/components/ui/button'
import { ExternalLink } from '@/components/external-link'
import { IconArrowRight } from '@/components/ui/icons'
import { UseChatHelpers } from 'ai-connector'
const exampleMessages = [
{
@ -19,37 +19,37 @@ const exampleMessages = [
}
]
export function EmptyScreen({ className }: React.ComponentProps<'div'>) {
const { setDefaultMessage } = useChatStore()
export function EmptyScreen({ setInput }: Pick<UseChatHelpers, 'setInput'>) {
return (
<div className={cn('rounded-lg border bg-background p-8', className)}>
<h1 className="mb-2 text-lg font-semibold">
Welcome to Next.js Chatbot!
</h1>
<p className="mb-2 leading-normal text-muted-foreground">
This is an open source AI chatbot app built with{' '}
<ExternalLink href="https://nextjs.org">Next.js</ExternalLink> and{' '}
<ExternalLink href="https://vercel.com/storage/kv">
Vercel KV
</ExternalLink>
.
</p>
<p className="leading-normal text-muted-foreground">
You can start a conversation here or try the following examples:
</p>
<div className="mt-4 flex flex-col items-start space-y-2">
{exampleMessages.map((message, index) => (
<Button
key={index}
variant="link"
className="h-auto p-0 text-base"
onClick={() => setDefaultMessage(message.message)}
>
<IconArrowRight className="mr-2 text-muted-foreground" />
{message.heading}
</Button>
))}
<div className="mx-auto max-w-2xl px-4">
<div className="rounded-lg border bg-background p-8">
<h1 className="mb-2 text-lg font-semibold">
Welcome to Next.js Chatbot!
</h1>
<p className="mb-2 leading-normal text-muted-foreground">
This is an open source AI chatbot app built with{' '}
<ExternalLink href="https://nextjs.org">Next.js</ExternalLink> and{' '}
<ExternalLink href="https://vercel.com/storage/kv">
Vercel KV
</ExternalLink>
.
</p>
<p className="leading-normal text-muted-foreground">
You can start a conversation here or try the following examples:
</p>
<div className="mt-4 flex flex-col items-start space-y-2">
{exampleMessages.map((message, index) => (
<Button
key={index}
variant="link"
className="h-auto p-0 text-base"
onClick={() => setInput(message.message)}
>
<IconArrowRight className="mr-2 text-muted-foreground" />
{message.heading}
</Button>
))}
</div>
</div>
</div>
)