import { useState } from "react"; import html2canvas from "html2canvas"; const EnergyBillCalculator = () => { const states = ["NSW", "VIC", "SA", "SEQ"]; const stateImpacts = { NSW: 665, VIC: 602, SA: 648, SEQ: 611 }; const [currentBill, setCurrentBill] = useState(0); const [state, setState] = useState("NSW"); const [hasSolar, setHasSolar] = useState(false); const [householdSize, setHouseholdSize] = useState(2); const [results, setResults] = useState(null); const calculateBill = () => { let nuclearImpact = stateImpacts[state] || 0; // Adjust for household size if (householdSize === 4) nuclearImpact *= 1.5; if (householdSize >= 5) nuclearImpact *= 1.75; // Adjust for solar impact (40% reduction if solar is present) if (hasSolar) nuclearImpact *= 0.6; setResults({ withoutNuclear: parseFloat(currentBill), withNuclear: parseFloat(currentBill) + nuclearImpact, }); }; const shareResults = (platform) => { if (!results) return; const text = `My estimated future energy bill: \nWithout Nuclear: $${results.withoutNuclear.toFixed(2)} AUD \nWith Nuclear: $${results.withNuclear.toFixed(2)} AUD`; const encodedText = encodeURIComponent(text); const url = encodeURIComponent("https://yourwebsite.com"); let shareUrl = ""; if (platform === "twitter") { shareUrl = `https://twitter.com/intent/tweet?text=${encodedText}`; } else if (platform === "facebook") { shareUrl = `https://www.facebook.com/sharer/sharer.php?u=${url}"e=${encodedText}`; } else if (platform === "instagram") { generateImage(); return; } window.open(shareUrl, "_blank"); }; const generateImage = () => { const element = document.getElementById("result-card"); html2canvas(element).then((canvas) => { const link = document.createElement("a"); link.href = canvas.toDataURL("image/png"); link.download = "energy_bill_results.png"; link.click(); }); }; return (

Energy Bill Calculator

setCurrentBill(e.target.value)} className="w-full p-2 border rounded mb-4" /> setHouseholdSize(Number(e.target.value))} className="w-full p-2 border rounded mb-4" min="1" /> {results && (

Results

Future Bill Without Nuclear: ${results.withoutNuclear.toFixed(2)} AUD

Future Bill With Nuclear: ${results.withNuclear.toFixed(2)} AUD

)}
); }; export default EnergyBillCalculator;