notkshitij/CropCompass
1
1
Fork 0
Code Issues 8 Pull Requests Projects 1 Releases Activity

feat: Set up RTK query for the statemanagement

Browse Source
This commit is contained in:
Karan
2025-03-25 17:48:15 +05:30
parent 7e204690d3
commit 914501036d
70 changed files with 141275 additions and 205 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Frontend/src/pages/UserPanel/Farm/FinanceSummary.jsx
+32 -31
View File
@@ -1,7 +1,7 @@
import React, { useState, useEffect } from "react";
import Loader from "../../../components/Loader";
const FinanceSummary = ({ farmId }) => {
const FinanceSummary = ({ farmId, financeId }) => {
const [summary, setSummary] = useState(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState("");
@@ -12,9 +12,10 @@ const FinanceSummary = ({ farmId }) => {
setError("");
try {
const response = await fetch(
`http://localhost:8000/api/v1/finance/summary/${farmId}`,
`http://localhost:8000/api/v1/finance/summary/${financeId}`,
{ credentials: "include" }
);
console.log("Summary response:", response);
if (!response.ok) {
throw new Error("Failed to fetch summary");
}
@@ -30,45 +31,45 @@ const FinanceSummary = ({ farmId }) => {
fetchSummary();
}, [farmId]);
if (loading) return <Loader />;
if (error) return <div className="p-4 text-center text-red-600">{error}</div>;
// if (loading) return <Loader />;
//if (error) return <div className="p-4 text-center text-red-600">{error}</div>;
// Extract only the important fields.
const { totalExpenses, totalRevenue, transactions } = summary;
const { totalExpenses, totalRevenue, transactions } = summary || {};
const transactionsCount = Array.isArray(transactions)
? transactions.length
: 0;
return (
<div className="max-w-md mx-auto p-8 bg-gray-50">
<div className="w-full mx-auto p-8 bg-gray-50">
<div className="bg-white rounded-lg shadow overflow-hidden">
<header className="bg-blue-600 px-6 py-4">
<h2 className="text-3xl font-bold text-white">Finance Summary</h2>
<h2 className="text-3xl font-bold text-white">
Transactions Summary
</h2>
</header>
<div className="p-6">
<table className="w-full table-auto">
<tbody className="divide-y divide-gray-200">
<tr className="hover:bg-gray-50">
<td className="px-6 py-4 font-medium text-gray-600">
Total Expenses
</td>
<td className="px-6 py-4 text-gray-800">{totalExpenses}</td>
</tr>
<tr className="hover:bg-gray-50">
<td className="px-6 py-4 font-medium text-gray-600">
Total Revenue
</td>
<td className="px-6 py-4 text-gray-800">{totalRevenue}</td>
</tr>
<tr className="hover:bg-gray-50">
<td className="px-6 py-4 font-medium text-gray-600">
Transactions
</td>
<td className="px-6 py-4 text-gray-800">{transactionsCount}</td>
</tr>
</tbody>
</table>
</div>
<table className="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
<thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr>
<th scope="col" className="px-6 py-3">
Farm name
</th>
<th scope="col" className="px-6 py-3">
Location
</th>
<th scope="col" className="px-6 py-3">
Type
</th>
<th scope="col" className="px-6 py-3">
Size (acres)
</th>
<th scope="col" className="px-6 py-3">
Action
</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
);