70 lines
2.3 KiB
TypeScript
70 lines
2.3 KiB
TypeScript
import { Box } from "@mui/material";
|
|
import { GeneralHealthCard } from "../../GeneralHealthCard/GeneralHealthCard";
|
|
import { TransactionsWaitingApproval } from "../../TransactionsWaitingApproval/TransactionsWaitingApproval";
|
|
import { FetchReport } from "../../FetchReports/FetchReports";
|
|
import { Documentation } from "../../Documentation/Documentation";
|
|
import { AccountIQ } from "../../AccountIQ/AccountIQ";
|
|
import { WhatsNew } from "../../WhatsNew/WhatsNew";
|
|
import { TransactionsOverView } from "../../TransactionsOverview/TransactionsOverview";
|
|
import { useEffect } from "react";
|
|
|
|
export const DashboardHomePage = () => {
|
|
// useEffect to fetch data when the component mounts
|
|
useEffect(() => {
|
|
// Construct the URL with query parameters
|
|
const url =
|
|
"https://test-bo.paymentiq.io/paymentiq/backoffice/api/v2/metrics/txsummary?merchantId=100987998&fromDate=2025-06-29+19%3A10&toDate=2025-07-01+19%3A09";
|
|
|
|
// Perform the fetch request inside useEffect
|
|
const fetchData = async () => {
|
|
try {
|
|
// Start loading
|
|
|
|
// Make the API request
|
|
const response = await fetch(url, {
|
|
method: "GET", // You can change this to 'POST' if necessary
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
// Add any other headers you need here
|
|
},
|
|
});
|
|
|
|
// Check if the response is OK (status code 200-299)
|
|
if (!response.ok) {
|
|
throw new Error(`Failed to fetch: ${response.status}`);
|
|
}
|
|
|
|
// Parse the JSON response
|
|
const data = await response.json();
|
|
console.log("[DATA]", data);
|
|
|
|
// Update the state with the fetched data
|
|
// setTransactions(data.result || []);
|
|
} catch (err) {
|
|
// Handle any errors that occurred during the fetch
|
|
// setError("Failed to load data, please try again.");
|
|
console.error("Fetch error:", err);
|
|
} finally {
|
|
// Set loading to false when the request is complete
|
|
// setLoading(false);
|
|
}
|
|
};
|
|
|
|
// Call the fetch function
|
|
fetchData();
|
|
}, []); // Empty dependency
|
|
return (
|
|
<>
|
|
<Box sx={{ p: 2 }}>
|
|
<GeneralHealthCard />
|
|
</Box>
|
|
<TransactionsOverView />
|
|
<FetchReport />
|
|
<TransactionsWaitingApproval />
|
|
<Documentation />
|
|
<AccountIQ />
|
|
<WhatsNew />
|
|
</>
|
|
);
|
|
};
|