@actinc/dls
Version:
Design Language System (DLS) for ACT & Encoura front-end projects.
48 lines • 3.16 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
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.
*/
import { Button, Dialog, DialogContent, DialogTitle, Typography, } from '@mui/material';
import dayjs from 'dayjs';
import { useEffect, useState } from 'react';
import { StyledDialogActions } from './styles';
export var DialogContinueSession = function (_a) {
var confirmationButtonProps = _a.confirmationButtonProps, _b = _a.confirmationText, confirmationText = _b === void 0 ? 'Continue Session' : _b, cancellationButtonProps = _a.cancellationButtonProps, cancellationText = _a.cancellationText, content = _a.content, contentProps = _a.contentProps, dialogProps = _a.dialogProps, expiresAt = _a.expiresAt, onContinue = _a.onContinue, onExpire = _a.onExpire, _c = _a.title, title = _c === void 0 ? 'Do you want to continue your session?' : _c, titleProps = _a.titleProps;
var _d = useState(expiresAt.getTime() - Date.now()), timeUntilExpiration = _d[0], setTimeUntilExpiration = _d[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, __assign({ "aria-labelledby": "dialog-continue-session-title", fullWidth: true, maxWidth: "xs", open: true }, dialogProps, { children: [_jsx(DialogTitle, __assign({ id: "dialog-continue-session-title" }, titleProps, { children: title })), _jsx(DialogContent, __assign({}, contentProps, { children: content || (_jsx(Typography, { variant: "body1", children: "For security reasons, your session will timeout at ".concat(dayjs(expiresAt).format('h:mm A'), " unless you continue.") })) })), _jsxs(StyledDialogActions, { children: [cancellationText && (_jsx(Button, __assign({ color: "primary", fullWidth: true, onClick: function () {
onExpire();
}, variant: "contained" }, cancellationButtonProps, { children: cancellationText }))), _jsx(Button, __assign({ color: "primary", fullWidth: true, onClick: function () {
onContinue();
}, variant: "contained" }, confirmationButtonProps, { children: confirmationText }))] })] })));
}
return null;
};
export default DialogContinueSession;
//# sourceMappingURL=index.js.map