import { PrismaClient } from '@prisma/client';
import { notFound } from 'next/navigation';
import { QRCodeSVG } from 'qrcode.react';

export const dynamic = 'force-dynamic';

const prisma = new PrismaClient();

export default async function PropertyPage({ params }: { params: { id: string } }) {
  const property = await prisma.property.findUnique({
    where: { id: parseInt(params.id) },
  });

  if (!property) return notFound();

  // Full URL for the QR code
  // In production, you'd use a real host like process.env.NEXT_PUBLIC_SITE_URL
  const propertyUrl = `https://my-real-estate-app.com/properties/${property.id}`;

  return (
    <div className="max-w-4xl mx-auto p-6 mt-8">
      <div className="bg-white rounded shadow p-6">
        <div className="flex justify-between items-start">
          <div>
            <h1 className="text-3xl font-bold mb-2">{property.title}</h1>
            <p className="text-2xl text-primary font-semibold mb-4">{property.price} BHD</p>
          </div>
          <div className="text-center p-4 border rounded bg-gray-50">
            <QRCodeSVG value={propertyUrl} size={100} />
            <p className="text-xs mt-2 text-gray-500">Scan to view</p>
          </div>
        </div>

        <div className="mt-6">
          <h2 className="text-xl font-semibold mb-2 border-b pb-2">Description</h2>
          <div className="prose text-gray-700 whitespace-pre-wrap">
            {property.aiDescription || "No description provided."}
          </div>
        </div>

        {property.locationGps && (
          <div className="mt-6">
            <h2 className="text-xl font-semibold mb-2 border-b pb-2">Location</h2>
            <p className="text-gray-600">{property.locationGps}</p>
          </div>
        )}

        <div className="mt-8 border-t pt-6">
          <a href={`/properties/${property.id}/offer`} className="block w-full text-center bg-accent text-white py-3 rounded-lg text-lg font-bold hover:opacity-90">
            Make an Offer
          </a>
        </div>
      </div>
    </div>
  );
}