'use client'

import React, { useState } from 'react'
import ModelViewer from '@/components/model/ModelViewer'

export default function Home() {
  const [error, setError] = useState<string | null>(null)

  const handleModelLoaded = (data: {
    meshes: unknown[]
    boundingBox: {
      min: { x: number; y: number; z: number }
      max: { x: number; y: number; z: number }
    }
  }) => {
    setError(null)
    console.log('Model loaded successfully:', data)
  }

  const handleError = (errorMessage: string) => {
    setError(errorMessage)
  }

  const handleSelectModel = (path: string) => {
    console.log('Model selected:', path)
  }

  return (
    <div className="relative h-screen">
      <ModelViewer
        modelPath="/models/your_model_name.gltf" //пока что передаем модель через navigation page
        onModelLoaded={handleModelLoaded}
        onError={handleError}
        onSelectModel={handleSelectModel}
      />

      {error && (
        <div className="absolute top-4 right-4 left-4 z-50 rounded-lg bg-red-600/90 p-4 text-sm text-white md:right-auto md:left-4 md:w-80">
          <strong>Error:</strong> {error}
        </div>
      )} 
    </div>
  )
}