@wener/console
Version:
Base console UI toolkit
54 lines (53 loc) • 2.3 kB
JavaScript
import React, { useEffect, useState } from "react";
import { HiMiniArrowPath, HiOutlineNoSymbol, HiMiniArrowRightOnRectangle as LoginIcon } from "react-icons/hi2";
import clsx from "clsx";
import { Button, NonIdealState } from "../../daisy/index.js";
import { useAuthStore } from "../../foundation/auth/AuthStore.js";
import { getUserAction } from "./getUserAction.js";
export const UserAuthExpireOverlay = () => {
const { signIn } = getUserAction();
const expired = useAuthStore((s) => s.status === "Expired");
const [hidden, setHidden] = useState(!expired);
useEffect(() => {
if (expired) {
setHidden(false);
}
}, [
expired
]);
if (hidden) {
return null;
}
return /*#__PURE__*/ React.createElement("div", {
className: clsx("absolute inset-0 z-50 flex items-center justify-center", "transition duration-500", expired ? "opacity-100 backdrop-blur-sm" : "pointer-events-none opacity-0 backdrop-blur-none", hidden && !expired && "hidden"),
onAnimationEnd: () => {
if (!expired) {
setHidden(true);
}
}
}, /*#__PURE__*/ React.createElement("div", {
className: "rounded border-base-200 bg-base-100 px-8 py-4 shadow-xl"
}, /*#__PURE__*/ React.createElement(NonIdealState, {
icon: /*#__PURE__*/ React.createElement(HiOutlineNoSymbol, {
className: "h-12 w-12"
}),
title: "\u767B\u9646\u5931\u6548",
description: "\u8BF7\u5C1D\u8BD5\u91CD\u65B0\u767B\u9646\u6216\u5237\u65B0\u9875\u9762",
action: /*#__PURE__*/ React.createElement("div", {
className: "flex gap-2 opacity-95"
}, /*#__PURE__*/ React.createElement(Button, {
className: "btn-success btn-sm",
onClick: signIn
}, /*#__PURE__*/ React.createElement(LoginIcon, {
className: "h-4 w-4"
}), "\u767B\u9646"), /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: () => {
window.location.reload();
}
}, /*#__PURE__*/ React.createElement(HiMiniArrowPath, {
className: "h-4 w-4"
}), "\u5237\u65B0"))
})));
};
//# sourceMappingURL=UserAuthExpireOverlay.js.map