components/faq/FaqCard.tsx


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

import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"

export interface FaqItem {
    title: string;
    content: string[];
}

export interface FaqCategory {
    label: string;  // 카테고리 이름 (식별자로도 사용)
    items: {
        title: string;
        content: string[];
    }[];
} 

interface FaqCardProps {
    item: FaqItem;
}

export function FaqCard({ item }: FaqCardProps) {
    return (
        <Card>
            <CardHeader>
                <CardTitle>{item.title}</CardTitle>
            </CardHeader>
            <CardContent>
                {item.content.map((line, index) => (
                    <div key={index}>
                        {line}
                        {index < item.content.length - 1 && <br />}
                    </div>
                ))}
            </CardContent>
        </Card>
    )
}