import { Head, router, usePage } from '@inertiajs/react'; import { PortfolioTabs, LocationFilter } from '@/components/portfolio/PortfolioTabs'; import { TrendingUp } from 'lucide-react'; type Month = { month: string; non_renewal_projected: number; broken_projected: number; scheduled_move_outs: number; grand_total_mo: number; projected_leases_signed: number; scheduled_move_ins: number; projected_net_move_in: number; projected_occupied: number; total_units: number; projected_occupancy_rate: number; }; export default function Projections() { const props = usePage().props as unknown as { months: Month[]; location: string | null; locationOptions: { id: number; name: string }[]; }; const { months, location, locationOptions } = props; return ( <>

Projections

Twelve-month occupancy forecast from renewals, broken leases, and expected new signings.

router.get('/portfolio/projections', { location: v }, { preserveState: true })} />
{months.map((m) => ( ))}
Month Non renewal proj Broken proj Scheduled MO = Grand total MO Projected leases signed Scheduled move ins Proj net move in Proj occupancy
{m.month} {m.non_renewal_projected ? `−${m.non_renewal_projected}` : 0} −{m.broken_projected} {m.scheduled_move_outs ? `−${m.scheduled_move_outs}` : 0} −{m.grand_total_mo} +{m.projected_leases_signed} {m.scheduled_move_ins ? `+${m.scheduled_move_ins}` : 0} = 0 ? 'text-emerald-600' : 'text-destructive'}`}> {m.projected_net_move_in >= 0 ? '+' : ''}{m.projected_net_move_in} {m.projected_occupied} / {m.total_units} ({m.projected_occupancy_rate}%)
); }