From 7f945dcc5ab53a559458b2965ca51e8e73d74e47 Mon Sep 17 00:00:00 2001 From: Jackie Mei Date: Fri, 3 Apr 2026 00:31:16 -0500 Subject: [PATCH 1/3] Fixes not being able to add transactions if you start with no transactions. --- app/client/src/components/TransactionTable.tsx | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/app/client/src/components/TransactionTable.tsx b/app/client/src/components/TransactionTable.tsx index 98af1de..c93fff6 100644 --- a/app/client/src/components/TransactionTable.tsx +++ b/app/client/src/components/TransactionTable.tsx @@ -7,14 +7,12 @@ import { } from "../api/DashboardAPI.ts"; import type { Transaction } from "../types/Transaction"; import { - AiOutlineTransaction, AiOutlineSearch, AiOutlinePlus, AiOutlineClose, AiOutlineUpload, } from "react-icons/ai"; import { FiEdit2 } from "react-icons/fi"; -import NoItemState from "./NoItemState"; import type { MinimizedAccount } from "@/types/AccountType.ts"; import CSVImportModal from "./CSVImportModal"; @@ -283,16 +281,6 @@ function TransactionTable({ ); } - if (allTransactions.length === 0) { - return ( - } - /> - ); - } - return (
{/* Search Bar */} From 1f5a9eff73264c0bf1f7c21c2600a56b19143b17 Mon Sep 17 00:00:00 2001 From: Jackie Mei Date: Fri, 3 Apr 2026 02:33:50 -0500 Subject: [PATCH 2/3] Fixed the transation creation and editing the amount input field --- .../src/components/TransactionTable.tsx | 25 +++++++++---------- 1 file changed, 12 insertions(+), 13 deletions(-) diff --git a/app/client/src/components/TransactionTable.tsx b/app/client/src/components/TransactionTable.tsx index c93fff6..0fd6531 100644 --- a/app/client/src/components/TransactionTable.tsx +++ b/app/client/src/components/TransactionTable.tsx @@ -15,6 +15,7 @@ import { import { FiEdit2 } from "react-icons/fi"; import type { MinimizedAccount } from "@/types/AccountType.ts"; import CSVImportModal from "./CSVImportModal"; +import { handleCurrencyBlur, handleCurrencyChange, handleListCurrencyBlur, handleListCurrencyChange } from "@/utils/handleInput.ts"; interface TransactionTableProps { initialLimit?: number; @@ -222,11 +223,13 @@ function TransactionTable({ recipient: "", }); + const [newAmount, setNewAmount] = useState("") + const handleAddTransaction = async () => { if ( !newTransaction.date || !newTransaction.category || - newTransaction.amount === undefined + newAmount === undefined ) { alert("Please fill in required fields (date, category, amount)"); return; @@ -240,6 +243,7 @@ function TransactionTable({ try { const created = await createTransaction({ ...newTransaction, + amount: Number(newAmount), financialAccount_id: selectedAccountId as number, } as Transaction); @@ -382,15 +386,13 @@ function TransactionTable({ className="bg-black/50 border border-green-500/30 rounded px-3 py-2 text-white" /> - setNewTransaction({ - ...newTransaction, - amount: parseFloat(e.target.value), - }) + handleCurrencyChange(e, setNewAmount) } + onBlur={(e) => handleCurrencyBlur(e, e.target.value, setNewAmount)} className="bg-black/50 border border-green-500/30 rounded px-3 py-2 text-white" /> @@ -580,15 +582,12 @@ function TransactionTable({ Amount - handleFieldChange( - tx.id, - "amount", - parseFloat(e.target.value), - ) + handleListCurrencyChange(e, handleFieldChange, tx.id, "amount") } + onBlur={(e) => handleListCurrencyBlur(e,handleFieldChange, tx.id, "amount")} className="w-full bg-black/50 border border-green-500/30 rounded px-3 py-2 text-white text-sm" onClick={(e) => e.stopPropagation()} /> From c60ab3a0ea5af6e3670ba8dbedba13d854be6ddc Mon Sep 17 00:00:00 2001 From: Jackie Mei Date: Fri, 3 Apr 2026 02:35:18 -0500 Subject: [PATCH 3/3] Created acceptance tests for projection, dashboard, and user authentication --- .../src/components/TransactionTable.tsx | 31 +++++++-- .../Dashboard/DashboardAcceptance.md | 66 +++++++++++++++++++ .../Projection/ProjectionAcceptance.md | 34 ++++++++++ .../Acceptance/UserAuth/UserAuthAcceptance.md | 27 ++++++++ 4 files changed, 151 insertions(+), 7 deletions(-) create mode 100644 documentation/Acceptance/Dashboard/DashboardAcceptance.md create mode 100644 documentation/Acceptance/Projection/ProjectionAcceptance.md create mode 100644 documentation/Acceptance/UserAuth/UserAuthAcceptance.md diff --git a/app/client/src/components/TransactionTable.tsx b/app/client/src/components/TransactionTable.tsx index 0fd6531..0d3d0ec 100644 --- a/app/client/src/components/TransactionTable.tsx +++ b/app/client/src/components/TransactionTable.tsx @@ -15,7 +15,12 @@ import { import { FiEdit2 } from "react-icons/fi"; import type { MinimizedAccount } from "@/types/AccountType.ts"; import CSVImportModal from "./CSVImportModal"; -import { handleCurrencyBlur, handleCurrencyChange, handleListCurrencyBlur, handleListCurrencyChange } from "@/utils/handleInput.ts"; +import { + handleCurrencyBlur, + handleCurrencyChange, + handleListCurrencyBlur, + handleListCurrencyChange, +} from "@/utils/handleInput.ts"; interface TransactionTableProps { initialLimit?: number; @@ -223,7 +228,7 @@ function TransactionTable({ recipient: "", }); - const [newAmount, setNewAmount] = useState("") + const [newAmount, setNewAmount] = useState(""); const handleAddTransaction = async () => { if ( @@ -389,10 +394,10 @@ function TransactionTable({ type="string" placeholder="Amount" value={newAmount || ""} - onChange={(e) => - handleCurrencyChange(e, setNewAmount) + onChange={(e) => handleCurrencyChange(e, setNewAmount)} + onBlur={(e) => + handleCurrencyBlur(e, e.target.value, setNewAmount) } - onBlur={(e) => handleCurrencyBlur(e, e.target.value, setNewAmount)} className="bg-black/50 border border-green-500/30 rounded px-3 py-2 text-white" /> @@ -585,9 +590,21 @@ function TransactionTable({ type="string" value={editValues.amount ?? tx.amount} onChange={(e) => - handleListCurrencyChange(e, handleFieldChange, tx.id, "amount") + handleListCurrencyChange( + e, + handleFieldChange, + tx.id, + "amount", + ) + } + onBlur={(e) => + handleListCurrencyBlur( + e, + handleFieldChange, + tx.id, + "amount", + ) } - onBlur={(e) => handleListCurrencyBlur(e,handleFieldChange, tx.id, "amount")} className="w-full bg-black/50 border border-green-500/30 rounded px-3 py-2 text-white text-sm" onClick={(e) => e.stopPropagation()} /> diff --git a/documentation/Acceptance/Dashboard/DashboardAcceptance.md b/documentation/Acceptance/Dashboard/DashboardAcceptance.md new file mode 100644 index 0000000..d542df8 --- /dev/null +++ b/documentation/Acceptance/Dashboard/DashboardAcceptance.md @@ -0,0 +1,66 @@ +# Acceptance Criteria + +## 1: Visualization of the user's income, investments and savings +- The user is presented with a dashboard, which contains statistical graphs +- One of the graphs displays a visualization of the user's expenses over time +- One of the graph displays a visualizatoin of the user's saving contributed over time +- One of the graph shows the relationship between the total income and where all of that money ends up going + +## 2: Tracking the user's budget goals +- Users are proposed a feasible budget plan +- The budget plan takes into account of the user's income and expenses +- The budget prioritizes saving money +- The user is shown how closely they match the budget and whether they overspent within a defined period of time + +--- + +# Acceptance Test Scenarios + +## 1: Seeing a visual of the user's expenses over time +1. Login in or creates a finus account +2. Go to the account list and click on add account +3. Fill out the account form that appeared with any input except with the type: Credit Card subtype: loan. +4. Click create account and observe the account appearing under the account list. +5. Click on create transaction under the transaction list +6. Fill out the transaction form with account that was created as the selected account. Amount has be in the negatives. +7. Repeat step 5-6 until you have have a multiple transaction within this past week and multiple multiple the last month and multiple in different months in the past year. +8. Go top of the dashboard and select expenses if not already selected. +9. Observe if the amount total in each day matches the amount entered in the transactions. +10. Click on month button and checks if total amount each day within a month from now, matches amount that was entered in the transactions. +11. Click on year button and checks if the total amount each month matches the total amount for transactions entered that month + +## 2: Seeing a visual of the user's savings over time +1. Login or create a finus account +2. Go to the account list and click create account +3. Fill out the form and make an account type of savings, other inputs can be anything. +4. Click on create account observe it being added the account list +5. Click on create transaction under transaction list +6. Fill out the transaction form with the newly created account as the selected account. +7. Repeat step 5-6 until you have a multiple transactions thats within the past week, month and year. +8. Go to the first graph in the dashboard, and click on savings if it's not already selected +9. Click on week button and check if savings amount changes matches the transactions that were created within a week from now +10. Click on month button and check if saving amount changes matches the transactions that were created within a month from now +11. Click on year button and check if saving amount changes matches the transactions that were created within a year from now + +## 3: Seeing a visual of the user's income over time +1. Login or create a finus account +2. Go to the account list and click create account +3. Fill out the form and make an account type of savings, other inputs can be anything. +4. Click on create account observe it being added the account list +5. Click on create transactions under transaction list +6. Fill out the transaction form with the newly created as the selected account. Use consistent categories for the transaction +7. Repeat step 5-6 until you have multiple transactions thats within the past week, month and year. +8. Go the first graph in the dashboard and click on income flow if its not selected already. +9. Click on week and check if the total amount for a transaction categories on the left side of the graph matches the total of the positive transactions(income) of that category within the past week. +10. Check if total amount for a transaction category on right matches the total amount the negative transactions(expenses) of that category with in the past week. +11. Repeat 9 and 10 except for with with month and year, check if transactions with the month/year from now match. + +## 4: Tracking if the user is keeping within budget +1. Login or create a finus account +2. Go to the account list and click create account +3. Fill out the form and make an account type of savings, other inputs can be anything +4. Click on create account observe it being added to the account list. +5. Click on create a transaction under transaction list +6. Fill out the transaction form with the newly created account. Create a transactions of the same type. +7. Repeat step 5-6 until you have multiple transactions thats wtihin the past week, month, and year. +8. Go the budget vs expenditure graph and check if the budget amount matches the total amount of possitive transactions and actual spending amount matches the total amount of negative transactions of that type. \ No newline at end of file diff --git a/documentation/Acceptance/Projection/ProjectionAcceptance.md b/documentation/Acceptance/Projection/ProjectionAcceptance.md new file mode 100644 index 0000000..004bf83 --- /dev/null +++ b/documentation/Acceptance/Projection/ProjectionAcceptance.md @@ -0,0 +1,34 @@ +# Acceptance Criteria + +## 1: Debt Deadlines +- User can input various kinds of debt like loans +- Certain kinds of debt have additional inputs associated with them, like a amortization +- User are presetned with a projection of how much they will owe at every specific period of time, givne minimum payments. + +## 2: Savings compound overtime +- User can input financial information about their savings accounts +- users can specify the kind of account they're using for savings +- User are presented with a graph that visualizes how their savings compound over time +- The projected savings graph shows both worst-case and best-case growth based on historical economic values. + +--- + +# Acceptance Test Scanario + +## 1: Seeing a projection of the user's savings account growth +1. Sign in or create a finus account +2. Create an financial account of savings type +3. Go to the projection page by clicking top left button and then clicking projection +4. Select the saving projection button if not selected already. +5. Select the saving account that was just created. +6. Fill out the rest of the form in saving account detail then click on calculate projection +7. Go to the saving growth projection, you should see a graph with 3 different lines, green being a best case(optimistic), yellow being expected case, and red being worst case(conservative). They best case should show the highest amount in their projection followed up by expected and then worst case. + +## 2: Seeing a projection of how long and how much it would take to pay off a debt +1. Sign in or create a finus account +2. Go to account list and create an account of type Credit Card with subtype loan. +3. Go to the projection page by clicking on the top left and clicking projection. +4. Click on Debt payoff projection if not selected already. +5. Select the account that we created and fill out the rest of the form then click on calculate projections. +6. Go the debt payoff schedule and you will see a line of amount of debt remaining in future payment deadlines. +7. Right bellow the graph, you can see how much interest you paid in total. \ No newline at end of file diff --git a/documentation/Acceptance/UserAuth/UserAuthAcceptance.md b/documentation/Acceptance/UserAuth/UserAuthAcceptance.md new file mode 100644 index 0000000..2b8160c --- /dev/null +++ b/documentation/Acceptance/UserAuth/UserAuthAcceptance.md @@ -0,0 +1,27 @@ +# Acceptance Criteria + +## 1: Use of app on any of my device +- Users can create an account with an email and password +- User data is associated with an account under a certain name +- User can log into their account from mutliple supported devices (Desktop only) +- User can log out of their account and log in with a different accout on the same machine + +--- + +# Acceptance Test + +## 1: Creating mutliple finus accounts +1. Click on sign up +2. Fill out the form, age being 21 and over, email following name@domain.com format, password being at least 8 characters long, including at least both a number and a letter/symbol. +3. Click on create account +4. Should be sent to dashboard page if account creation was a success. +5. Check dashboard displays hello [name] matches the name entered when creating an account +6. Use another device or open incognito tab and try to login into the account that was just created +7. Click on button on top left of the screen and then click on signout, should be sent back to the login page. +8. Repeat steps 1-5 and see if user is able to create and login into another account + +## 2: Login into same finus accounts from different devices +1. Create a finus accounts if not already created +2. login into the finus account +3. Use a different device or open a incognito tab to login into the same account +4. Check if both devices are stilled logged into the account and shows the same info on screen.