import { Dialog, DialogContent } from "@/interface/components/ui/dialog";
import { state } from "@/utils";

export function LoadingDialog() {
  const { beatmap, replay} = state();

  if (beatmap && replay) {
    return;
  }

  return (
    <Dialog
      open={true}
    >
      <DialogContent className="sm:max-w-[425px]" hideCloseButton={true}>
        <div className="bottom-0 left-0 ">
          <h3 className="scroll-m-20 text-2xl font-semibold tracking-tight flex items-center gap-3">
            Loading replay...
          </h3>
          <div className="opacity-75">
            <h3 className="text-sm">Your replay is being loaded</h3>
          </div>
        </div>
      </DialogContent>
    </Dialog>
  );
}
