fix(analytics): use React.Fragment with key for expandable category rows

This commit is contained in:
2026-03-08 21:03:53 +11:00
parent 3cf67f6e2a
commit 1eff0f9337
+3 -5
View File
@@ -1,6 +1,6 @@
"use client"; "use client";
import { useState } from "react"; import { useState, Fragment } from "react";
import { import {
ComposedChart, ComposedChart,
BarChart, BarChart,
@@ -551,9 +551,8 @@ export default function AnalyticsPage() {
{categoryRows.map(({ category, spent, txCount }) => { {categoryRows.map(({ category, spent, txCount }) => {
const isExpanded = expandedCategory === category; const isExpanded = expandedCategory === category;
return ( return (
<> <Fragment key={category}>
<tr <tr
key={category}
className={`border-b border-zinc-800/50 cursor-pointer select-none transition-colors ${ className={`border-b border-zinc-800/50 cursor-pointer select-none transition-colors ${
isExpanded ? "bg-zinc-800/40" : "hover:bg-zinc-800/30" isExpanded ? "bg-zinc-800/40" : "hover:bg-zinc-800/30"
}`} }`}
@@ -581,12 +580,11 @@ export default function AnalyticsPage() {
</tr> </tr>
{isExpanded && ( {isExpanded && (
<CategoryPanel <CategoryPanel
key={`panel-${category}`}
category={category} category={category}
selectedMonth={selectedMonth} selectedMonth={selectedMonth}
/> />
)} )}
</> </Fragment>
); );
})} })}
</tbody> </tbody>