'use client'

import { GHLRenderer } from '@/lib/GHLRenderer'
import contactGridTree from '@/examples/contact-grid.json'
import type { UITree } from '@json-render/core'
import Link from 'next/link'

export default function ContactGridPage() {
  return (
    <div className="min-h-screen bg-gray-100">
      <nav className="bg-white border-b border-gray-200 px-4 py-2 flex items-center gap-3">
        <Link href="/" className="text-indigo-600 hover:text-indigo-800 text-sm font-medium">← Back</Link>
        <span className="text-gray-400">|</span>
        <span className="text-sm text-gray-600">Contact Grid Demo</span>
        <span className="ml-auto text-xs text-gray-400 font-mono">JSON: contact-grid.json</span>
      </nav>
      <div className="p-4 max-w-7xl mx-auto">
        <GHLRenderer tree={contactGridTree as unknown as UITree} />
      </div>
    </div>
  )
}
