@actinc/dls
Version:
Design Language System (DLS) for ACT & Encoura front-end projects.
37 lines • 2 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
* Copyright (c) ACT, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @prettier
*/
import { Button, Dialog, DialogContent, DialogTitle, Typography, } from '@mui/material';
import moment from 'moment';
import { useEffect, useState } from 'react';
import { StyledDialogActions } from './styles';
export var DialogContinueSession = function (_a) {
var expiresAt = _a.expiresAt, onContinue = _a.onContinue, onExpire = _a.onExpire;
var _b = useState(expiresAt.getTime() - Date.now()), timeUntilExpiration = _b[0], setTimeUntilExpiration = _b[1];
useEffect(function () {
var newTime = timeUntilExpiration - 1000 <= 0 ? 0 : timeUntilExpiration - 1000;
var timer = setTimeout(function () {
setTimeUntilExpiration(newTime);
}, 1000);
if (!timeUntilExpiration) {
onExpire();
}
return function () {
clearTimeout(timer);
};
}, [onExpire, setTimeUntilExpiration, timeUntilExpiration]);
if (timeUntilExpiration > 0) {
return (_jsxs(Dialog, { "aria-labelledby": "dialog-continue-session-title", fullWidth: true, maxWidth: "xs", open: true, children: [_jsx(DialogTitle, { id: "dialog-continue-session-title", children: "Do you want to continue your session?" }), _jsx(DialogContent, { children: _jsx(Typography, { variant: "body1", children: "For security reasons, your session will timeout at ".concat(moment(expiresAt).format('h:mm A'), " unless you continue.") }) }), _jsx(StyledDialogActions, { children: _jsx(Button, { color: "primary", fullWidth: true, onClick: function () {
onContinue();
}, variant: "contained", children: "Continue Session" }) })] }));
}
return null;
};
export default DialogContinueSession;
//# sourceMappingURL=index.js.map