58 lines
1.6 KiB
TypeScript
58 lines
1.6 KiB
TypeScript
import * as React from "react";
|
|
import { ChartDataPoint, HistoryChartProps, ChartData } from "./HistoryChart.models";
|
|
import HistoryChartView from "./HistoryChart.view";
|
|
|
|
export default function HistoryChart(props: HistoryChartProps) {
|
|
const { tabs, data, mode, periodType, comparison } = props;
|
|
|
|
const [activeTab, setActiveTab] = React.useState<string>(tabs[0] || "");
|
|
const [startIndex, setStartIndex] = React.useState(0);
|
|
|
|
const activeDataKey = activeTab.toLowerCase() as keyof ChartData;
|
|
|
|
let rawData: ChartDataPoint[] = [];
|
|
|
|
const section = data[activeDataKey];
|
|
rawData = section?.[periodType] || [];
|
|
|
|
const currentData = rawData;
|
|
|
|
const maxAmount =
|
|
currentData.length > 0
|
|
? Math.max(
|
|
...currentData.flatMap((d) =>
|
|
comparison ? [d.amount, d.compare?.amount ?? 0] : [d.amount]
|
|
),
|
|
1
|
|
)
|
|
: 1;
|
|
|
|
const visibleCountMap = { daily: 7, weekly: 6, monthly: 4 };
|
|
// const visibleCountMap = { daily: 7, weekly: 6, monthly: 4, yearly: 4, fyly: 4, full: 4 };
|
|
const visibleCount = visibleCountMap[activeDataKey];
|
|
|
|
const total = currentData.length;
|
|
|
|
const clampedStartIndex = Math.min(startIndex, Math.max(total - visibleCount, 0));
|
|
|
|
const visibleData = currentData.slice(
|
|
clampedStartIndex,
|
|
clampedStartIndex + visibleCount
|
|
);
|
|
|
|
return (
|
|
<HistoryChartView
|
|
{...props}
|
|
activeTab={activeTab}
|
|
setActiveTab={setActiveTab}
|
|
currentData={currentData}
|
|
visibleData={visibleData}
|
|
maxAmount={maxAmount}
|
|
visibleCount={visibleCount}
|
|
startIndex={startIndex}
|
|
setStartIndex={setStartIndex}
|
|
activeDataKey={activeDataKey}
|
|
/>
|
|
);
|
|
}
|