From 83f13cbdc85c2c3a7d2404b603398d3a41cbfc28 Mon Sep 17 00:00:00 2001
From: Neil <55785687+carkom@users.noreply.github.com>
Date: Sat, 20 Jan 2024 21:18:15 +0000
Subject: [PATCH] add compact to custom reports (#2258)
* add compact
* notes
---
.../reports/graphs/tableGraph/ReportTable.tsx | 3 ++-
.../reports/graphs/tableGraph/ReportTableHeader.tsx | 10 +++++-----
.../reports/graphs/tableGraph/ReportTableList.tsx | 6 +++++-
.../reports/graphs/tableGraph/ReportTableRow.tsx | 12 +++++++-----
.../reports/graphs/tableGraph/ReportTableTotals.tsx | 10 +++++-----
.../src/components/reports/reports/CustomReport.jsx | 2 +-
upcoming-release-notes/2258.md | 6 ++++++
7 files changed, 31 insertions(+), 18 deletions(-)
create mode 100644 upcoming-release-notes/2258.md
diff --git a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTable.tsx b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTable.tsx
index 4d380951f..9aa4e7a92 100644
--- a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTable.tsx
+++ b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTable.tsx
@@ -50,7 +50,7 @@ export function ReportTable({
});
const renderItem = useCallback(
- ({ item, groupByItem, mode, style, monthsCount }) => {
+ ({ item, groupByItem, mode, style, monthsCount, compact }) => {
return (
<ReportTableRow
item={item}
@@ -59,6 +59,7 @@ export function ReportTable({
mode={mode}
style={style}
monthsCount={monthsCount}
+ compact={compact}
/>
);
},
diff --git a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableHeader.tsx b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableHeader.tsx
index 7db0209fd..ea81dc534 100644
--- a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableHeader.tsx
+++ b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableHeader.tsx
@@ -64,7 +64,7 @@ export function ReportTableHeader({
return (
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
key={index}
@@ -77,7 +77,7 @@ export function ReportTableHeader({
<>
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value="Deposits"
@@ -85,7 +85,7 @@ export function ReportTableHeader({
/>
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value="Payments"
@@ -95,7 +95,7 @@ export function ReportTableHeader({
)}
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value="Totals"
@@ -103,7 +103,7 @@ export function ReportTableHeader({
/>
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value="Average"
diff --git a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableList.tsx b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableList.tsx
index ca8c7621d..d961144b6 100644
--- a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableList.tsx
+++ b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableList.tsx
@@ -30,8 +30,9 @@ export function ReportTableList({
index: number;
parent_index?: number;
style?: CSSProperties;
+ compact: boolean;
};
- function RenderRow({ index, parent_index, style }: RenderRowProps) {
+ function RenderRow({ index, parent_index, style, compact }: RenderRowProps) {
const item =
parent_index === undefined
? data[index]
@@ -43,6 +44,7 @@ export function ReportTableList({
mode,
style,
monthsCount,
+ compact,
});
}
@@ -55,6 +57,7 @@ export function ReportTableList({
<>
<RenderRow
index={index}
+ compact={compact}
style={
item.categories && {
color: theme.tableRowHeaderText,
@@ -71,6 +74,7 @@ export function ReportTableList({
<RenderRow
key={category.id}
index={i}
+ compact={compact}
parent_index={index}
/>
);
diff --git a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableRow.tsx b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableRow.tsx
index b0adffaa2..4779f22df 100644
--- a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableRow.tsx
+++ b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableRow.tsx
@@ -17,6 +17,7 @@ type ReportTableRowProps = {
mode: string;
style?: CSSProperties;
monthsCount: number;
+ compact: boolean;
};
export const ReportTableRow = memo(
@@ -27,6 +28,7 @@ export const ReportTableRow = memo(
mode,
style,
monthsCount,
+ compact,
}: ReportTableRowProps) => {
const average = amountToInteger(item[balanceTypeOp]) / monthsCount;
return (
@@ -54,7 +56,7 @@ export const ReportTableRow = memo(
<Cell
key={amountToCurrency(month[balanceTypeOp])}
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value={amountToCurrency(month[balanceTypeOp])}
@@ -80,7 +82,7 @@ export const ReportTableRow = memo(
width="flex"
privacyFilter
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
/>
@@ -94,7 +96,7 @@ export const ReportTableRow = memo(
width="flex"
privacyFilter
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
/>
@@ -109,7 +111,7 @@ export const ReportTableRow = memo(
}
style={{
fontWeight: 600,
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
width="flex"
@@ -124,7 +126,7 @@ export const ReportTableRow = memo(
}
style={{
fontWeight: 600,
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
width="flex"
diff --git a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableTotals.tsx b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableTotals.tsx
index c149e5d6c..784f6054e 100644
--- a/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableTotals.tsx
+++ b/packages/desktop-client/src/components/reports/graphs/tableGraph/ReportTableTotals.tsx
@@ -85,7 +85,7 @@ export function ReportTableTotals({
return (
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
key={amountToCurrency(item[balanceTypeOp])}
@@ -104,7 +104,7 @@ export function ReportTableTotals({
<>
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value={amountToCurrency(data.totalAssets)}
@@ -118,7 +118,7 @@ export function ReportTableTotals({
/>
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value={amountToCurrency(data.totalDebts)}
@@ -134,7 +134,7 @@ export function ReportTableTotals({
)}
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value={amountToCurrency(data[balanceTypeOp])}
@@ -148,7 +148,7 @@ export function ReportTableTotals({
/>
<Cell
style={{
- minWidth: 85,
+ minWidth: compact ? 80 : 125,
...styles.tnum,
}}
value={integerToCurrency(Math.round(average))}
diff --git a/packages/desktop-client/src/components/reports/reports/CustomReport.jsx b/packages/desktop-client/src/components/reports/reports/CustomReport.jsx
index 009a66e88..c182ec384 100644
--- a/packages/desktop-client/src/components/reports/reports/CustomReport.jsx
+++ b/packages/desktop-client/src/components/reports/reports/CustomReport.jsx
@@ -54,7 +54,7 @@ export function CustomReport() {
} = useFilters();
const location = useLocation();
- const loadReport = location.state.report ?? defaultState;
+ const loadReport = location.state && (location.state.report ?? defaultState);
const [allMonths, setAllMonths] = useState(null);
const [typeDisabled, setTypeDisabled] = useState(['Net']);
diff --git a/upcoming-release-notes/2258.md b/upcoming-release-notes/2258.md
new file mode 100644
index 000000000..372cadd50
--- /dev/null
+++ b/upcoming-release-notes/2258.md
@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [carkom]
+---
+
+Adding compact elements to custom reports.
--
GitLab