docs: add Tailscale and ngrok setup for phone/tablet access

[smolpaws]

What

Adds a new Phone & Tablet Access page under the Agent Canvas tab with two options for accessing a local Agent Canvas from mobile devices.

Why

Common user request (came up in #proj-agent-canvas on Slack). Users want to interact with their local Agent Canvas from a phone or iPad without complex networking setup.

What changes

• New page: openhands/usage/agent-canvas/mobile-access.mdx
• Added to Agent Canvas tab navigation in docs.json (between Customize and ACP Agents)

Tailscale (recommended for personal use)

• Private encrypted network between devices, no port forwarding, no internet exposure
• 5-step setup: install → sign in → find IP → start agent-canvas → open in browser
• Includes a tip about clearing stale localStorage (the stored backend config points at 127.0.0.1 which is localhost on the phone)

ngrok (for remote access)

• Secure tunnel with public URL
• Links to --public mode and LOCAL_BACKEND_API_KEY docs for proper authentication

Context

We set this up today (Tailscale + Agent Canvas on iPad) and hit the localStorage gotcha ourselves, so the instructions are battle-tested.

[all-hands-bot]

✅ Review complete.

This review was performed through OpenHands Cloud Automation. You can log in and view the conversation here.

[all-hands-bot]

Code Review: docs: add Tailscale and ngrok setup for phone/tablet access

Overview

Good addition — the two-option approach (Tailscale vs ngrok) covers the main use cases well, and the security warning for ngrok is appropriately prominent.

Taste Rating: 🟡 Acceptable

Documentation is clear and well-structured, but a few minor improvements are worth considering.

---

[IMPROVEMENT OPPORTUNITIES]

• [openhands/usage/agent-canvas/mobile-access.mdx, Line 31] Incomplete command: The ngrok command shows ngrok http 8000, but Agent Canvas UI typically runs on port 8000 while the backend API uses port 3000. Consider specifying the full URL format or clarifying which component the user should expose.

• [openhands/usage/agent-canvas/mobile-access.mdx, Line 23-26] Tip could be more actionable: The stale browser data tip mentions clearing localStorage but doesn't provide the specific steps. Consider adding a brief "How to clear localStorage" note or linking to browser docs.

---

[STYLE NOTES]

• Overall structure and tone match the existing documentation style well.
• MDX component usage (<Tip>, <Warning>) is consistent with repo conventions.
• No unnecessary comments or noise.

---

[RISK ASSESSMENT]

• [Overall PR] ⚠️ Risk Assessment: 🟢 LOW
  Documentation-only PR. No code changes, no security vulnerabilities introduced. The ngrok security warning appropriately alerts users to enable authentication.

---

VERDICT:

✅ Worth merging: Documentation is solid and addresses a real user need. The suggested improvements are minor and optional.

KEY INSIGHT:

This fills a genuine gap in the docs — mobile access is a common user request that wasn't previously documented. The Tailscale recommendation is sensible (zero-config, encrypted, no port forwarding) and the ngrok option provides flexibility for users who need public access.

---

This review was generated by an AI agent (OpenHands) on behalf of the user through OpenHands Automation. View conversation

[DevinVinson]

I like it! I think it is a bit slim but I would still be fine with merging this in as-is because I'd love to see how much traffic this gets and general usage. LMK @enyst

[enyst]

OK, thank you, let's try, and perhaps people using it cam also improve it

[enyst]

@OpenHands read all top comments; merge main branch and fix conflicts carefully. push, then babysit ci and verify if the pr still achieves its goal; fix according to feedback if you see fit . feel free to merge it when done - mention me in a comment when done

[openhands-ai]

I'm on it! enyst can track my progress at all-hands.dev

[enyst]

@enyst done — I read the top-level comments, merged main, resolved the docs.json nav conflict by keeping both the new Phone & Tablet Access page and the new Critic page, tightened the stale-backend/ngrok auth guidance, pushed the update, and watched CI. The PR passed the Mintlify internal link check and has been squash-merged.

This comment was created by an AI agent (OpenHands) on behalf of the user.

[openhands-ai]

Done. PR #556 has been updated and squash-merged: #556

Summary:

• Read the top-level PR comments and review context.
• Merged main into the actual PR head branch (smolpaws/oh-docs:docs/tailscale-mobile-access).
• Resolved the docs.json conflict by keeping both mobile-access and the new critic page in Agent Canvas nav.
• Tightened the new mobile-access page with clearer stale-backend guidance and authenticated ngrok setup.
• Verified the final PR diff only changed:
  • docs.json
  • openhands/usage/agent-canvas/mobile-access.mdx
• Ran and passed Mintlify internal link checking via npx -y mint@latest broken-links.
• Watched PR CI: internal link check passed; external link job skipped as expected.
• Posted the requested completion comment mentioning @enyst with AI disclosure.

Merge commit: 996051f3ee00698eee5097cd6f1ed11e8285f3fb.