import { Head, Link } from '@inertiajs/react'; import { ArrowRight, BatteryCharging, CalendarDays, ClipboardList, MapPin, Sun, } from 'lucide-react'; import { TicketCard, ReportIssueButton, StatusPill, } from '@/components/ticket/ticket-ui'; import { formatDate, formatNumber } from '@/lib/format'; import type { CustomerAccount, CustomerAccountSummary, CustomerJob, CustomerTicket, } from '@/types'; type Props = { account: CustomerAccount; customer: CustomerAccountSummary | null; tickets: CustomerTicket[]; jobs: CustomerJob[]; counts: { open: number; waiting_on_you: number; urgent: number; }; }; export default function TicketDashboard({ account, customer, tickets, jobs, counts, }: Props) { const firstName = account.name.split(' ')[0]; return ( <>

{customer?.customer_number ?? 'Your account'}

Hello, {firstName}.

{counts.open === 0 ? 'Nothing open right now. Report anything that changes.' : `${counts.open} report${counts.open === 1 ? '' : 's'} being worked on.`}

0 ? 'The support team has replied.' : undefined } /> 0 ? 'Being triaged first.' : undefined } />
0 ? ( View all ) : null } > {tickets.length === 0 ? ( ) : (
    {tickets.slice(0, 5).map((ticket) => (
  • {ticket.display_number} {ticket.needs_your_reply ? ( Reply needed ) : null}

    {ticket.issue}

    Reported{' '} {formatDate( ticket.reported_at, )} {ticket.job ? ` · ${ticket.job.job_number}` : ''}

    • ))}
)} {jobs.length === 0 ? (

We do not have an installation linked to your account yet. If we installed your system, tell us the address and we will connect it.

) : (
    {jobs.map((job) => (
  • {job.job_number} {job.system_size_kw ? ( {formatNumber( job.system_size_kw, )}{' '} kW ) : null}

    {job.title}

    {job.address ? (

    {job.address}

    ) : null}

    {job.status_label} {job.install_date ? ` · ${formatDate(job.install_date)}` : ''}

    • ))}
)}

Looking after your system

Keep the panels clear of shade and debris, and check the inverter display now and then. Generation on a cloudy day is lower and normal — compare a full day against the same month last year in your monitoring app before reporting a fault. If production is zero, or the inverter is off or showing an error, report it.

); } function SummaryTile({ label, value, icon: Icon, tone, hint, }: { label: string; value: number; icon: React.ComponentType<{ className?: string }>; tone: string; hint?: string; }) { return (

{label}

{value}

{hint ? (

{hint}

) : null}
); } function EmptyReports() { return (

No reports yet

When something is not right — no generation, a fault code, a bill that does not add up — report it here and it goes straight to the support desk.

); }