feat(ENG-294): make polling the default OAuth completion mechanism

dev/nextjs/app/HubWrapper.tsx

@@ -16,6 +16,9 @@ export default function HubWrapper({ initialToken, apiUrl, appUrl }: HubWrapperP
 
     return (
         <div className={theme}>
+            <p style={{ fontSize: 12, color: '#666', marginBottom: 4 }}>
+                Environment — api: <code>{apiUrl}</code> · app: <code>{appUrl}</code>
+            </p>
             <div style={{ display: 'flex', gap: 8, marginBottom: 12 }}>
                 <input
                     style={{ flex: 1, padding: 6, border: '1px solid #ccc', borderRadius: 4 }}

dev/vite/SuspenseMRE.tsx

@@ -199,6 +199,9 @@ function SuspenseMREContent() {
 
             {isCorsProtected && connectState.status === 'idle' && (
                 <div style={{ marginBottom: 16 }}>
+                    <div style={{ fontSize: 12, color: '#666', marginBottom: 4 }}>
+                        Environment — api: <code>{apiUrl}</code> · app: <code>{appUrl}</code>
+                    </div>
                     <div style={{ fontSize: 12, color: '#666', marginBottom: 8 }}>
                         Paste a connect session token (the /connect_sessions endpoint is
                         CORS-protected on dev and production so it cannot be automatically created

dev/vite/main.tsx

@@ -100,6 +100,9 @@ const HubWrapper: React.FC = () => {
             <p>Current mode: {mode || 'No mode selected'}</p>
             {isCorsProtected && (
                 <>
+                    <p style={{ fontSize: 12, color: '#666', marginBottom: 4 }}>
+                        Environment — api: <code>{apiUrl}</code> · app: <code>{appUrl}</code>
+                    </p>
                     <p>
                         Paste a connect session token (the /connect_sessions endpoint is
                         CORS-protected on dev and production so it cannot be automatically created

src/modules/integration-picker/IntegrationPicker.tsx

@@ -1,4 +1,4 @@
-import { Card } from '@stackone/malachite';
+import { Alert, Card } from '@stackone/malachite';
 import { useCallback, useMemo, useState } from 'react';
 import { IntegrationPickerContent } from './components/IntegrationPickerContent';
 import { IntegrationPickerTitle } from './components/IntegrationPickerTitle';
@@ -144,6 +144,9 @@ export const IntegrationPicker: React.FC<IntegrationPickerProps> = ({
                       }
             }
         >
+            {connectionState.timedOut && (
+                <Alert type="warning" message="Connection timed out. Please try again." hasMargin />
+            )}
             <IntegrationPickerContent
                 isLoading={isLoading}
                 hasError={hasError}