Add client id to frontegg app

[alexandrudanpop]

Fixes OPS-3151

[linear]

OPS-3151 Add clientId to frontegg-setup and make it singleton

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/add-client-id

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[alexandrudanpop]

@coderabbitai review

[coderabbitai]

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[Copilot]

Pull request overview

This PR updates the Frontegg initialization to support client ID configuration and implements a singleton pattern to prevent multiple initializations. The changes convert the initialization function from accepting a simple string URL to an options object that can include URL, client ID, and tenant parameters.

• Refactored initializeFrontegg to accept an options object instead of separate parameters
• Added singleton pattern to cache the Frontegg app instance
• Updated all call sites to use the new options object syntax

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File	Description
packages/react-ui/src/app/lib/frontegg-setup.ts	Modified initialization function to accept options object, added singleton pattern, and introduced getFronteggApp helper
packages/react-ui/src/app/routes/cloud-connection/cloud-connection-page.tsx	Updated function call to pass URL as an options object
packages/react-ui/src/app/routes/cloud-connection/cloud-logout-page.tsx	Updated function call to pass URL as an options object

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[greptile-apps]

Greptile Overview

Greptile Summary

This PR adds clientId parameter support to the Frontegg authentication setup and implements a singleton pattern to prevent multiple initializations.

Key Changes:

• Refactored initializeFrontegg() to accept an options object with optional clientId parameter
• Added singleton pattern to ensure only one Frontegg app instance is created
• Created getFronteggApp() getter function for accessing the singleton instance
• Updated all call sites to use the new object parameter syntax

Code Quality:

• Clean refactoring following TypeScript best practices
• Proper use of optional parameters
• Singleton pattern prevents potential bugs from multiple initializations

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The changes are straightforward and well-structured - adding optional parameter support and a singleton pattern. The refactoring maintains backward compatibility by making clientId optional, and the singleton pattern is a good defensive measure. All call sites have been properly updated.
• No files require special attention

Important Files Changed

File Analysis

Filename	Score	Overview
packages/react-ui/src/app/lib/frontegg-setup.ts	4/5	Added clientId parameter support, singleton pattern to prevent multiple initializations, and getter function - clean refactoring with good patterns
packages/react-ui/src/app/routes/cloud-connection/cloud-connection-page.tsx	5/5	Updated function call to use object parameter syntax - straightforward migration to new API
packages/react-ui/src/app/routes/cloud-connection/cloud-logout-page.tsx	5/5	Updated function call to use object parameter syntax - straightforward migration to new API

Sequence Diagram

sequenceDiagram
    participant User
    participant CloudConnectionPage
    participant CloudLogoutPage
    participant fronteggSetup
    participant FronteggApp
    participant Frontegg API

    Note over User,Frontegg API: Authentication Flow

    User->>CloudConnectionPage: Navigate to /cloud-connection
    CloudConnectionPage->>CloudConnectionPage: Load flags (FRONTEGG_URL)
    CloudConnectionPage->>fronteggSetup: initializeFrontegg({ url, clientId? })
    
    alt First initialization
        fronteggSetup->>FronteggApp: initialize(options with clientId)
        fronteggSetup->>fronteggSetup: Store singleton instance
        fronteggSetup-->>CloudConnectionPage: Return new FronteggApp
    else Already initialized
        fronteggSetup-->>CloudConnectionPage: Return cached FronteggApp
    end

    CloudConnectionPage->>FronteggApp: app.ready()
    FronteggApp->>FronteggApp: Subscribe to store
    
    alt Not authenticated
        FronteggApp->>CloudConnectionPage: auth.isAuthenticated = false
        CloudConnectionPage->>FronteggApp: loginWithRedirect()
        FronteggApp->>Frontegg API: Redirect to login (with clientId)
        Frontegg API-->>User: OAuth flow
        User-->>Frontegg API: Complete authentication
        Frontegg API-->>FronteggApp: Return tokens
    else Already authenticated
        FronteggApp->>CloudConnectionPage: auth.isAuthenticated = true
        CloudConnectionPage->>CloudConnectionPage: Set cookies, store metadata
    end

    Note over User,Frontegg API: Logout Flow

    User->>CloudLogoutPage: Navigate to /cloud-logout
    CloudLogoutPage->>CloudLogoutPage: Load flags (FRONTEGG_URL)
    CloudLogoutPage->>fronteggSetup: initializeFrontegg({ url })
    fronteggSetup-->>CloudLogoutPage: Return cached FronteggApp
    CloudLogoutPage->>CloudLogoutPage: Remove cookies
    CloudLogoutPage->>FronteggApp: app.logout()
    FronteggApp->>Frontegg API: Logout request
    CloudLogoutPage->>CloudLogoutPage: Close window

Loading

[greptile-apps]

_{3 files reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}