opencode icon indicating copy to clipboard operation
opencode copied to clipboard

feat(web): add kiosk mode for simplified UI

Open cboecking opened this issue 1 week ago • 6 comments

Summary

Add kiosk mode to the web UI that provides a simplified user experience by hiding navigation elements.

URL Parameters

Parameter Description
?kiosk=true Hides sidebar and header
?dir=/path Auto-opens project and navigates to new session

Use Cases

  • Embedded deployments
  • Simplified onboarding experiences
  • Kiosk terminals
  • Single-project focused workflows

Example URLs

# Basic kiosk mode
http://localhost:4096/?kiosk=true

# Kiosk with auto-project
http://localhost:4096/?kiosk=true&dir=/home/user/my-project

Changes

  • packages/app/src/context/layout.tsx - Added kiosk.enabled() and kiosk.dir() state
  • packages/app/src/pages/layout.tsx - Conditional sidebar rendering
  • packages/app/src/components/session/session-header.tsx - Conditional header rendering
  • packages/app/src/pages/home.tsx - Auto-redirect logic for dir parameter
  • docs/KIOSK_MODE.md - Feature documentation

Test Plan

  • [x] Verify ?kiosk=true hides sidebar (desktop)
  • [x] Verify ?kiosk=true hides sidebar (mobile)
  • [x] Verify ?kiosk=true hides header
  • [x] Verify ?dir=/path auto-redirects to new session
  • [x] Verify normal mode unaffected without parameters
  • [x] Type checking passes

cboecking avatar Jan 07 '26 15:01 cboecking