404 | FundMasters

import React, { useState, useMemo } from "react"; import { PieChart, Pie, Cell, Tooltip, Legend, ResponsiveContainer } from "recharts"; // SIP Calculator - Single-file React component // Uses Tailwind CSS for styling. Default export is the component. export default function SIPCalculator() { const [monthly, setMonthly] = useState(10000); const [annualReturn, setAnnualReturn] = useState(12); const [years, setYears] = useState(10); const [logo, setLogo] = useState(null); const [investedColor, setInvestedColor] = useState("#2563EB"); // blue const [returnsColor, setReturnsColor] = useState("#10B981"); // green const [thirdColor, setThirdColor] = useState(""); // optional third color (not used in pie by default) const [useAnnuityDue, setUseAnnuityDue] = useState(false); // Format number in INR const fmtINR = (value) => { try { return new Intl.NumberFormat("en-IN", { style: "currency", currency: "INR", maximumFractionDigits: 0 }).format(value); } catch (e) { return `₹${Math.round(value).toLocaleString()}`; } }; // SIP future value calculation (end-of-period by default) // FV = P * [ ((1+r)^n - 1) / r ] * (1 + r)^0 for end-of-period // If annuity-due (contribution at beginning), multiply by (1 + r) const results = useMemo(() => { const P = Number(monthly) || 0; const annual = Number(annualReturn) || 0; const yrs = Number(years) || 0; const n = yrs * 12; const r = annual / 100 / 12; let fv = 0; if (r === 0) { fv = P * n; } else { fv = P * ((Math.pow(1 + r, n) - 1) / r); if (useAnnuityDue) fv *= (1 + r); } const invested = P * n; const totalReturns = Math.max(0, fv - invested); return { futureValue: fv, invested, totalReturns, months: n, }; }, [monthly, annualReturn, years, useAnnuityDue]); const pieData = [ { name: "Invested", value: Math.round(results.invested) }, { name: "Returns", value: Math.round(results.totalReturns) }, ]; // handle logo upload const onLogoChange = (e) => { const file = e.target.files?.[0]; if (!file) return; const url = URL.createObjectURL(file); setLogo({ file, url }); }; return (

{logo ? (