import { Container } from "@react-three/uikit";
import { Loader } from '@react-three/uikit-lucide'
import { useRef } from 'react'
import { useFrame } from '@react-three/fiber'

const LoadingSpinner = ({ ...props }) => {
  const ref = useRef()
  useFrame(({ clock }) => {
    ref.current.setStyle({ "transformRotateZ": clock.getElapsedTime() * -100 })
  })
  return (
    <Container {...props}>
      <Loader ref={ref} />
    </Container>
  )
};