Desktop OAuth Flow

This diagram illustrates the OAuth authentication flow for third-party integrations (e.g., Hubspot) within the Remix Desktop application.

Flow Overview

The OAuth process begins when a user is configuring a widget in an artifact view and needs to authenticate with a third-party service. The flow uses a popup window pattern to handle the OAuth authentication without disrupting the main configuration interface.

Step-by-Step Process

1. Initiation: User clicks the OAuth sign-in button for a third-party integration (e.g., Hubspot) while configuring a widget in the artifact view.
2. Popup Creation: The desktop app opens a popup window and navigates to the oauth_signin screen within _rmx_artifact.
3. Middleware Redirect: The oauth_signin screen acts as middleware, executing an open link action to redirect the popup to the third-party OAuth URL.
4. User Authentication: The user completes the OAuth sign-in process on the third-party platform (Hubspot).
5. Confirmation & Notification: After successful authentication, the third party redirects back to the confirmation screen in _rmx_artifact. This screen performs two critical actions:
   • Publishes a message that the artifact config view is listening for, notifying it that sign-in is complete
   • Closes the popup window
6. Completion: The artifact config view receives the completion message and the OAuth flow is complete.

Dependencies

For this OAuth flow to function properly, _rmx_artifact must include two required screens:

• oauth_signin - Middleware screen that handles the redirect to third-party OAuth URLs
• confirmation - Handles post-authentication cleanup by publishing the completion message and closing the popup

These screens can be found at: https://remix.remixlabs.com/e/edit/_rmx_artifact

Desktop oauth component

Desktop artifact example