github-starred/actual
2
0
Fork 0
mirror of https://github.com/actualbudget/actual.git synced 2026-03-21 15:36:50 -05:00
Code Issues 250 Packages Projects Releases 53 Wiki Activity

fix crossover report resizing bug (#6821)

Browse Source 
* fix crossover report

* note
This commit is contained in:
Matt Fiddaman
2026-01-30 21:27:20 +00:00
committed by GitHub
parent 2ec592c2d6
commit 1eb68c8e19
2 changed files with 66 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
packages/desktop-client/src/components/reports/graphs/CrossoverGraph.tsx
View File

@@ -9,7 +9,6 @@ import {
Line,
LineChart,
ReferenceLine,
ResponsiveContainer,
Tooltip,
XAxis,
YAxis,
@@ -176,73 +175,66 @@ export function CrossoverGraph({
}}
>
{(width, height) => (
<ResponsiveContainer>
<div style={{ ...(!compact && { marginTop: '15px' }) }}>
<LineChart
width={width}
height={height}
data={graphData.data}
margin={{
top: 0,
right: 0,
left: compact ? 0 : 20,
bottom: compact ? 0 : 10,
}}
>
{!compact && <CartesianGrid strokeDasharray="3 3" />}
<XAxis
dataKey="x"
hide={compact}
tick={{ fill: theme.pageText }}
tickLine={{ stroke: theme.pageText }}
/>
<YAxis
hide={compact}
tickFormatter={tickFormatter}
tick={{ fill: theme.pageText }}
tickLine={{ stroke: theme.pageText }}
/>
{showTooltip && (
<Tooltip
content={<CustomTooltip />}
isAnimationActive={false}
/>
)}
{graphData.crossoverXLabel && (
<ReferenceLine
x={graphData.crossoverXLabel}
stroke={theme.noticeText}
strokeDasharray="4 4"
/>
)}
<Line
type="monotone"
dataKey="investmentIncome"
dot={false}
stroke={theme.reportsNumberPositive}
strokeWidth={2}
{...animationProps}
/>
<Line
type="monotone"
dataKey="expenses"
dot={false}
stroke={theme.reportsNumberNegative}
strokeWidth={2}
{...animationProps}
/>
<Line
type="monotone"
dataKey="adjustedExpenses"
dot={false}
stroke={theme.reportsNumberNegative}
strokeWidth={2}
strokeDasharray="5 5"
{...animationProps}
/>
</LineChart>
</div>
</ResponsiveContainer>
<LineChart
width={width}
height={height}
data={graphData.data}
margin={{
top: compact ? 0 : 15,
right: 0,
left: compact ? 0 : 20,
bottom: compact ? 0 : 10,
}}
>
{!compact && <CartesianGrid strokeDasharray="3 3" />}
<XAxis
dataKey="x"
hide={compact}
tick={{ fill: theme.pageText }}
tickLine={{ stroke: theme.pageText }}
/>
<YAxis
hide={compact}
tickFormatter={tickFormatter}
tick={{ fill: theme.pageText }}
tickLine={{ stroke: theme.pageText }}
/>
{showTooltip && (
<Tooltip content={<CustomTooltip />} isAnimationActive={false} />
)}
{graphData.crossoverXLabel && (
<ReferenceLine
x={graphData.crossoverXLabel}
stroke={theme.noticeText}
strokeDasharray="4 4"
/>
)}
<Line
type="monotone"
dataKey="investmentIncome"
dot={false}
stroke={theme.reportsNumberPositive}
strokeWidth={2}
{...animationProps}
/>
<Line
type="monotone"
dataKey="expenses"
dot={false}
stroke={theme.reportsNumberNegative}
strokeWidth={2}
{...animationProps}
/>
<Line
type="monotone"
dataKey="adjustedExpenses"
dot={false}
stroke={theme.reportsNumberNegative}
strokeWidth={2}
strokeDasharray="5 5"
{...animationProps}
/>
</LineChart>
)}
</Container>
);