fix(analytics): use React.Fragment with key for expandable category rows
This commit is contained in:
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user