yaver-feedback-react-native 0.8.9 → 0.8.11

package/dist/Discovery.js

@@ -257,15 +257,21 @@ class YaverDiscovery {
      */
     static async discoverViaRelay(convexUrl, authToken, deviceId) {
         try {
-            const settingsRes = await fetch(`${convexUrl}/auth/validate`, {
+            // /settings returns {ok, settings: {relayUrl, relayPassword, ...}}
+            // — `/auth/validate` only returns the user record. Using the
+            // wrong endpoint historically meant relayPassword stayed
+            // undefined and every relay-routed probe rejected with 401
+            // "invalid relay password" (relay/server.go:957).
+            const settingsRes = await fetch(`${convexUrl}/settings`, {
                 headers: { Authorization: `Bearer ${authToken}` },
             });
             let relayUrl;
             let relayPassword;
             if (settingsRes.ok) {
                 const settingsData = await settingsRes.json();
-                relayUrl = settingsData.relayUrl;
-                relayPassword = settingsData.relayPassword;
+                const inner = settingsData?.settings;
+                relayUrl = inner?.relayUrl ?? settingsData?.relayUrl;
+                relayPassword = inner?.relayPassword ?? settingsData?.relayPassword;
             }
             if (!relayUrl) {
                 const configRes = await fetch(`${convexUrl}/platform-config?key=relay_servers`);

package/dist/FeedbackModal.js

@@ -1049,7 +1049,15 @@ const RunnerAuthNativeModal = ({ runner, onClose }) => {
     const [session, setSession] = (0, react_1.useState)(null);
     const [startError, setStartError] = (0, react_1.useState)(null);
     const [copied, setCopied] = (0, react_1.useState)(false);
+    const [pasteCode, setPasteCode] = (0, react_1.useState)('');
+    const [submitting, setSubmitting] = (0, react_1.useState)(false);
+    const [submitError, setSubmitError] = (0, react_1.useState)(null);
     const startedRef = (0, react_1.useRef)(false);
+    // Claude is the only runner that needs the user to paste a verifier
+    // code back from platform.claude.com's callback page; Codex device-
+    // auth and OpenCode (no OAuth at all) bypass this. Mirrors the
+    // requiresPasteBack check in iOS YaverRunnerAuthFlowPane.swift.
+    const needsPasteBack = runner === 'claude' || runner === 'claude-code';
     (0, react_1.useEffect)(() => {
         if (startedRef.current)
             return;
@@ -1164,9 +1172,68 @@ const RunnerAuthNativeModal = ({ runner, onClose }) => {
                     </react_native_1.Text>
                   </react_native_1.Pressable>
                 </react_native_1.View>) : null}
+              {needsPasteBack ? (<react_native_1.View style={{ marginTop: 14 }}>
+                  <react_native_1.Text style={runnerAuthModalStyles.codeLabel}>
+                    PASTE CODE FROM CLAUDE.COM
+                  </react_native_1.Text>
+                  <react_native_1.View style={{ flexDirection: 'row', gap: 8, marginTop: 6 }}>
+                    <react_native_1.View style={{
+                    flex: 1,
+                    backgroundColor: 'rgba(148,163,184,0.10)',
+                    borderRadius: 10,
+                    paddingHorizontal: 10,
+                }}>
+                      {/* Lazy-import TextInput so the SDK doesn't pull
+                    extra surface from react-native at module load. */}
+                      {(() => {
+                    const { TextInput } = require('react-native');
+                    return (<TextInput value={pasteCode} onChangeText={(t) => {
+                            setPasteCode(t);
+                            setSubmitError(null);
+                        }} placeholder="paste code here" placeholderTextColor="#64748b" autoCapitalize="none" autoCorrect={false} spellCheck={false} style={{ color: '#f1f5f9', fontSize: 14, paddingVertical: 10 }}/>);
+                })()}
+                    </react_native_1.View>
+                    <react_native_1.Pressable disabled={!pasteCode.trim() || submitting} onPress={async () => {
+                    if (!session || !pasteCode.trim())
+                        return;
+                    setSubmitting(true);
+                    setSubmitError(null);
+                    try {
+                        const next = await YaverFeedback_1.YaverFeedback.submitRunnerBrowserAuthCode(session.id, pasteCode.trim());
+                        setSession(next);
+                        setPasteCode('');
+                    }
+                    catch (err) {
+                        setSubmitError(err instanceof Error ? err.message : String(err));
+                    }
+                    finally {
+                        setSubmitting(false);
+                    }
+                }} style={{
+                    paddingHorizontal: 14,
+                    justifyContent: 'center',
+                    backgroundColor: !pasteCode.trim() || submitting
+                        ? 'rgba(124,58,237,0.4)'
+                        : '#7c3aed',
+                    borderRadius: 10,
+                }}>
+                      <react_native_1.Text style={{ color: 'white', fontWeight: '600' }}>
+                        {submitting ? '…' : 'Submit'}
+                      </react_native_1.Text>
+                    </react_native_1.Pressable>
+                  </react_native_1.View>
+                  {submitError ? (<react_native_1.Text style={{
+                        marginTop: 6,
+                        color: '#fca5a5',
+                        fontSize: 12,
+                    }}>
+                      {submitError}
+                    </react_native_1.Text>) : null}
+                </react_native_1.View>) : null}
               <react_native_1.Text style={runnerAuthModalStyles.phishingHint}>
-                Device codes are a common phishing target. Never share this code. This dialog
-                turns green automatically once sign-in completes.
+                {needsPasteBack
+                ? 'After authorising on platform.claude.com, copy the code from the callback page and paste it above. Never share this code.'
+                : 'Device codes are a common phishing target. Never share this code. This dialog turns green automatically once sign-in completes.'}
               </react_native_1.Text>
             </react_native_1.View>)}
         </react_native_1.View>

package/dist/P2PClient.d.ts

@@ -47,6 +47,12 @@ export declare class P2PClient {
     startRunnerBrowserAuth(runner: string): Promise<RunnerBrowserAuthSession>;
     getRunnerBrowserAuthStatus(sessionId: string): Promise<RunnerBrowserAuthSession>;
     cancelRunnerBrowserAuth(sessionId: string): Promise<void>;
+    /** Submit the verifier code Anthropic shows on the callback page so
+     *  the agent can finalise claude CLI's OAuth handshake. Codex doesn't
+     *  use this — its device-auth flow auto-resolves via polling — but
+     *  the SDK still exposes it for symmetry with mobile/src/components/
+     *  RunnerAuthModal.tsx and the Swift YaverRunnerAuthFlowPane. */
+    submitRunnerBrowserAuthCode(sessionId: string, code: string): Promise<RunnerBrowserAuthSession>;
     capabilitySnapshot(): Promise<CapabilitySnapshot | null>;
     incidents(opts?: {
         category?: string;

package/dist/P2PClient.js

@@ -155,6 +155,25 @@ class P2PClient {
         }
         catch { /* best-effort */ }
     }
+    /** Submit the verifier code Anthropic shows on the callback page so
+     *  the agent can finalise claude CLI's OAuth handshake. Codex doesn't
+     *  use this — its device-auth flow auto-resolves via polling — but
+     *  the SDK still exposes it for symmetry with mobile/src/components/
+     *  RunnerAuthModal.tsx and the Swift YaverRunnerAuthFlowPane. */
+    async submitRunnerBrowserAuthCode(sessionId, code) {
+        const url = `${this.baseUrl}/runner-auth/browser/submit-code`;
+        const resp = await fetch(url, {
+            method: 'POST',
+            headers: { ...this.authHeaders(), 'Content-Type': 'application/json' },
+            body: JSON.stringify({ id: sessionId, code }),
+        });
+        if (!resp.ok) {
+            const text = await resp.text().catch(() => '');
+            throw new Error(`submitRunnerBrowserAuthCode HTTP ${resp.status}: ${text}`);
+        }
+        const data = await resp.json();
+        return data.session;
+    }
     async capabilitySnapshot() {
         try {
             const resp = await fetch(`${this.baseUrl}/capabilities/snapshot`, { headers: this.authHeaders() });
@@ -272,11 +291,12 @@ class P2PClient {
                 name: 'voice_note.m4a',
             });
         }
+        // Use authHeaders() so a relay-routed baseUrl carries
+        // X-Relay-Password — without it the relay rejects with 401
+        // "invalid relay password" before the agent ever sees the form.
         const response = await fetch(`${this.baseUrl}/feedback`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-            },
+            headers: this.authHeaders(),
             body: formData,
         });
         if (!response.ok) {
@@ -294,10 +314,7 @@ class P2PClient {
         for await (const event of events) {
             const response = await fetch(`${this.baseUrl}/feedback/stream`, {
                 method: 'POST',
-                headers: {
-                    Authorization: `Bearer ${this.authToken}`,
-                    'Content-Type': 'application/json',
-                },
+                headers: this.authHeaders({ 'Content-Type': 'application/json' }),
                 body: JSON.stringify(event),
             });
             if (!response.ok) {
@@ -316,10 +333,7 @@ class P2PClient {
     async startBuild(platform) {
         const response = await fetch(`${this.baseUrl}/builds`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-                'Content-Type': 'application/json',
-            },
+            headers: this.authHeaders({ "Content-Type": "application/json" }),
             body: JSON.stringify({ platform }),
         });
         if (!response.ok) {
@@ -359,9 +373,7 @@ class P2PClient {
         });
         const response = await fetch(`${this.baseUrl}/voice/transcribe`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-            },
+            headers: this.authHeaders(),
             body: formData,
         });
         if (!response.ok) {
@@ -401,7 +413,7 @@ class P2PClient {
         if (mode === 'dev') {
             const primary = await fetch(`${this.baseUrl}/dev/reload`, {
                 method: 'POST',
-                headers: { Authorization: `Bearer ${this.authToken}` },
+                headers: this.authHeaders(),
             });
             if (primary.ok) {
                 const payload = await primary.json().catch(() => ({}));
@@ -432,10 +444,7 @@ class P2PClient {
         const identity = resolveAppIdentity(opts);
         const res = await fetch(`${this.baseUrl}/dev/reload-app`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-                'Content-Type': 'application/json',
-            },
+            headers: this.authHeaders({ "Content-Type": "application/json" }),
             body: JSON.stringify({
                 mode: 'bundle',
                 ...identity,
@@ -479,10 +488,7 @@ class P2PClient {
         const identity = resolveAppIdentity(opts);
         const response = await fetch(`${this.baseUrl}/vibing/execute`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-                'Content-Type': 'application/json',
-            },
+            headers: this.authHeaders({ "Content-Type": "application/json" }),
             body: JSON.stringify({
                 prompt,
                 projectPath: identity.projectPath ?? opts?.projectPath ?? '',
@@ -510,7 +516,7 @@ class P2PClient {
         }
         const response = await fetch(`${this.baseUrl}/vibing/eligibility?${params.toString()}`, {
             method: 'GET',
-            headers: { Authorization: `Bearer ${this.authToken}` },
+            headers: this.authHeaders(),
         });
         if (!response.ok) {
             const text = await response.text().catch(() => '');
@@ -527,7 +533,7 @@ class P2PClient {
     async triggerFix(feedbackId) {
         const response = await fetch(`${this.baseUrl}/feedback/${encodeURIComponent(feedbackId)}/fix`, {
             method: 'POST',
-            headers: { Authorization: `Bearer ${this.authToken}` },
+            headers: this.authHeaders(),
         });
         if (!response.ok) {
             const text = await response.text().catch(() => '');
@@ -548,10 +554,7 @@ class P2PClient {
     async startTestSession() {
         const response = await fetch(`${this.baseUrl}/test-app/start`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-                'Content-Type': 'application/json',
-            },
+            headers: this.authHeaders({ "Content-Type": "application/json" }),
             body: JSON.stringify({ source: 'feedback-sdk' }),
         });
         if (!response.ok) {
@@ -564,7 +567,7 @@ class P2PClient {
     async stopTestSession() {
         await fetch(`${this.baseUrl}/test-app/stop`, {
             method: 'POST',
-            headers: { Authorization: `Bearer ${this.authToken}` },
+            headers: this.authHeaders(),
         });
     }
     /** Get the current test session status and list of fixes. */
@@ -580,10 +583,7 @@ class P2PClient {
     async rotateToken() {
         const response = await fetch(`${this.baseUrl}/sdk/token/rotate`, {
             method: 'POST',
-            headers: {
-                Authorization: `Bearer ${this.authToken}`,
-                'Content-Type': 'application/json',
-            },
+            headers: this.authHeaders({ "Content-Type": "application/json" }),
         });
         if (!response.ok) {
             const text = await response.text().catch(() => '');
@@ -602,7 +602,7 @@ class P2PClient {
      * for 30s in getFlagsCached().
      */
     async flagsEvaluate(userId = 'anonymous') {
-        const res = await fetch(`${this.baseUrl}/flags/eval?userId=${encodeURIComponent(userId)}`, { headers: { Authorization: `Bearer ${this.authToken}` } });
+        const res = await fetch(`${this.baseUrl}/flags/eval?userId=${encodeURIComponent(userId)}`, { headers: this.authHeaders() });
         if (!res.ok)
             return {};
         const data = await res.json();
@@ -610,7 +610,7 @@ class P2PClient {
     }
     /** Evaluate a single flag by key — shortcut when you only need one. */
     async flagsEvaluateOne(key, userId = 'anonymous') {
-        const res = await fetch(`${this.baseUrl}/flags/eval?userId=${encodeURIComponent(userId)}&flag=${encodeURIComponent(key)}`, { headers: { Authorization: `Bearer ${this.authToken}` } });
+        const res = await fetch(`${this.baseUrl}/flags/eval?userId=${encodeURIComponent(userId)}&flag=${encodeURIComponent(key)}`, { headers: this.authHeaders() });
         if (!res.ok)
             return undefined;
         const data = await res.json();
@@ -628,7 +628,7 @@ class P2PClient {
         if (deviceId)
             params.set('device', deviceId);
         const res = await fetch(`${this.baseUrl}/releases/latest?${params.toString()}`, {
-            headers: { Authorization: `Bearer ${this.authToken}` },
+            headers: this.authHeaders(),
         });
         if (!res.ok)
             return null;
@@ -638,7 +638,7 @@ class P2PClient {
     async releasesDownload(channel, semver) {
         const params = new URLSearchParams({ channel, semver });
         const res = await fetch(`${this.baseUrl}/releases/bundle?${params.toString()}`, {
-            headers: { Authorization: `Bearer ${this.authToken}` },
+            headers: this.authHeaders(),
         });
         if (!res.ok)
             return null;
@@ -654,10 +654,7 @@ class P2PClient {
         try {
             const res = await fetch(`${this.baseUrl}/analytics/ingest`, {
                 method: 'POST',
-                headers: {
-                    Authorization: `Bearer ${this.authToken}`,
-                    'Content-Type': 'application/json',
-                },
+                headers: this.authHeaders({ "Content-Type": "application/json" }),
                 body: JSON.stringify({
                     name,
                     props,

package/dist/YaverFeedback.d.ts

@@ -78,6 +78,10 @@ export declare class YaverFeedback {
     static startRunnerBrowserAuth(runner: string): Promise<import('./types').RunnerBrowserAuthSession>;
     static getRunnerBrowserAuthStatus(sessionId: string): Promise<import('./types').RunnerBrowserAuthSession>;
     static cancelRunnerBrowserAuth(sessionId: string): Promise<void>;
+    /** Submit the Claude paste-back verifier so the agent can finalise the
+     *  OAuth handshake. RunnerAuthModal calls this after the user copies
+     *  the code from platform.claude.com's callback page. */
+    static submitRunnerBrowserAuthCode(sessionId: string, code: string): Promise<import('./types').RunnerBrowserAuthSession>;
     /**
      * Sign out: clear cached token + device, tear down the P2P client. The
      * SDK stays enabled; the next feedback trigger will re-prompt for login.

package/dist/YaverFeedback.js

@@ -135,7 +135,50 @@ let enabled = false;
 let p2pClient = null;
 let shakeDetector = null;
 let p2pAuthToken = null;
+let p2pRelayPassword = '';
 let reportLaunchInFlight = false;
+/** Resolve the user's relay password by validating their auth token
+ *  against Convex. Used whenever we (re)build the P2PClient so a
+ *  relay-routed agentUrl carries a valid X-Relay-Password — without
+ *  this, every relay-tunneled request rejects with HTTP 401
+ *  "invalid relay password" (relay/server.go:957).
+ *
+ *  Cached on `p2pRelayPassword` so we only round-trip Convex when the
+ *  user's auth token actually changes. Returns "" on any failure so
+ *  direct LAN agentUrls (which need no password) keep working.
+ */
+async function resolveRelayPassword(authToken, convexUrl) {
+    const trimmed = (authToken || '').trim();
+    if (!trimmed) {
+        p2pRelayPassword = '';
+        return '';
+    }
+    const url = (convexUrl || config?.convexUrl || auth_1.DEFAULT_CONVEX_SITE_URL).replace(/\/+$/, '');
+    try {
+        // /settings returns {ok, settings: {relayPassword, relayUrl, ...}}
+        // Older accounts may flatten relayPassword to the top — match the
+        // tolerance the web shell already uses (route.ts:77).
+        const res = await fetch(`${url}/settings`, {
+            headers: { Authorization: `Bearer ${trimmed}` },
+        });
+        if (!res.ok)
+            return p2pRelayPassword;
+        const data = await res.json().catch(() => ({}));
+        const settings = data?.settings;
+        const pw = (typeof settings?.relayPassword === 'string' && settings.relayPassword) ||
+            (typeof data?.relayPassword === 'string'
+                ? data.relayPassword
+                : '') ||
+            '';
+        p2pRelayPassword = pw;
+        return pw;
+    }
+    catch {
+        // Network failure on a passive Convex round-trip shouldn't break
+        // direct-LAN flows. Fall through with whatever we already cached.
+        return p2pRelayPassword;
+    }
+}
 /** Ring buffer of captured errors. */
 let errorBuffer = [];
 let maxErrors = 5;
@@ -192,7 +235,8 @@ class YaverFeedback {
             return;
         }
         p2pAuthToken = token;
-        p2pClient = new P2PClient_1.P2PClient(effectiveUrl, token);
+        const rp = await resolveRelayPassword(token);
+        p2pClient = new P2PClient_1.P2PClient(effectiveUrl, token, rp);
     }
     /**
      * Initialize the feedback SDK with the given configuration.
@@ -271,7 +315,12 @@ class YaverFeedback {
         // Create P2P client if we have a URL
         if (config.agentUrl) {
             p2pAuthToken = config.authToken ?? null;
-            p2pClient = new P2PClient_1.P2PClient(config.agentUrl, config.authToken ?? '');
+            // Initial construction uses the cached p2pRelayPassword (empty on
+            // first init). rebuildP2PClient below resolves the real password
+            // from Convex and replaces this client — but only when authToken
+            // is set, so set a placeholder header here that won't 401 a
+            // direct-LAN url and will be overwritten before any relay hop.
+            p2pClient = new P2PClient_1.P2PClient(config.agentUrl, config.authToken ?? '', p2pRelayPassword);
             if (config.authToken) {
                 void YaverFeedback.rebuildP2PClient(config.agentUrl);
             }
@@ -571,6 +620,15 @@ class YaverFeedback {
             return;
         await p2pClient.cancelRunnerBrowserAuth(sessionId);
     }
+    /** Submit the Claude paste-back verifier so the agent can finalise the
+     *  OAuth handshake. RunnerAuthModal calls this after the user copies
+     *  the code from platform.claude.com's callback page. */
+    static async submitRunnerBrowserAuthCode(sessionId, code) {
+        if (!p2pClient) {
+            throw new Error('Not connected to any agent.');
+        }
+        return p2pClient.submitRunnerBrowserAuthCode(sessionId, code);
+    }
     /**
      * Sign out: clear cached token + device, tear down the P2P client. The
      * SDK stays enabled; the next feedback trigger will re-prompt for login.
@@ -891,7 +949,8 @@ class YaverFeedback {
                 });
                 if (result) {
                     config.agentUrl = result.url;
-                    p2pClient = new P2PClient_1.P2PClient(result.url, config.authToken ?? '');
+                    const rp = await resolveRelayPassword(config.authToken ?? '');
+                    p2pClient = new P2PClient_1.P2PClient(result.url, config.authToken ?? '', rp);
                 }
             }
             catch { }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yaver-feedback-react-native",
-  "version": "0.8.9",
+  "version": "0.8.11",
   "description": "Visual feedback SDK for Yaver \u2014 bug reports, screen recording, voice annotations, and local-first developer workflows",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/Discovery.ts

@@ -283,7 +283,12 @@ export class YaverDiscovery {
     deviceId: string,
   ): Promise<DiscoveryResult | null> {
     try {
-      const settingsRes = await fetch(`${convexUrl}/auth/validate`, {
+      // /settings returns {ok, settings: {relayUrl, relayPassword, ...}}
+      // — `/auth/validate` only returns the user record. Using the
+      // wrong endpoint historically meant relayPassword stayed
+      // undefined and every relay-routed probe rejected with 401
+      // "invalid relay password" (relay/server.go:957).
+      const settingsRes = await fetch(`${convexUrl}/settings`, {
         headers: { Authorization: `Bearer ${authToken}` },
       });
       let relayUrl: string | undefined;
@@ -291,8 +296,9 @@ export class YaverDiscovery {
 
       if (settingsRes.ok) {
         const settingsData = await settingsRes.json();
-        relayUrl = settingsData.relayUrl;
-        relayPassword = settingsData.relayPassword;
+        const inner = settingsData?.settings;
+        relayUrl = inner?.relayUrl ?? settingsData?.relayUrl;
+        relayPassword = inner?.relayPassword ?? settingsData?.relayPassword;
       }
 
       if (!relayUrl) {

package/src/FeedbackModal.tsx

@@ -1251,7 +1251,15 @@ const RunnerAuthNativeModal: React.FC<{
   const [session, setSession] = useState<import('./types').RunnerBrowserAuthSession | null>(null);
   const [startError, setStartError] = useState<string | null>(null);
   const [copied, setCopied] = useState(false);
+  const [pasteCode, setPasteCode] = useState('');
+  const [submitting, setSubmitting] = useState(false);
+  const [submitError, setSubmitError] = useState<string | null>(null);
   const startedRef = useRef(false);
+  // Claude is the only runner that needs the user to paste a verifier
+  // code back from platform.claude.com's callback page; Codex device-
+  // auth and OpenCode (no OAuth at all) bypass this. Mirrors the
+  // requiresPasteBack check in iOS YaverRunnerAuthFlowPane.swift.
+  const needsPasteBack = runner === 'claude' || runner === 'claude-code';
 
   useEffect(() => {
     if (startedRef.current) return;
@@ -1380,9 +1388,92 @@ const RunnerAuthNativeModal: React.FC<{
                   </Pressable>
                 </View>
               ) : null}
+              {needsPasteBack ? (
+                <View style={{ marginTop: 14 }}>
+                  <Text style={runnerAuthModalStyles.codeLabel}>
+                    PASTE CODE FROM CLAUDE.COM
+                  </Text>
+                  <View style={{ flexDirection: 'row', gap: 8, marginTop: 6 }}>
+                    <View
+                      style={{
+                        flex: 1,
+                        backgroundColor: 'rgba(148,163,184,0.10)',
+                        borderRadius: 10,
+                        paddingHorizontal: 10,
+                      }}
+                    >
+                      {/* Lazy-import TextInput so the SDK doesn't pull
+                          extra surface from react-native at module load. */}
+                      {(() => {
+                        const { TextInput } = require('react-native');
+                        return (
+                          <TextInput
+                            value={pasteCode}
+                            onChangeText={(t: string) => {
+                              setPasteCode(t);
+                              setSubmitError(null);
+                            }}
+                            placeholder="paste code here"
+                            placeholderTextColor="#64748b"
+                            autoCapitalize="none"
+                            autoCorrect={false}
+                            spellCheck={false}
+                            style={{ color: '#f1f5f9', fontSize: 14, paddingVertical: 10 }}
+                          />
+                        );
+                      })()}
+                    </View>
+                    <Pressable
+                      disabled={!pasteCode.trim() || submitting}
+                      onPress={async () => {
+                        if (!session || !pasteCode.trim()) return;
+                        setSubmitting(true);
+                        setSubmitError(null);
+                        try {
+                          const next = await YaverFeedback.submitRunnerBrowserAuthCode(
+                            session.id,
+                            pasteCode.trim(),
+                          );
+                          setSession(next);
+                          setPasteCode('');
+                        } catch (err) {
+                          setSubmitError(err instanceof Error ? err.message : String(err));
+                        } finally {
+                          setSubmitting(false);
+                        }
+                      }}
+                      style={{
+                        paddingHorizontal: 14,
+                        justifyContent: 'center',
+                        backgroundColor:
+                          !pasteCode.trim() || submitting
+                            ? 'rgba(124,58,237,0.4)'
+                            : '#7c3aed',
+                        borderRadius: 10,
+                      }}
+                    >
+                      <Text style={{ color: 'white', fontWeight: '600' }}>
+                        {submitting ? '…' : 'Submit'}
+                      </Text>
+                    </Pressable>
+                  </View>
+                  {submitError ? (
+                    <Text
+                      style={{
+                        marginTop: 6,
+                        color: '#fca5a5',
+                        fontSize: 12,
+                      }}
+                    >
+                      {submitError}
+                    </Text>
+                  ) : null}
+                </View>
+              ) : null}
               <Text style={runnerAuthModalStyles.phishingHint}>
-                Device codes are a common phishing target. Never share this code. This dialog
-                turns green automatically once sign-in completes.
+                {needsPasteBack
+                  ? 'After authorising on platform.claude.com, copy the code from the callback page and paste it above. Never share this code.'
+                  : 'Device codes are a common phishing target. Never share this code. This dialog turns green automatically once sign-in completes.'}
               </Text>
             </View>
           )}

package/src/P2PClient.ts

@@ -199,6 +199,29 @@ export class P2PClient {
     try { await fetch(url, { method: 'POST', headers: this.authHeaders() }); } catch { /* best-effort */ }
   }
 
+  /** Submit the verifier code Anthropic shows on the callback page so
+   *  the agent can finalise claude CLI's OAuth handshake. Codex doesn't
+   *  use this — its device-auth flow auto-resolves via polling — but
+   *  the SDK still exposes it for symmetry with mobile/src/components/
+   *  RunnerAuthModal.tsx and the Swift YaverRunnerAuthFlowPane. */
+  async submitRunnerBrowserAuthCode(
+    sessionId: string,
+    code: string,
+  ): Promise<RunnerBrowserAuthSession> {
+    const url = `${this.baseUrl}/runner-auth/browser/submit-code`;
+    const resp = await fetch(url, {
+      method: 'POST',
+      headers: { ...this.authHeaders(), 'Content-Type': 'application/json' },
+      body: JSON.stringify({ id: sessionId, code }),
+    });
+    if (!resp.ok) {
+      const text = await resp.text().catch(() => '');
+      throw new Error(`submitRunnerBrowserAuthCode HTTP ${resp.status}: ${text}`);
+    }
+    const data = await resp.json();
+    return data.session as RunnerBrowserAuthSession;
+  }
+
   async capabilitySnapshot(): Promise<CapabilitySnapshot | null> {
     try {
       const resp = await fetch(`${this.baseUrl}/capabilities/snapshot`, { headers: this.authHeaders() });
@@ -323,11 +346,12 @@ export class P2PClient {
       } as any);
     }
 
+    // Use authHeaders() so a relay-routed baseUrl carries
+    // X-Relay-Password — without it the relay rejects with 401
+    // "invalid relay password" before the agent ever sees the form.
     const response = await fetch(`${this.baseUrl}/feedback`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-      },
+      headers: this.authHeaders(),
       body: formData,
     });
 
@@ -348,10 +372,7 @@ export class P2PClient {
     for await (const event of events) {
       const response = await fetch(`${this.baseUrl}/feedback/stream`, {
         method: 'POST',
-        headers: {
-          Authorization: `Bearer ${this.authToken}`,
-          'Content-Type': 'application/json',
-        },
+        headers: this.authHeaders({ 'Content-Type': 'application/json' }),
         body: JSON.stringify(event),
       });
 
@@ -375,10 +396,7 @@ export class P2PClient {
   async startBuild(platform: string): Promise<any> {
     const response = await fetch(`${this.baseUrl}/builds`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-        'Content-Type': 'application/json',
-      },
+      headers: this.authHeaders({ "Content-Type": "application/json" }),
       body: JSON.stringify({ platform }),
     });
 
@@ -423,9 +441,7 @@ export class P2PClient {
 
     const response = await fetch(`${this.baseUrl}/voice/transcribe`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-      },
+      headers: this.authHeaders(),
       body: formData,
     });
 
@@ -471,7 +487,7 @@ export class P2PClient {
     if (mode === 'dev') {
       const primary = await fetch(`${this.baseUrl}/dev/reload`, {
         method: 'POST',
-        headers: { Authorization: `Bearer ${this.authToken}` },
+        headers: this.authHeaders(),
       });
       if (primary.ok) {
         const payload = await primary.json().catch(() => ({} as Record<string, unknown>));
@@ -505,10 +521,7 @@ export class P2PClient {
 
     const res = await fetch(`${this.baseUrl}/dev/reload-app`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-        'Content-Type': 'application/json',
-      },
+      headers: this.authHeaders({ "Content-Type": "application/json" }),
       body: JSON.stringify({
         mode: 'bundle',
         ...identity,
@@ -558,10 +571,7 @@ export class P2PClient {
     const identity = resolveAppIdentity(opts);
     const response = await fetch(`${this.baseUrl}/vibing/execute`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-        'Content-Type': 'application/json',
-      },
+      headers: this.authHeaders({ "Content-Type": "application/json" }),
       body: JSON.stringify({
         prompt,
         projectPath: identity.projectPath ?? opts?.projectPath ?? '',
@@ -600,7 +610,7 @@ export class P2PClient {
     }
     const response = await fetch(`${this.baseUrl}/vibing/eligibility?${params.toString()}`, {
       method: 'GET',
-      headers: { Authorization: `Bearer ${this.authToken}` },
+      headers: this.authHeaders(),
     });
     if (!response.ok) {
       const text = await response.text().catch(() => '');
@@ -618,7 +628,7 @@ export class P2PClient {
   async triggerFix(feedbackId: string): Promise<{ taskId: string; prompt: string }> {
     const response = await fetch(`${this.baseUrl}/feedback/${encodeURIComponent(feedbackId)}/fix`, {
       method: 'POST',
-      headers: { Authorization: `Bearer ${this.authToken}` },
+      headers: this.authHeaders(),
     });
     if (!response.ok) {
       const text = await response.text().catch(() => '');
@@ -641,10 +651,7 @@ export class P2PClient {
   async startTestSession(): Promise<{ sessionId: string }> {
     const response = await fetch(`${this.baseUrl}/test-app/start`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-        'Content-Type': 'application/json',
-      },
+      headers: this.authHeaders({ "Content-Type": "application/json" }),
       body: JSON.stringify({ source: 'feedback-sdk' }),
     });
 
@@ -660,7 +667,7 @@ export class P2PClient {
   async stopTestSession(): Promise<void> {
     await fetch(`${this.baseUrl}/test-app/stop`, {
       method: 'POST',
-      headers: { Authorization: `Bearer ${this.authToken}` },
+      headers: this.authHeaders(),
     });
   }
 
@@ -678,10 +685,7 @@ export class P2PClient {
   async rotateToken(): Promise<{ token: string; expiresAt: number }> {
     const response = await fetch(`${this.baseUrl}/sdk/token/rotate`, {
       method: 'POST',
-      headers: {
-        Authorization: `Bearer ${this.authToken}`,
-        'Content-Type': 'application/json',
-      },
+      headers: this.authHeaders({ "Content-Type": "application/json" }),
     });
 
     if (!response.ok) {
@@ -706,7 +710,7 @@ export class P2PClient {
   async flagsEvaluate(userId: string = 'anonymous'): Promise<Record<string, unknown>> {
     const res = await fetch(
       `${this.baseUrl}/flags/eval?userId=${encodeURIComponent(userId)}`,
-      { headers: { Authorization: `Bearer ${this.authToken}` } },
+      { headers: this.authHeaders() },
     );
     if (!res.ok) return {};
     const data = await res.json();
@@ -720,7 +724,7 @@ export class P2PClient {
   ): Promise<T | undefined> {
     const res = await fetch(
       `${this.baseUrl}/flags/eval?userId=${encodeURIComponent(userId)}&flag=${encodeURIComponent(key)}`,
-      { headers: { Authorization: `Bearer ${this.authToken}` } },
+      { headers: this.authHeaders() },
     );
     if (!res.ok) return undefined;
     const data = await res.json();
@@ -753,7 +757,7 @@ export class P2PClient {
     const params = new URLSearchParams({ channel });
     if (deviceId) params.set('device', deviceId);
     const res = await fetch(`${this.baseUrl}/releases/latest?${params.toString()}`, {
-      headers: { Authorization: `Bearer ${this.authToken}` },
+      headers: this.authHeaders(),
     });
     if (!res.ok) return null;
     return res.json();
@@ -766,7 +770,7 @@ export class P2PClient {
   ): Promise<ArrayBuffer | null> {
     const params = new URLSearchParams({ channel, semver });
     const res = await fetch(`${this.baseUrl}/releases/bundle?${params.toString()}`, {
-      headers: { Authorization: `Bearer ${this.authToken}` },
+      headers: this.authHeaders(),
     });
     if (!res.ok) return null;
     return res.arrayBuffer();
@@ -787,10 +791,7 @@ export class P2PClient {
     try {
       const res = await fetch(`${this.baseUrl}/analytics/ingest`, {
         method: 'POST',
-        headers: {
-          Authorization: `Bearer ${this.authToken}`,
-          'Content-Type': 'application/json',
-        },
+        headers: this.authHeaders({ "Content-Type": "application/json" }),
         body: JSON.stringify({
           name,
           props,

package/src/YaverFeedback.ts

@@ -148,8 +148,51 @@ let enabled = false;
 let p2pClient: P2PClient | null = null;
 let shakeDetector: ShakeDetector | null = null;
 let p2pAuthToken: string | null = null;
+let p2pRelayPassword: string = '';
 let reportLaunchInFlight = false;
 
+/** Resolve the user's relay password by validating their auth token
+ *  against Convex. Used whenever we (re)build the P2PClient so a
+ *  relay-routed agentUrl carries a valid X-Relay-Password — without
+ *  this, every relay-tunneled request rejects with HTTP 401
+ *  "invalid relay password" (relay/server.go:957).
+ *
+ *  Cached on `p2pRelayPassword` so we only round-trip Convex when the
+ *  user's auth token actually changes. Returns "" on any failure so
+ *  direct LAN agentUrls (which need no password) keep working.
+ */
+async function resolveRelayPassword(authToken: string, convexUrl?: string): Promise<string> {
+  const trimmed = (authToken || '').trim();
+  if (!trimmed) {
+    p2pRelayPassword = '';
+    return '';
+  }
+  const url = (convexUrl || config?.convexUrl || DEFAULT_CONVEX_SITE_URL).replace(/\/+$/, '');
+  try {
+    // /settings returns {ok, settings: {relayPassword, relayUrl, ...}}
+    // Older accounts may flatten relayPassword to the top — match the
+    // tolerance the web shell already uses (route.ts:77).
+    const res = await fetch(`${url}/settings`, {
+      headers: { Authorization: `Bearer ${trimmed}` },
+    });
+    if (!res.ok) return p2pRelayPassword;
+    const data = await res.json().catch(() => ({} as Record<string, unknown>));
+    const settings = (data as { settings?: { relayPassword?: string } })?.settings;
+    const pw =
+      (typeof settings?.relayPassword === 'string' && settings.relayPassword) ||
+      (typeof (data as { relayPassword?: string })?.relayPassword === 'string'
+        ? (data as { relayPassword?: string }).relayPassword
+        : '') ||
+      '';
+    p2pRelayPassword = pw;
+    return pw;
+  } catch {
+    // Network failure on a passive Convex round-trip shouldn't break
+    // direct-LAN flows. Fall through with whatever we already cached.
+    return p2pRelayPassword;
+  }
+}
+
 /** Ring buffer of captured errors. */
 let errorBuffer: CapturedError[] = [];
 let maxErrors = 5;
@@ -212,7 +255,8 @@ export class YaverFeedback {
       return;
     }
     p2pAuthToken = token;
-    p2pClient = new P2PClient(effectiveUrl, token);
+    const rp = await resolveRelayPassword(token);
+    p2pClient = new P2PClient(effectiveUrl, token, rp);
   }
 
   /**
@@ -295,7 +339,12 @@ export class YaverFeedback {
     // Create P2P client if we have a URL
     if (config.agentUrl) {
       p2pAuthToken = config.authToken ?? null;
-      p2pClient = new P2PClient(config.agentUrl, config.authToken ?? '');
+      // Initial construction uses the cached p2pRelayPassword (empty on
+      // first init). rebuildP2PClient below resolves the real password
+      // from Convex and replaces this client — but only when authToken
+      // is set, so set a placeholder header here that won't 401 a
+      // direct-LAN url and will be overwritten before any relay hop.
+      p2pClient = new P2PClient(config.agentUrl, config.authToken ?? '', p2pRelayPassword);
       if (config.authToken) {
         void YaverFeedback.rebuildP2PClient(config.agentUrl);
       }
@@ -596,6 +645,19 @@ export class YaverFeedback {
     await p2pClient.cancelRunnerBrowserAuth(sessionId);
   }
 
+  /** Submit the Claude paste-back verifier so the agent can finalise the
+   *  OAuth handshake. RunnerAuthModal calls this after the user copies
+   *  the code from platform.claude.com's callback page. */
+  static async submitRunnerBrowserAuthCode(
+    sessionId: string,
+    code: string,
+  ): Promise<import('./types').RunnerBrowserAuthSession> {
+    if (!p2pClient) {
+      throw new Error('Not connected to any agent.');
+    }
+    return p2pClient.submitRunnerBrowserAuthCode(sessionId, code);
+  }
+
   /**
    * Sign out: clear cached token + device, tear down the P2P client. The
    * SDK stays enabled; the next feedback trigger will re-prompt for login.
@@ -936,7 +998,8 @@ export class YaverFeedback {
         });
         if (result) {
           config.agentUrl = result.url;
-          p2pClient = new P2PClient(result.url, config.authToken ?? '');
+          const rp = await resolveRelayPassword(config.authToken ?? '');
+          p2pClient = new P2PClient(result.url, config.authToken ?? '', rp);
         }
       } catch {}
     }