Spaces:
Build error
Build error
File size: 1,850 Bytes
7d9d30d 719d697 0702eb8 7d9d30d 0702eb8 b4297ca 0702eb8 b4297ca 719d697 b4297ca 0702eb8 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
import { Button } from "@/app/components/ui/button";
import { Input } from "@/app/components/ui/input";
import { ChatHandler } from "@/app/components/ui/chat/chat.interface";
import { IconSpinner } from "@/app/components/ui/icons";
import { Send } from "lucide-react";
export default function ChatInput(
props: Pick<
ChatHandler,
"isLoading" | "handleSubmit" | "handleInputChange" | "input"
>,
) {
return (
<form
onSubmit={props.handleSubmit}
className="w-full items-start justify-between gap-4 rounded-xl bg-white dark:bg-zinc-700/30 p-4 shadow-xl"
>
<div className="flex w-full items-start justify-between gap-4">
<Input
autoFocus
name="message"
placeholder="Type a Message"
className="flex-1 bg-white dark:bg-zinc-500/30"
value={props.input}
onChange={props.handleInputChange}
/>
<Button type="submit" disabled={props.isLoading} className="hidden md:flex items-center transition duration-300 ease-in-out transform hover:scale-110 z-10">
{props.isLoading ? (
<IconSpinner className="animate-spin" />
) : (
// Fragment to avoid wrapping the text in a button
<>
<span className="pr-2">Send</span>
<Send className="h-5 w-5" />
</>
)}
</Button>
<Button type="submit" disabled={props.isLoading} className="md:hidden z-10"> {/* Hide on larger screens */}
{props.isLoading ? (
<IconSpinner className="animate-spin" />
) : (
<Send className="h-5 w-5" />
)}
</Button>
</div>
<p className="text-center text-sm text-gray-400 mt-2">Smart Retrieval may not be 100% accurate. Consider checking important information.</p>
</form>
);
}
|