Job Timeline

import { TradeJobTimeline } from '@/components/blocks/trade-job-timeline'

import { TradeJobTimeline } from '@/components/blocks/trade-job-timeline'

export default function TradeJobTimelineDemo() {
  return (
    <div className="mx-auto max-w-3xl px-4 py-6 sm:px-6">
      <TradeJobTimeline
        heading="What the job looks like"
        intro="A full bathroom renovation runs three weeks. Here's where each one goes."
        phases={[
          {
            window: 'Week 1',
            title: 'Strip-out & rough-in',
            detail:
              'We protect floors, strip the old room, and set new waste and water points to plan.',
            headsUp: 'Water off for the house Tuesday 9am–11am.',
          },
          {
            window: 'Week 2',
            title: 'Waterproof & tile',
            detail:
              'Membrane cured and inspected, then wall and floor tiles set to the layout you signed off.',
            headsUp: 'No access through the ensuite door while adhesives cure overnight.',
          },
          {
            window: 'Days 12–14',
            title: 'Fit-off',
            detail:
              'Vanity, shower screen, tapware, and lights go in. Grout and silicone finish the wet areas.',
          },
          {
            window: 'Week 3',
            title: 'Paint, clean, commission',
            detail:
              'Final paint touch-ups, full clean, and every tap and waste tested under pressure.',
            headsUp: 'Trades on site Monday–Wednesday; driveway blocked for the skip until Wednesday noon.',
          },
        ]}
        done={{
          title: 'Final walkthrough',
          detail: 'We walk every job with you before we invoice, snags fixed the same week.',
        }}
        note="Weather and asbestos are the two things that move dates. We call you the same day either shows up."
      />
    </div>
  )
}