/*
auto-generated by: https://github.com/pmndrs/gltfjsx
*/
import React, { forwardRef, ForwardedRef } from 'react'
import { useGLTF } from '@react-three/drei/useGLTF'

import { GLTF } from 'three/examples/jsm/loaders/GLTFLoader'
import { Mesh, MeshBasicMaterial } from 'three'

type GLTFResult = GLTF & {
  nodes: {
    collisions: THREE.Mesh
  }
  materials: {
    collision: THREE.MeshStandardMaterial
  }
}

const Model = forwardRef(
  (props: JSX.IntrinsicElements['group'], ref: ForwardedRef<Mesh>) => {
    const { nodes } = useGLTF('/model/plaza_collision.glb') as GLTFResult

    const material = new MeshBasicMaterial({
      wireframe: true,
      color: 0xffff00,
    })

    return (
      <group {...props} dispose={null}>
        <mesh
          ref={ref}
          material={material}
          geometry={nodes.collisions.geometry}
          visible={true}
          position={[-5.31, 1.23, -32.92]}
        />
      </group>
    )
  },
)

useGLTF.preload('/model/collision_mesh.glb')

export default Model