Context Navigation

← Previous Changeset
Next Changeset →

Changeset 8449b9c

Timestamp:

04/30/26 11:27:00 (2 months ago)

Author:

Andrej <asumanovski@…>

Branches:

master

Children:

4f85b41

Parents:

708af9e

Message:

Finance feature

Files:

: 23 added
: 4 edited

Legend:

: Unmodified
: Added
: Removed

frontend/package-lock.json

-              r708af9e
+              r8449b9c
         "react-dom": "^19.2.0",
         "react-icons": "^5.5.0",
+        "react-is": "^19.2.5",
         "react-router-dom": "^7.13.0"
       },
 …
+      }
     },
+    "node_modules/react-is": {
+      "version": "19.2.5",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.5.tgz",
+      "integrity": "sha512-Dn0t8IQhCmeIT3wu+Apm1/YVsJXsGWi6k4sPdnBIdqMVtHtv0IGi6dcpNpNkNac0zB2uUAqNX3MHzN8c+z2rwQ==",
+      "license": "MIT"
+    },
     "node_modules/react-refresh": {
       "version": "0.18.0",

frontend/package.json

r708af9e	r8449b9c
19	19	"react-dom": "^19.2.0",
20	20	"react-icons": "^5.5.0",
	21	"react-is": "^19.2.5",
21	22	"react-router-dom": "^7.13.0"
22	23	},

frontend/src/App.jsx

-              r708af9e
+              r8449b9c
 import NewWeightIntake from "./pages/Dashboard/pages/Weight/NewWeightIntake.jsx";
 import Finance from "./pages/Dashboard/pages/Finance/Finance.jsx";
+import FinanceTracking from "./pages/Dashboard/pages/Finance/FinanceTracking.jsx";
+import NewIncome from "./pages/Dashboard/pages/Finance/NewIncome.jsx";
 import Investing from "./pages/Dashboard/pages/Investing/Investing.jsx";
 import InvestingTracking from "./pages/Dashboard/pages/Investing/InvestingTracking.jsx";
 …
           <Route path="weight/intakes/new" element={<NewWeightIntake />} />
           <Route path="finance" element={<Finance />} />
+           <Route path="finance/tracking" element={<FinanceTracking />} />
+           <Route path="finance/incomes/new" element={<NewIncome />} />
           <Route path="investing" element={<Investing />} />
           <Route path="investing/tracking" element={<InvestingTracking />} />

frontend/src/pages/Dashboard/pages/Finance/Finance.jsx

-              r708af9e
+              r8449b9c
+import React from "react";
+import React, { useEffect, useMemo, useState } from "react";
+import { useNavigate } from "react-router-dom";
+const Finance = () => {
+import { getFinanceStatus, startFinanceTracking } from "../../../../api/finance";
+import FinanceCenteredCard from "./components/FinanceCenteredCard.jsx";
+import FinanceStartCtaCard from "./components/FinanceStartCtaCard.jsx";
+import FinanceStartForm from "./components/FinanceStartForm.jsx";
+export default function Finance() {
+  const navigate = useNavigate();
+  const [isLoading, setIsLoading] = useState(true);
+  const [isTracking, setIsTracking] = useState(false);
+  const [step, setStep] = useState("cta"); // cta | form
+  const [error, setError] = useState("");
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const initialForm = useMemo(
+    () => ({
+      spendingBudget: "50",
+      savingBudget: "20",
+      investingBudget: "20",
+      donationBudget: "5",
+      credit: "5",
+    }),
+    [],
+  );
+  const [form, setForm] = useState(initialForm);
+  useEffect(() => {
+    let isMounted = true;
+    const run = async () => {
+      setIsLoading(true);
+      setError("");
+      try {
+        const tracking = await getFinanceStatus();
+        if (!isMounted) return;
+        setIsTracking(tracking);
+        if (tracking) {
+          navigate("/dashboard/finance/tracking", { replace: true });
+        }
+      } catch (err) {
+        if (!isMounted) return;
+        const message =
+          err?.response?.data?.message || "Failed to load finance status";
+        setError(message);
+      } finally {
+        if (isMounted) setIsLoading(false);
+      }
+    };
+    run();
+    return () => {
+      isMounted = false;
+    };
+  }, [navigate]);
+  const onStart = () => {
+    setError("");
+    setStep("form");
+  };
+  const onCancel = () => {
+    setStep("cta");
+    setForm(initialForm);
+    setError("");
+  };
+  const onSubmit = async (e) => {
+    e.preventDefault();
+    setError("");
+    setIsSubmitting(true);
+    try {
+      await startFinanceTracking({
+        spendingBudget:
+          form.spendingBudget === "" ? null : Number(form.spendingBudget),
+        savingBudget: form.savingBudget === "" ? null : Number(form.savingBudget),
+        investingBudget:
+          form.investingBudget === "" ? null : Number(form.investingBudget),
+        donationBudget:
+          form.donationBudget === "" ? null : Number(form.donationBudget),
+        credit: form.credit === "" ? null : Number(form.credit),
+      });
+      setIsTracking(true);
+      navigate("/dashboard/finance/tracking", { replace: true });
+    } catch (err) {
+      const message =
+        err?.response?.data?.message ||
+        Object.values(err?.response?.data?.errors ?? {})[0] ||
+        "Failed to start tracking";
+      setError(message);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+  if (isLoading) {
+    return <FinanceCenteredCard title="Finance" message="Loading…" />;
+  }
+  if (isTracking) {
+    return <FinanceCenteredCard title="Finance" message="Redirecting…" />;
+  }
   return (
+    <div className="space-y-4">
+      <h1 className="text-2xl font-bold">Finance</h1>
+      <div className="card bg-base-200 border border-base-300">
+        <div className="card-body">
+          <p className="opacity-80">Finance dashboard content goes here.</p>
+        </div>
+    <div className="min-h-[70vh] w-full flex items-center justify-center">
+      <div className="w-full max-w-3xl">
+        {step === "cta" ? (
+          <FinanceStartCtaCard error={error} onStart={onStart} />
+        ) : (
+          <FinanceStartForm
+            form={form}
+            setForm={setForm}
+            onSubmit={onSubmit}
+            onCancel={onCancel}
+            error={error}
+            isSubmitting={isSubmitting}
+          />
+        )}
       </div>
     </div>
   );
+};
+export default Finance;
+}

Note: See TracChangeset for help on using the changeset viewer.