Files
headquarter/openspec/changes/mobile-tool-profile-ui/change.md
Developer 350b393457 feat: rework mobile UI for Tool Workshop and Profile pages
- Rework ToolWorkshopMobileView to support full desktop functionality:
  definition type selection (Compose/Dockerfile/Manifest), manifest editor,
  conditional port, startup command, readiness probe, required variables,
  and validation feedback.
- Add ProfileMobileView and wire ProfilePage to render it on mobile.
- Update useToolWorkshop hook to return boolean success from submit.
- Add responsive CSS for mobile forms, edit views, and manifest editor.
- Update project maps.

Quality gates: npm run typecheck, npm run lint, npm test -- --run (87 passed)

Refs: openspec/changes/mobile-tool-profile-ui
2026-06-13 21:41:42 +00:00

1.4 KiB

Mobile Tool Workshop & Profile UI Rework

Goal

Completely rework the mobile experience for the Tool Workshop (tool configuration) and Profile (user profile configuration) pages so they are usable on small viewports while preserving all existing desktop functionality.

Scope

  • Rework ToolWorkshopMobileView to expose every field and action available on the desktop editor, including manifest definition support.
  • Add a new ProfileMobileView and update ProfilePage to render it on small viewports.
  • Keep desktop layouts and behavior unchanged.
  • No backend API changes.

Acceptance Criteria

  • On viewports narrower than 768 px, the Tool Workshop page renders a mobile-friendly list/detail/edit flow.
  • Tool type creation and editing on mobile support: definition type selection (Compose/Dockerfile/Manifest), manifest editor, interface type, conditional port, startup command, readiness probe, required variables, and all existing validation.
  • On viewports narrower than 768 px, the Profile page renders a mobile-friendly form with avatar upload, name/email editing, validation, and save feedback.
  • All existing desktop functionality remains intact.
  • npm run typecheck and npm run lint pass in apps/web.

Out of Scope

  • Backend changes.
  • Changes to other pages (sessions, settings, etc.).
  • New features beyond the existing desktop capabilities.