src/views-components/auto-logout/auto-logout.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import { connect } from "react-redux";
   6 import { useIdleTimer } from "react-idle-timer";
   7 import { Dispatch } from "redux";
   8
   9 import { RootState } from "~/store/store";
  10 import { SnackbarKind, snackbarActions } from "~/store/snackbar/snackbar-actions";
  11 import { logout } from "~/store/auth/auth-action";
  12 import parse from "parse-duration";
  13 import * as React from "react";
  14 import { min } from "lodash";
  15
  16 interface AutoLogoutDataProps {
  17     sessionIdleTimeout: number;
  18     lastWarningDuration: number;
  19 }
  20
  21 interface AutoLogoutActionProps {
  22     doLogout: () => void;
  23     doWarn: (message: string, duration: number) => void;
  24     doCloseWarn: () => void;
  25 }
  26
  27 const mapStateToProps = (state: RootState, ownProps: any): AutoLogoutDataProps => {
  28     return {
  29         sessionIdleTimeout: parse(state.auth.config.clusterConfig.Workbench.IdleTimeout, 's') || 0,
  30         lastWarningDuration: ownProps.lastWarningDuration || 60,
  31     };
  32 };
  33
  34 const mapDispatchToProps = (dispatch: Dispatch): AutoLogoutActionProps => ({
  35     doLogout: () => dispatch<any>(logout(true)),
  36     doWarn: (message: string, duration: number) =>
  37         dispatch(snackbarActions.OPEN_SNACKBAR({
  38             message, hideDuration: duration, kind: SnackbarKind.WARNING })),
  39     doCloseWarn: () => dispatch(snackbarActions.CLOSE_SNACKBAR()),
  40 });
  41
  42 type AutoLogoutProps = AutoLogoutDataProps & AutoLogoutActionProps;
  43
  44 export const AutoLogout = connect(mapStateToProps, mapDispatchToProps)(
  45     (props: AutoLogoutProps) => {
  46         let logoutTimer: NodeJS.Timer;
  47         const lastWarningDuration = min([props.lastWarningDuration, props.sessionIdleTimeout])! * 1000 ;
  48
  49         const handleOnIdle = () => {
  50             logoutTimer = setTimeout(
  51                 () => props.doLogout(), lastWarningDuration);
  52             props.doWarn(
  53                 "Your session is about to be closed due to inactivity",
  54                 lastWarningDuration);
  55         };
  56
  57         const handleOnActive = () => {
  58             clearTimeout(logoutTimer);
  59             props.doCloseWarn();
  60         };
  61
  62         useIdleTimer({
  63             timeout: (props.lastWarningDuration < props.sessionIdleTimeout)
  64                 ? 1000 * (props.sessionIdleTimeout - props.lastWarningDuration)
  65                 : 1,
  66             onIdle: handleOnIdle,
  67             onActive: handleOnActive,
  68             debounce: 500
  69         });
  70
  71         return <span />;
  72     });