fix(analytics): use React.Fragment with key for expandable category rows
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { useState, Fragment } from "react";
|
||||
import {
|
||||
ComposedChart,
|
||||
BarChart,
|
||||
@@ -551,9 +551,8 @@ export default function AnalyticsPage() {
|
||||
{categoryRows.map(({ category, spent, txCount }) => {
|
||||
const isExpanded = expandedCategory === category;
|
||||
return (
|
||||
<>
|
||||
<Fragment key={category}>
|
||||
<tr
|
||||
key={category}
|
||||
className={`border-b border-zinc-800/50 cursor-pointer select-none transition-colors ${
|
||||
isExpanded ? "bg-zinc-800/40" : "hover:bg-zinc-800/30"
|
||||
}`}
|
||||
@@ -581,12 +580,11 @@ export default function AnalyticsPage() {
|
||||
</tr>
|
||||
{isExpanded && (
|
||||
<CategoryPanel
|
||||
key={`panel-${category}`}
|
||||
category={category}
|
||||
selectedMonth={selectedMonth}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
})}
|
||||
</tbody>
|
||||
|
||||
Reference in New Issue
Block a user