64 lines
1.5 KiB
TypeScript
64 lines
1.5 KiB
TypeScript
import Image from "@/components/Image"
|
|
|
|
import LevelSummary from "../../LevelSummary"
|
|
import YourLevel from "../../YourLevelScript"
|
|
|
|
import styles from "./desktopHeader.module.css"
|
|
|
|
import type {
|
|
DesktopSelectColumns,
|
|
LargeTableProps,
|
|
} from "@/types/components/overviewTable"
|
|
|
|
export default function DesktopHeader({
|
|
levels,
|
|
activeLevel,
|
|
Select,
|
|
}: LargeTableProps) {
|
|
return (
|
|
<thead>
|
|
<tr className={styles.iconRow}>
|
|
<th className={styles.verticalTableHeader} />
|
|
{levels.map((level, idx) => {
|
|
return (
|
|
<th key={"image" + level.level + idx} className={styles.iconTh}>
|
|
{activeLevel === level.level ? <YourLevel /> : null}
|
|
<Image
|
|
height={50}
|
|
width={100}
|
|
alt={level.name}
|
|
src={level.icon}
|
|
/>
|
|
</th>
|
|
)
|
|
})}
|
|
</tr>
|
|
<tr>
|
|
<th />
|
|
{levels.map((level, idx) => {
|
|
return (
|
|
<th
|
|
key={"summary" + level.level + idx}
|
|
className={styles.summaryTh}
|
|
>
|
|
<LevelSummary level={level} />
|
|
</th>
|
|
)
|
|
})}
|
|
</tr>
|
|
{Select && (
|
|
<tr>
|
|
<th />
|
|
{["A", "B", "C"].map((column, idx) => {
|
|
return (
|
|
<th key={column + idx} className={styles.select}>
|
|
<Select column={column as DesktopSelectColumns["column"]} />
|
|
</th>
|
|
)
|
|
})}
|
|
</tr>
|
|
)}
|
|
</thead>
|
|
)
|
|
}
|