Content-Length: 455638 | pFad | http://github.com/umbraco/Umbraco-CMS/pull/19702

A9 Adds background worker to check timeout state by iOvergaard · Pull Request #19702 · umbraco/Umbraco-CMS · GitHub
Skip to content

Adds background worker to check timeout state #19702

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 28 commits into from
Jul 10, 2025

Conversation

iOvergaard
Copy link
Contributor

@iOvergaard iOvergaard commented Jul 9, 2025

Description

This pull request introduces session timeout handling and token management improvements across multiple files, along with localization updates for timeout-related messages. The key changes include implementing a session timeout controller, enhancing token state management, and adding localized messages for session expiration warnings.

How to test

  1. Log in
  2. Go to chrome://inspect/#workers and inspect the "Token Check Worker"
  3. You can see the messages coming out of the worker
  4. Set Umbraco:Global:TimeOut to something low like "00:02:00", which is two minutes. Then log in and wait 30 seconds, you should now see a modal counting down
  5. Confirm that both buttons "Log out" and "Stay logged in" work as intended
  6. Let the countdown go to 0 and confirm that you are, in fact, logged out

Sequence

User:

flowchart TD
    Start([User logs into Umbraco]) --> Working[User working normally in Umbraco]
    
    Working --> TokenCheck{Background: Token check every 30s}
    TokenCheck --> |Token OK| Working
    
    TokenCheck --> |Token expires in <60s| WarningModal[⚠️ Session Timeout Warning Modal<br/>Shows countdown timer]
    
    WarningModal --> UserChoice{User decides}
    
    UserChoice --> |Clicks 'Continue'| ValidateToken[System validates/refreshes token]
    UserChoice --> |Clicks 'Logout'| LoggedOut[👋 User logged out]
    UserChoice --> |Ignores modal<br/>Timer expires| ValidateToken
    
    ValidateToken --> TokenValid{Token validation}
    TokenValid --> |Success| Working
    TokenValid --> |Fails| LoggedOut
    
    TokenCheck --> |Token already expired| AutoLogout[🚨 Automatic logout<br/>No warning given]
    AutoLogout --> LoggedOut
    
    LoggedOut --> LoginScreen[🔐 Redirected to login screen]
    LoginScreen --> |User logs in again| Start
    
    style WarningModal fill:#fff2cc,stroke:#d6b656
    style AutoLogout fill:#f8cecc,stroke:#b85450
    style LoggedOut fill:#f8cecc,stroke:#b85450
    style Working fill:#d5e8d4,stroke:#82b366
    style LoginScreen fill:#e1d5e7,stroke:#9673a6
Loading

System:

sequenceDiagram
    participant AC as AuthContext
    participant ASTC as AuthSessionTimeoutController
    participant AF as AuthFlow
    participant TCW as TokenCheckWorker
    participant MM as ModalManager
    participant User as User

    Note over AC,ASTC: Initialization
    AC->>ASTC: constructor(host, authFlow)
    ASTC->>TCW: new SharedWorker(token-check.worker.js)
    ASTC->>TCW: port.start()
    
    Note over AF,TCW: Token Setup
    AF->>ASTC: token$ observable emits tokenResponse
    ASTC->>TCW: postMessage({command: 'init', tokenResponse})
    TCW->>TCW: setInterval(VALIDATION_INTERVAL: 30s)
    
    Note over TCW,TCW: Periodic Token Validation
    loop Every 30 seconds
        TCW->>TCW: isTokenExpired(tokenResponse)
        TCW->>TCW: Check if token expires in < 60s buffer
        
        alt Token is expired
            TCW->>ASTC: postMessage({command: 'logout'})
            ASTC->>AC: host.timeOut()
            AC->>ASTC: timeoutSignal emits
            ASTC->>TCW: postMessage({command: 'init'}) // stop worker
            ASTC->>MM: close('auth-timeout')
            
        else Token needs refresh (< 60s remaining)
            TCW->>ASTC: postMessage({command: 'refreshToken', secondsUntilLogout})
            ASTC->>ASTC: #timeoutModal(secondsUntilLogout)
            ASTC->>MM: open(UMB_MODAL_AUTH_TIMEOUT)
            MM->>User: Show timeout modal
            
            alt User clicks Continue
                User->>ASTC: onContinue()
                ASTC->>ASTC: #tryValidateToken()
                ASTC->>AC: validateToken()
                
                alt Token validation succeeds
                    AC->>ASTC: Token refreshed
                    Note over ASTC: Continue normal flow
                    
                else Token validation fails
                    AC->>ASTC: Error thrown
                    ASTC->>AC: host.timeOut()
                end
                
            else User clicks Logout
                User->>ASTC: onLogout()
                ASTC->>AC: signOut()
                
            else Modal times out/closes
                ASTC->>ASTC: #tryValidateToken()
                ASTC->>AC: validateToken()
            end
        end
    end
Loading

Changes

Session Timeout Handling:

Token Management Enhancements:

Localization Updates:

Modal and Worker Implementation:

Build Configuration:

Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR adds a background shared worker to monitor token expiration, integrates a session timeout controller in the auth context, implements a modal for timeout warnings, updates Vite configs to support a custom base path, and includes new translations for timeout messages.

  • Enable WebWorker support in TS config
  • Introduce SharedWorker token-check logic and session timeout controller
  • Add modal UI and localization entries for session expiration warnings

Reviewed Changes

Copilot reviewed 14 out of 14 changed files in this pull request and generated 5 comments.

Show a summary per file
File Description
src/Umbraco.Web.UI.Client/tsconfig.json Added WebWorker to lib for shared worker support
src/Umbraco.Web.UI.Client/src/vite-config-base.ts Added optional base argument to default Vite config
src/Umbraco.Web.UI.Client/src/packages/core/vite.config.ts Set base path for core package builds
src/Umbraco.Web.UI.Client/src/packages/core/auth/workers/token-check.worker.ts Implemented shared worker to periodically check token state
src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-auth-timeout-modal.token.ts Defined UmbModalAuthTimeoutConfig and modal token
src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-auth-timeout-modal.element.ts Built the countdown modal UI for session timeout
src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/manifests.ts Registered the timeout modal in the modal manifests
src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/index.ts Exported the new timeout modal token
src/Umbraco.Web.UI.Client/src/packages/core/auth/controllers/auth-session-timeout.controller.ts Added controller to wire the token-check worker and modal
src/Umbraco.Web.UI.Client/src/packages/core/auth/auth.context.ts Instantiated session timeout controller in the auth context
src/Umbraco.Web.UI.Client/src/packages/core/auth/auth-flow.ts Replaced #tokenResponse with UmbObjectState and streams
src/Umbraco.Web.UI.Client/src/assets/lang/en.ts Added English timeout warning translations
src/Umbraco.Web.UI.Client/src/assets/lang/de.ts Added German timeout warning translations
src/Umbraco.Web.UI.Client/src/assets/lang/da.ts Added Danish timeout warning translations
Comments suppressed due to low confidence (2)

src/Umbraco.Web.UI.Client/src/packages/core/auth/controllers/auth-session-timeout.controller.ts:41

  • This comment is incomplete. Either finish describing the action (e.g., "Post the new token to the worker") or remove it to avoid confusion.
				// Post the new

src/Umbraco.Web.UI.Client/src/packages/core/auth/workers/token-check.worker.ts:1

  • The new shared worker logic should have accompanying unit tests to validate expiration detection, refresh messaging, and logout signaling.
import type { TokenResponse } from '@umbraco-cms/backoffice/external/openid';

Copy link
Member

@leekelleher leekelleher left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested out, works as advertised! 🚀

@leekelleher leekelleher enabled auto-merge (squash) July 10, 2025 10:18
@leekelleher leekelleher merged commit e6c169e into main Jul 10, 2025
26 of 27 checks passed
@leekelleher leekelleher deleted the v16/feature/check-timeout-and-logout branch July 10, 2025 13:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: http://github.com/umbraco/Umbraco-CMS/pull/19702

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy