react-openapi/hooks/useResource.ts

@@ -30,13 +30,13 @@ export function useResource<T = any>(config: ResourceConfig | undefined) {
     });
 
   // --- READ ONE ---
-  const useRead = (id: string | null) =>
+  const useRead = (id: string, params?: any | null) =>
     useQuery({
-      queryKey: [name, "detail", id],
+      queryKey: [name, "detail", id, params],
       queryFn: async () => {
         if (!id || !endpoint) return null;
         // @ts-ignore
-        const res = await api.get<T>(`${endpoint}/${id}`);
+        const res = await api.get<T>(`${endpoint}/${id}`, params ? { params } : undefined);
         return res.data;
       },
       enabled: !!id && !!endpoint,

src/Dashboard.tsx

@@ -50,10 +50,10 @@ export default function Dashboard() {
   });
 
   React.useEffect(() => {
-    if (report.data?.data) {
+    if (report.data) {
       setLoadedPayees(prev => {
         const pSet = new Set<string>(prev);
-        report.data.data.buckets.forEach((b: any) => {
+        report.data.buckets.forEach((b: any) => {
           Object.values(b.periods).forEach((periodArray: any) => {
             periodArray?.forEach((p: any) => {
               p.metric?.transactions?.forEach((t: any) => {
@@ -67,7 +67,7 @@ export default function Dashboard() {
 
       setLoadedTags(prev => {
         const tSet = new Set<string>(prev);
-        report.data.data.buckets.forEach((b: any) => {
+        report.data.buckets.forEach((b: any) => {
           Object.values(b.periods).forEach((periodArray: any) => {
             periodArray?.forEach((p: any) => {
               p.metric?.transactions?.forEach((t: any) => {
@@ -79,7 +79,7 @@ export default function Dashboard() {
         return Array.from(tSet).sort();
       });
     }
-  }, [report.data?.data]);
+  }, [report.data]);
 
   const toggleFlow =
     React.useCallback(() => {
@@ -219,7 +219,7 @@ export default function Dashboard() {
     return null;
   }
 
-  const data = prepareReport(report.data.data);
+  const data = prepareReport(report.data);
   return (
     <Box>
       <Container>

src/features/report/useReport.ts

@@ -9,10 +9,13 @@ export interface ReportParams {
 }
 
 export function useReport(params: ReportParams) {
-  const { useList } = useResourceByName("reports");
+  const { useRead } = useResourceByName("reports");
 
-  return useList({
-    ...params,
-    periods: params.periods,
-  });
+  return useRead(
+    params.snapshot_id ? params.snapshot_id : "latest",
+    {
+      ...params,
+      periods: params.periods,
+    }
+  );
 }