Session timeouts can be extended or disabled

Silent session expirations destroy work in progress and are disproportionately harmful to users with cognitive disabilities, fine motor impairments, or anyone who types slowly. WCAG 2.2 SC 2.2.1 (Timing Adjustable) is a Level A requirement: if a timed session exists, users must receive at least 20 seconds of warning and the ability to extend it. Losing an unsaved multi-step form or a long text entry to an invisible timeout is not a minor annoyance — it causes real task failure.

Show a warning dialog before session expiry and provide a one-click extension. The WCAG 2.2 SC 2.2.1 minimum is 20 seconds of warning.

useEffect(() => {
  const SESSION_DURATION = 15 * 60 * 1000 // 15 minutes
  const WARN_BEFORE = 30 * 1000 // warn 30 seconds before

  const warningTimer = setTimeout(() => {
    setShowExpiryWarning(true)
  }, SESSION_DURATION - WARN_BEFORE)

  return () => clearTimeout(warningTimer)
}, [])

// In the warning dialog:
<dialog open={showExpiryWarning} aria-live="assertive">
  <p>Your session will expire in 30 seconds.</p>
  <button onClick={extendSession}>Stay logged in</button>
  <button onClick={logout}>Log out</button>
</dialog>

Ensure form state is either saved to a draft or preserved in localStorage so work survives even if the user does not respond in time.