Posted on
import React, { useState } from ‘react’; import { BarChart, Bar, LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer, PieChart, Pie, Cell } from ‘recharts’; const PowerUsageReport = () => { const [view, setView] = useState(‘monthly’); const handlePrint = () => { window.print(); }; const monthlyData = [ { month: ‘Oct 2024’, period: ‘9/25-10/24’, days: 29, kwh: 3936.40, cost: 698.47, avgDaily: 135.74, demand: 14.88 }, { month: ‘Nov 2024′, period: ’10/24-11/22’, days: 29, kwh: 2325.20, cost: 415.88, avgDaily: 80.18, demand: 10.52 }, { month: ‘Dec 2024′, period: ’11/22-12/27’, days: 35, kwh: 2508.00, cost: 446.89, avgDaily: 71.66, demand: 11.95 }, { month: ‘Jan 2025′, period: ’12/27-1/28’, days: 32, kwh: 3506.40, cost: 620.94, avgDaily: 109.58, demand: 15.96 }, { month: ‘Feb 2025’, period: ‘1/28-2/26’, days: 29, kwh: 2444.80, cost: 439.40, avgDaily: 84.30, demand: 15.98 }, { month: ‘Mar 2025’, period: ‘2/26-3/27’, days: 29, kwh: 2346.40, cost: 422.57, avgDaily: 80.91, demand: 12.16 }, { month: ‘Apr 2025’, period: ‘3/27-4/25’, days: 29, kwh: 2582.80, cost: 447.38, avgDaily: 89.06, demand: 9.67 }, { month: ‘May 2025’, period: ‘4/25-5/27’, days: 32, kwh: 3566.00, cost: 651.13, avgDaily: 111.44, demand: 13.14 }, { month: ‘Jun 2025’, period: ‘5/27-6/25’, days: 29, kwh: 4785.60, cost: 875.71, avgDaily: 165.02, demand: 19.23 }, { month: ‘Jul 2025’, period: ‘6/25-7/25’, days: 30, kwh: 5708.80, cost: 1039.99, avgDaily: 190.29, demand: 19.23 }, { month: ‘Aug 2025’, period: ‘7/25-8/25’, days: 31, kwh: 6198.40, cost: 1126.76, avgDaily: 199.95, demand: 19.25 }, { month: ‘Sep 2025’, period: ‘8/25-9/24’, days: 30, kwh: 4864.80, cost: 889.54, avgDaily: 162.16, demand: 17.13 } ]; const totalKwh = monthlyData.reduce((sum, m) => sum + m.kwh, 0); const totalCost = monthlyData.reduce((sum, m) => sum + m.cost, 0); const avgCostPerKwh = totalCost / totalKwh; const totalDays = monthlyData.reduce((sum, m) => sum + m.days, 0); const avgDailyKwh = totalKwh / totalDays; const seasonalData = [ { season: ‘Winter (Oct-Mar)’, kwh: 17067.20, cost: 3044.15, percentage: 37.8 }, { season: ‘Summer (Apr-Sep)’, kwh: 28057.40, cost: 5030.51, percentage: 62.2 } ]; const COLORS = [‘#3b82f6’, ‘#f59e0b’]; return ( <>

Building 4 – Power Usage Report

Gospel Rescue Mission | 4550 S Palo Verde Rd, Tucson, AZ 85714

Account: 2653060749 | Service: Small General Service (2654498380)

Reporting Period: September 25, 2024 – September 24, 2025

{/* Summary Cards */}

Total Annual Usage

{totalKwh.toLocaleString()}

kWh

Total Annual Cost

${totalCost.toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2})}

USD

Average Cost per kWh

${avgCostPerKwh.toFixed(4)}

per kWh

Avg Daily Usage

{avgDailyKwh.toFixed(1)}

kWh/day

{/* View Toggle */}
{view === ‘monthly’ && (
{monthlyData.map((row, idx) => ( ))}
Month Billing Period Days Total kWh Cost $/kWh Avg Daily kWh Peak Demand (kW)
{row.month} {row.period} {row.days} {row.kwh.toLocaleString()} ${row.cost.toFixed(2)} ${(row.cost / row.kwh).toFixed(4)} {row.avgDaily.toFixed(1)} {row.demand.toFixed(2)}
ANNUAL TOTAL {totalDays} {totalKwh.toLocaleString()} ${totalCost.toFixed(2)} ${avgCostPerKwh.toFixed(4)} {avgDailyKwh.toFixed(1)} 19.25
)} {view === ‘charts’ && (
{/* Monthly Usage Chart */}

Monthly kWh Usage

{/* Monthly Cost Chart */}

Monthly Cost

`$${value.toFixed(2)}`} />
{/* Seasonal Distribution */}

Seasonal Usage Distribution

`${season.split(‘ ‘)[0]}: ${percentage}%`} > {seasonalData.map((entry, index) => ( ))} `${value.toLocaleString()} kWh`} />

Seasonal Summary

{seasonalData.map((season, idx) => (

{season.season}

Usage:

{season.kwh.toLocaleString()} kWh

Cost:

${season.cost.toLocaleString(undefined, {minimumFractionDigits: 2})}

))}
{/* Key Insights */}

Key Insights

  • • Peak Usage: August 2025 (6,198 kWh, $1,126.76) – highest summer demand
  • • Lowest Usage: November 2024 (2,325 kWh, $415.88) – winter shoulder month
  • • Summer Impact: Summer months (Apr-Sep) account for 62.2% of annual usage but generate the highest costs due to elevated rates
  • • Peak Demand: Maximum demand of 19.25 kW reached in August 2025
  • • Cost Efficiency: Average cost per kWh is $0.1789, with seasonal variations affecting overall rates
)}

Report Notes

  • • Account is enrolled in Auto Pay – payments automatically debited
  • • Service Type: Small General Service
  • • Billing includes delivery services, power supply charges, surcharges, and taxes/assessments
  • • Summer rates (higher) apply from May-October; Winter rates apply November-April
  • • Peak demand charges vary by season and time of use
); }; export default PowerUsageReport;