fix: refactor OverviewTableClient

This commit is contained in:
Christel Westerberg
2024-09-26 11:51:48 +02:00
parent 56cd02f90b
commit 2a5a3126fe
7 changed files with 146 additions and 133 deletions

View File

@@ -22,7 +22,7 @@ export default function LargeTable({
activeLevel,
Select,
}: LargeTableProps) {
const groupedRewards = getGroupedRewards(levels)
const keyedGroupedRewards = getGroupedRewards(levels)
return (
<table className={styles.table}>
@@ -32,27 +32,34 @@ export default function LargeTable({
Select={Select}
/>
<tbody className={styles.tbody}>
{Object.entries(groupedRewards).map(([key, groupedRewards], idx) => {
const { label, description } =
getGroupedLabelAndDescription(groupedRewards)
{Object.entries(keyedGroupedRewards).map(
([key, groupedRewards], idx) => {
const { label, description } =
getGroupedLabelAndDescription(groupedRewards)
return (
<tr key={key + idx} className={styles.tr}>
<th scope={"row"} className={styles.rewardTh}>
<RewardTableHeader name={label} description={description} />
</th>
{levels.map((level, idx) => {
const rewardIdsInGroup = groupedRewards.map((b) => b.reward_id)
const reward = findAvailableRewards(rewardIdsInGroup, level)
return (
<td key={`${reward?.reward_id}-${idx}`} className={styles.td}>
<RewardValue reward={reward} />
</td>
)
})}
</tr>
)
})}
return (
<tr key={key + idx} className={styles.tr}>
<th scope={"row"} className={styles.rewardTh}>
<RewardTableHeader name={label} description={description} />
</th>
{levels.map((level, idx) => {
const rewardIdsInGroup = groupedRewards.map(
(b) => b.reward_id
)
const reward = findAvailableRewards(rewardIdsInGroup, level)
return (
<td
key={`${reward?.reward_id}-${idx}`}
className={styles.td}
>
<RewardValue reward={reward} />
</td>
)
})}
</tr>
)
}
)}
</tbody>
</table>
)