Added nudges component
This commit is contained in:
parent
398c5f3003
commit
382df1064e
1 changed files with 27 additions and 0 deletions
27
frontend/src/app/chat/nudges.tsx
Normal file
27
frontend/src/app/chat/nudges.tsx
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
export default function Nudges({
|
||||||
|
nudges,
|
||||||
|
handleSuggestionClick,
|
||||||
|
}: {
|
||||||
|
nudges: string[];
|
||||||
|
handleSuggestionClick: (suggestion: string) => void;
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<div className="flex-shrink-0 px-6 flex justify-center">
|
||||||
|
<div className="w-full max-w-[75%] relative">
|
||||||
|
<div className="flex gap-3 justify-start overflow-x-auto scrollbar-hide">
|
||||||
|
{nudges.map((suggestion: string, index: number) => (
|
||||||
|
<button
|
||||||
|
key={index}
|
||||||
|
onClick={() => handleSuggestionClick(suggestion)}
|
||||||
|
className="px-2 py-1.5 bg-muted hover:bg-muted/50 rounded-lg text-sm text-placeholder-foreground hover:text-foreground transition-colors whitespace-nowrap"
|
||||||
|
>
|
||||||
|
{suggestion}
|
||||||
|
</button>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
{/* Fade out gradient on the right */}
|
||||||
|
<div className="absolute right-0 top-0 bottom-0 w-8 bg-gradient-to-l from-background to-transparent pointer-events-none"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Add table
Reference in a new issue