import { ReactNode } from "react";

export interface ExpressionCardProps {
    prompt: string;
    categories: string[];
    description: ReactNode;
    show_description?: boolean;
}

export function ExpressionCard({ prompt, categories, description, show_description }: ExpressionCardProps) {
    return (
        <article className="expression-card">
            <h2 className="expression-card-prompt">{prompt}</h2>
            <h3 className="expression-card-categories">{categories.join(", ")}</h3>
            {show_description && <div className="expression-card-details">{description}</div>}
        </article>
    );
}