"use client";

import React from "react";
import loaderData from "@/public/lotties/Loader.json";
import dynamic from "next/dynamic";

function Loading() {
  const Lottie = dynamic(() => import("react-lottie"), { ssr: false });

  const defaultOptions = {
    loop: true,
    autoplay: true,
    animationData: loaderData,
    rendererSettings: {
      preserveAspectRatio: "xMidYMid slice",
    },
  };
  return (
    <div className="flex flex-col items-center justify-center h-screen">
      <Lottie
        options={defaultOptions}
        isClickToPauseDisabled
        style={{ width: "150px", height: "100px", cursor: "default" }}
      />
      <h6 className="text-2xl font-light text-center mt-4">Hang tight! We’re discovering your passion...</h6>
    </div>
  );
}

export default Loading;