From a2e434a1fbc35d2300e86a53b1b2919d106dbdff Mon Sep 17 00:00:00 2001
From: Matiss Janis Aboltins <matiss@mja.lv>
Date: Tue, 6 Aug 2024 20:47:43 +0100
Subject: [PATCH] :recycle: (reports) improve useReports data fetching hook to
return loading state (#3198)
---
.../autocomplete/ReportAutocomplete.tsx | 2 +-
.../src/components/reports/Overview.tsx | 2 +-
.../src/components/reports/SaveReport.tsx | 2 +-
.../src/components/util/GenericInput.jsx | 2 +-
.../loot-core/src/client/data-hooks/reports.ts | 15 +++++++++++----
upcoming-release-notes/3198.md | 6 ++++++
6 files changed, 21 insertions(+), 8 deletions(-)
create mode 100644 upcoming-release-notes/3198.md
diff --git a/packages/desktop-client/src/components/autocomplete/ReportAutocomplete.tsx b/packages/desktop-client/src/components/autocomplete/ReportAutocomplete.tsx
index d3183133b..d989604f3 100644
--- a/packages/desktop-client/src/components/autocomplete/ReportAutocomplete.tsx
+++ b/packages/desktop-client/src/components/autocomplete/ReportAutocomplete.tsx
@@ -14,7 +14,7 @@ export function ReportAutocomplete({
embedded,
...props
}: ReportAutocompleteProps) {
- const reports = useReports() || [];
+ const { data: reports } = useReports();
return (
<Autocomplete
diff --git a/packages/desktop-client/src/components/reports/Overview.tsx b/packages/desktop-client/src/components/reports/Overview.tsx
index 34fb1b17a..a2a71ef83 100644
--- a/packages/desktop-client/src/components/reports/Overview.tsx
+++ b/packages/desktop-client/src/components/reports/Overview.tsx
@@ -21,7 +21,7 @@ import { NetWorthCard } from './reports/NetWorthCard';
import { SpendingCard } from './reports/SpendingCard';
export function Overview() {
- const customReports = useReports();
+ const { data: customReports } = useReports();
const { isNarrowWidth } = useResponsive();
const location = useLocation();
diff --git a/packages/desktop-client/src/components/reports/SaveReport.tsx b/packages/desktop-client/src/components/reports/SaveReport.tsx
index 185919f0e..e961d8e2d 100644
--- a/packages/desktop-client/src/components/reports/SaveReport.tsx
+++ b/packages/desktop-client/src/components/reports/SaveReport.tsx
@@ -34,7 +34,7 @@ export function SaveReport({
savedStatus,
onReportChange,
}: SaveReportProps) {
- const listReports = useReports();
+ const { data: listReports } = useReports();
const triggerRef = useRef(null);
const [deleteMenuOpen, setDeleteMenuOpen] = useState(false);
const [nameMenuOpen, setNameMenuOpen] = useState(false);
diff --git a/packages/desktop-client/src/components/util/GenericInput.jsx b/packages/desktop-client/src/components/util/GenericInput.jsx
index f0152fa23..ed59442c0 100644
--- a/packages/desktop-client/src/components/util/GenericInput.jsx
+++ b/packages/desktop-client/src/components/util/GenericInput.jsx
@@ -34,7 +34,7 @@ export function GenericInput({
onChange,
}) {
const { grouped: categoryGroups } = useCategories();
- const savedReports = useReports();
+ const { data: savedReports } = useReports();
const saved = useSelector(state => state.queries.saved);
const dateFormat = useDateFormat() || 'MM/dd/yyyy';
diff --git a/packages/loot-core/src/client/data-hooks/reports.ts b/packages/loot-core/src/client/data-hooks/reports.ts
index 693086146..49662402b 100644
--- a/packages/loot-core/src/client/data-hooks/reports.ts
+++ b/packages/loot-core/src/client/data-hooks/reports.ts
@@ -35,9 +35,10 @@ function toJS(rows: CustomReportData[]) {
return reports;
}
-export function useReports(): CustomReportEntity[] {
- const reports: CustomReportEntity[] = toJS(
- useLiveQuery(() => q('custom_reports').select('*'), []) || [],
+export function useReports() {
+ const queryData = useLiveQuery<CustomReportData[]>(
+ () => q('custom_reports').select('*'),
+ [],
);
// Sort reports by alphabetical order
@@ -51,5 +52,11 @@ export function useReports(): CustomReportEntity[] {
);
}
- return useMemo(() => sort(reports), [reports]);
+ return useMemo(
+ () => ({
+ isLoading: queryData === null,
+ data: sort(toJS(queryData || [])),
+ }),
+ [queryData],
+ );
}
diff --git a/upcoming-release-notes/3198.md b/upcoming-release-notes/3198.md
new file mode 100644
index 000000000..0e682ecc0
--- /dev/null
+++ b/upcoming-release-notes/3198.md
@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [MatissJanis]
+---
+
+Reports: improve `useReports` data fetching hook to return the loading state.
--
GitLab