Files
hapi/web
weishu a665386f05 fix(web): add safe-area-inset-top padding to prevent statusbar overlap on iOS PWA
This fixes an issue where viewport-fit=cover and black-translucent statusbar
configuration allowed content to extend under the iOS statusbar. Added env(safe-area-inset-top)
CSS handling to all main layout components:
- SessionHeader with pt-[env(safe-area-inset-top)]
- SessionsPage, MachinesPage, SpawnPage with safe-area padding
- FilesPage and FilePage headers with safe-area padding
2025-12-21 18:50:40 +08:00
..
2025-12-19 15:26:33 +08:00
2025-12-16 15:03:50 +08:00
2025-12-16 15:03:50 +08:00

hapi-web

React Mini App / PWA for monitoring and controlling hapi sessions.

What it does

  • Session list with status, pending approvals, and summaries.
  • Chat view with streaming updates and message sending.
  • Permission approval and denial workflows.
  • Machine list and remote session spawn.
  • File browser and git status/diff views.
  • PWA install prompt and offline banner.

Runtime behavior

  • When opened inside Telegram, auth uses Telegram WebApp init data.
  • When opened in a normal browser, you can log in with the shared CLI_API_TOKEN.
  • Live updates come from the server via SSE.

Development

From the repo root:

bun install
bun run dev:web

If testing in Telegram, set:

  • WEBAPP_URL to the public HTTPS URL of the dev server.
  • CORS_ORIGINS to include the dev server origin.

Build

bun run build:web

The built assets land in web/dist and are served by hapi-server. The single executable can embed these assets.

Stack

React 19 + Vite + TanStack Router/Query + Tailwind.