import React from "react";
import { Mask, SpinLoading } from "antd-mobile";

export default function MyLoading({ visible, text }) {
  return (
    <Mask visible={visible}>
      <div className="absolute top-1/2 left-1/2 w-40 h-40 bg-white -mt-20 -ml-20 rounded-lg flex flex-col gap-4 items-center justify-center">
        <SpinLoading style={{ "--size": "48px" }} />
        <p className="text-base text-gray-400 font-bold">{text}</p>
      </div>
    </Mask>
  );
}