48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useRef } from "react";
|
|
|
|
import { Typography } from "@/components/ui";
|
|
import { useChatStore } from "@/providers/chat-store-provider";
|
|
|
|
import styles from "./Suggestions.module.scss";
|
|
|
|
interface SuggestionsProps {
|
|
onSuggestionClick: (suggestion: string) => void;
|
|
}
|
|
|
|
export default function Suggestions({ onSuggestionClick }: SuggestionsProps) {
|
|
const { suggestions, setSuggestionsHeight } = useChatStore(state => state);
|
|
const suggestionsRef = useRef<HTMLDivElement>(null);
|
|
|
|
useEffect(() => {
|
|
setSuggestionsHeight(suggestionsRef.current?.clientHeight ?? 0);
|
|
}, [setSuggestionsHeight, suggestions]);
|
|
|
|
return (
|
|
<>
|
|
{!!suggestions?.length && (
|
|
<div className={styles.container} ref={suggestionsRef}>
|
|
{suggestions?.map((suggestion, index) => (
|
|
<div
|
|
key={`suggestion-${index}`}
|
|
className={styles.suggestion}
|
|
onClick={() => {
|
|
onSuggestionClick(suggestion);
|
|
}}
|
|
>
|
|
<Typography
|
|
as="p"
|
|
weight="medium"
|
|
className={styles.suggestionText}
|
|
>
|
|
{suggestion}
|
|
</Typography>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)}
|
|
</>
|
|
);
|
|
}
|