switch preview auth flow to auth gateway

Author: mephmanx

.env.local.example

@@ -1,5 +1,4 @@
-MFE_PREVIEW_AUTH_ISSUER_URL=https://auth.suncoast.systems
-MFE_PREVIEW_AUTH_CLIENT_ID=graphql-api-7603d234
-MFE_PREVIEW_AUTH_AUDIENCE=
-MFE_PREVIEW_AUTH_SCOPE=openid profile email
+MFE_PREVIEW_AUTH_GATEWAY_URL=https://login.suncoast.systems
+MFE_PREVIEW_AUTH_APP_SLUG=example-mfe-preview
+MFE_PREVIEW_AUTH_CODE_PARAM=gateway_code
 MFE_PREVIEW_PORT=4173

.env.production.example

@@ -1,4 +1,3 @@
-MFE_PREVIEW_AUTH_ISSUER_URL=https://auth.suncoast.systems
-MFE_PREVIEW_AUTH_CLIENT_ID=
-MFE_PREVIEW_AUTH_AUDIENCE=
-MFE_PREVIEW_AUTH_SCOPE=openid profile email
+MFE_PREVIEW_AUTH_GATEWAY_URL=https://login.suncoast.systems
+MFE_PREVIEW_AUTH_APP_SLUG=example-mfe-preview
+MFE_PREVIEW_AUTH_CODE_PARAM=gateway_code

README.md

@@ -51,20 +51,20 @@ Local preview:
 
 Supported env vars:
 
-- `MFE_PREVIEW_AUTH_ISSUER_URL` (preview login default, usually `https://auth.suncoast.systems`)
-- `MFE_PREVIEW_AUTH_CLIENT_ID` (preview login client id)
-- `MFE_PREVIEW_AUTH_AUDIENCE` (preview login audience, optional)
-- `MFE_PREVIEW_AUTH_SCOPE` (preview login scope, default `openid profile email`)
+- `MFE_PREVIEW_AUTH_GATEWAY_URL` (preview login gateway, usually `https://login.suncoast.systems`)
+- `MFE_PREVIEW_AUTH_APP_SLUG` (registered app slug in auth-gateway, for example `example-mfe-preview`)
+- `MFE_PREVIEW_AUTH_CODE_PARAM` (query key returned by gateway callback, default `gateway_code`)
 - `MFE_PREVIEW_PORT` (dev only)
 
 ## Local Preview Login
 
-The local preview page (`/preview/`) now includes a login helper that runs OAuth/OIDC code+PKCE in-browser:
+The local preview page (`/preview/`) now includes a login helper that uses the shared auth-gateway flow:
 
-1. Fill `Auth Issuer URL` and `Auth Client ID` (or set `MFE_PREVIEW_AUTH_*` env vars).
+1. Fill `Auth Gateway URL` and `Auth App Slug` (or set `MFE_PREVIEW_AUTH_*` env vars).
 2. Click `Login` on the preview page.
-3. After redirect back to `/preview/`, the access token is auto-filled into `Auth Token`.
-4. Click `Apply / Remount` to use that token for GraphQL HTTP/WS requests.
+3. Gateway returns to `/preview/` with a one-time code (`gateway_code` by default).
+4. Preview exchanges that code at `/v1/auth/exchange` and auto-fills `Auth Token`.
+5. Click `Apply / Remount` to use that token for GraphQL HTTP/WS requests.
 
 If your auth provider returns `access_token` in URL hash (implicit flow), the preview page will capture that too.
 

preview/index.html

@@ -145,20 +145,16 @@ <h1 style="margin:0; font-size: 1.1rem;">Example MFE Local Preview</h1>
           <input id="authToken" />
         </div>
         <div class="row">
-          <label for="authIssuer">Auth Issuer URL</label>
-          <input id="authIssuer" value="https://auth.suncoast.systems" />
+          <label for="authGateway">Auth Gateway URL</label>
+          <input id="authGateway" value="https://login.suncoast.systems" />
         </div>
         <div class="row">
-          <label for="authClientId">Auth Client ID</label>
-          <input id="authClientId" />
+          <label for="authAppSlug">Auth App Slug</label>
+          <input id="authAppSlug" value="example-mfe-preview" />
         </div>
         <div class="row">
-          <label for="authAudience">Auth Audience (optional)</label>
-          <input id="authAudience" />
-        </div>
-        <div class="row">
-          <label for="authScope">Auth Scope</label>
-          <input id="authScope" value="openid profile email" />
+          <label for="authCodeParam">Auth Code Query Param</label>
+          <input id="authCodeParam" value="gateway_code" />
         </div>
         <div class="row">
           <label for="conversationId">Conversation Id (optional)</label>