{cards.map((c) => (
{
+type ChartProps = {
+ costs: CashflowCost[];
+ revenues: CashflowRevenue[];
+};
+
+const CashProjectionChart = observer(({}: ChartProps) => {
// replace with actual data, filter for 36 months
const data = [
diff --git a/frontend/src/main-page/cash-flow/components/CashSourceList.tsx b/frontend/src/main-page/cash-flow/components/CashSourceList.tsx
index 6977061..5246775 100644
--- a/frontend/src/main-page/cash-flow/components/CashSourceList.tsx
+++ b/frontend/src/main-page/cash-flow/components/CashSourceList.tsx
@@ -1,7 +1,10 @@
+import { CashflowCost } from "../../../../../middle-layer/types/CashflowCost";
+import { CashflowRevenue } from "../../../../../middle-layer/types/CashflowRevenue";
import CashEditLineItem from "./CashEditLineItem";
type SourceProps = {
type: "Revenue" | "Cost";
+ lineItems: CashflowRevenue[] | CashflowCost[];
};
export default function CashSourceList({ type }: SourceProps) {
diff --git a/frontend/src/main-page/cash-flow/components/CashFlowCard.tsx b/frontend/src/main-page/cash-flow/components/CashflowKPICard.tsx
similarity index 95%
rename from frontend/src/main-page/cash-flow/components/CashFlowCard.tsx
rename to frontend/src/main-page/cash-flow/components/CashflowKPICard.tsx
index a24c88e..d08b8f9 100644
--- a/frontend/src/main-page/cash-flow/components/CashFlowCard.tsx
+++ b/frontend/src/main-page/cash-flow/components/CashflowKPICard.tsx
@@ -9,7 +9,7 @@ type CardProps = {
size?: "small" | "medium";
};
-export default function CashFlowCard({
+export default function CashflowKPICard({
text,
value,
className,
diff --git a/frontend/src/main-page/cash-flow/processCashflowData.ts b/frontend/src/main-page/cash-flow/processCashflowData.ts
new file mode 100644
index 0000000..b9abd30
--- /dev/null
+++ b/frontend/src/main-page/cash-flow/processCashflowData.ts
@@ -0,0 +1,60 @@
+import { useEffect } from "react";
+import { getAppStore } from "../../external/bcanSatchel/store.ts";
+import { fetchCashflowCosts, fetchCashflowRevenues } from "../../external/bcanSatchel/actions.ts";
+import {CashflowRevenue} from "../../../../middle-layer/types/CashflowRevenue.ts";
+import {CashflowCost} from "../../../../middle-layer/types/CashflowCost.ts";
+import { api } from "../../api.ts";
+
+// This has not been tested yet but the basic structure when implemented should be the same
+// Mirrored format for processGrantData.ts
+
+// fetch line items
+export const fetchCosts = async () => {
+ try {
+ // Need to replace with actual endpoint
+ const response = await api("/cost");
+ if (!response.ok) {
+ throw new Error(`HTTP Error, Status: ${response.status}`);
+ }
+ const updatedCosts: CashflowCost[] = await response.json();
+ fetchCashflowCosts(updatedCosts);
+ } catch (error) {
+ console.error("Error fetching costs:", error);
+ }
+};
+
+export const fetchRevenues = async () => {
+ try {
+ // Need to replace with actual endpoint
+ const response = await api("/revenue");
+ if (!response.ok) {
+ throw new Error(`HTTP Error, Status: ${response.status}`);
+ }
+ const updatedRevenues: CashflowRevenue[] = await response.json();
+ fetchCashflowRevenues(updatedRevenues);
+ } catch (error) {
+ console.error("Error fetching revenues:", error);
+ }
+};
+
+
+// could contain callbacks for sorting and filtering line items
+// stores state for list of costs/revenues
+export const ProcessCashflowData = () => {
+ const {
+ costSources,
+ revenueSources
+ } = getAppStore();
+
+ // fetch costs on mount if empty
+ useEffect(() => {
+ if (costSources.length === 0) fetchCosts();
+ }, [costSources.length]);
+
+ // fetch revenues on mount if empty
+ useEffect(() => {
+ if (revenueSources.length === 0) fetchRevenues();
+ }, [revenueSources.length]);
+
+ return { costs: costSources, revenues: revenueSources };
+};
diff --git a/frontend/src/main-page/cash-flow/processCashflowDataEditSave.ts b/frontend/src/main-page/cash-flow/processCashflowDataEditSave.ts
new file mode 100644
index 0000000..f529210
--- /dev/null
+++ b/frontend/src/main-page/cash-flow/processCashflowDataEditSave.ts
@@ -0,0 +1,214 @@
+import {CashflowRevenue} from "../../../../middle-layer/types/CashflowRevenue.ts";
+import {CashflowCost} from "../../../../middle-layer/types/CashflowCost.ts";
+import { api } from "../../api.ts";
+import { fetchCosts, fetchRevenues } from "./processCashflowData.ts";
+
+// This has not been tested yet but the basic structure when implemented should be the same
+// Mirrored format for processGrantDataEditSave.ts
+
+// save a new revenue
+export const createNewRevenue = async (newRevenue: CashflowRevenue) => {
+ try {
+ // Need to replace with acual endpoint
+ const response = await api("/revenue/new-revenue", {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(newRevenue),
+ });
+
+ if (response.ok) {
+ await fetchRevenues();
+ return { success: true };
+ } else {
+ const errorData = await response.json();
+ throw new Error(errorData.message || "Failed to create revenue");
+ }
+ } catch (error) {
+ console.error("Error creating revenue:", error);
+ console.log(newRevenue);
+ console.log(newRevenue.installments);
+ return {
+ success: false,
+ error:
+ error instanceof Error
+ ? error.message
+ : "Server error. Please try again.",
+ };
+ }
+};
+
+// save a new cost
+export const createNewCost = async (newCost: CashflowCost) => {
+ try {
+ // Need to replace with acual endpoint
+ const response = await api("/cost/new-cost", {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(newCost),
+ });
+
+ if (response.ok) {
+ await fetchCosts();
+ return { success: true };
+ } else {
+ const errorData = await response.json();
+ throw new Error(errorData.message || "Failed to create cost");
+ }
+ } catch (error) {
+ console.error("Error creating cost:", error);
+ console.log(newCost);
+ return {
+ success: false,
+ error:
+ error instanceof Error
+ ? error.message
+ : "Server error. Please try again.",
+ };
+ }
+};
+
+export const saveRevenueEdits = async (updatedRevenue: CashflowRevenue) => {
+ try {
+ // Need to replace with acual endpoint
+ const response = await api("/revenue/save", {
+ method: "PUT",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(updatedRevenue),
+ });
+
+ if (response.ok) {
+ await fetchRevenues();
+ return { success: true };
+ } else {
+ const errorData = await response.json();
+ throw new Error(errorData.message || "Failed to update revenue");
+ }
+ } catch (error) {
+ console.error("Error updating revenue:", error);
+ console.log(updatedRevenue);
+ return {
+ success: false,
+ error:
+ error instanceof Error
+ ? error.message
+ : "Server error. Please try again.",
+ };
+ }
+};
+
+export const saveCostEdits = async (updatedCost: CashflowCost) => {
+ try {
+ // Need to replace with acual endpoint
+ const response = await api("/cost/save", {
+ method: "PUT",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(updatedCost),
+ });
+
+ if (response.ok) {
+ await fetchCosts();
+ return { success: true };
+ } else {
+ const errorData = await response.json();
+ throw new Error(errorData.message || "Failed to update cost");
+ }
+ } catch (error) {
+ console.error("Error updating cost:", error);
+ console.log(updatedCost);
+ return {
+ success: false,
+ error:
+ error instanceof Error
+ ? error.message
+ : "Server error. Please try again.",
+ };
+ }
+};
+
+export const deleteRevenue = async (revenueId: any) => {
+ // Need to replace with acual endpoint
+ try {
+ const response = await api(`/revenue/${revenueId}`, {
+ method: "DELETE",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ });
+
+ console.log("Response status:", response.status);
+ console.log("Response ok:", response.ok);
+
+ if (response.ok) {
+ console.log("✅ Revenue deleted successfully");
+ // Refetch revenues to update UI
+ await fetchRevenues();
+ } else {
+ // Get error details
+ const errorText = await response.text();
+ console.error("❌ Error response:", errorText);
+
+ let errorData;
+ try {
+ errorData = JSON.parse(errorText);
+ console.error("Parsed error:", errorData);
+ } catch {
+ console.error("Could not parse error response");
+ }
+ }
+ } catch (err) {
+ console.error("=== EXCEPTION CAUGHT ===");
+ console.error(
+ "Error type:",
+ err instanceof Error ? "Error" : typeof err
+ );
+ console.error(
+ "Error message:",
+ err instanceof Error ? err.message : err
+ );
+ console.error("Full error:", err);
+ }
+ };
+
+export const deleteCost = async (costId: any) => {
+ // Need to replace with acual endpoint
+ try {
+ const response = await api(`/revenue/${costId}`, {
+ method: "DELETE",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ });
+
+ console.log("Response status:", response.status);
+ console.log("Response ok:", response.ok);
+
+ if (response.ok) {
+ console.log("✅ Cost deleted successfully");
+ // Refetch costs to update UI
+ await fetchCosts();
+ } else {
+ // Get error details
+ const errorText = await response.text();
+ console.error("❌ Error response:", errorText);
+
+ let errorData;
+ try {
+ errorData = JSON.parse(errorText);
+ console.error("Parsed error:", errorData);
+ } catch {
+ console.error("Could not parse error response");
+ }
+ }
+ } catch (err) {
+ console.error("=== EXCEPTION CAUGHT ===");
+ console.error(
+ "Error type:",
+ err instanceof Error ? "Error" : typeof err
+ );
+ console.error(
+ "Error message:",
+ err instanceof Error ? err.message : err
+ );
+ console.error("Full error:", err);
+ }
+ };
\ No newline at end of file