React-session-timeout-alert NPM

React Session Timeout Alert

npm downloads

A Session Timeout Alert component to display after a set idle time for a user. The primary purpose for the alert is to logout a authenticated user after a set time of no interaction with the UI.

Install

npm install react-session-timeout-alert

Available Props

Name	Type	Default	Description
alertActionsClass	String	rst-alert-actions	Class for Alert Modal actions
alertContainerClass	String	rst-alert	Class for Alert Modal container
alertContentClass	String	rst-alert-content	Class for Alert Modal content
alertTimerClass	String	rst-alert-timer	Class for Alert Modal timer
alertTitle	String	null	Title for Alert Modal
alertDescription	String	null	Description for Alert Modal
cancelBtn	Object	{class: "rst-btn rst-btn-danger", text: "Stay Logged In", type: "button"}	Title and Text for Alert cancel button
confirmBtn	Object	{class: "rst-btn rst-btn-primary", text: "Logout", type: "submit"}	Title and Text for Alert submit button
debounceTime	Number	500	delay in ms before timer starts back due to user inactivity proceeding re-activity
handleSessionTimeout	Function	() => alert("logging out")	Function to call on Alert submit button click and alert timer end
idleTime	Number	5	Number of minutes before displaying alert modal
modalTimeout	Number	20	Number of seconds for countdown before hiding alert modal and calling handleSessionTimeout method

Basic Usage

import { ReactSessionTimeoutAlert } from 'react-session-timeout-alert';

<ReactSessionTimeoutAlert
  idleTime={5}
  modalTimeout={20}
  alertTitle={"Idle Timeout Warning"}
  alertDescription={"You are about to be logged out due to inactivity"}
  cancelBtn={{
    text: "Cancel",
    class: "rst-btn rst-btn-danger"
  }}
  handleSessionTimeout = {() => alert("logging out")}
/>