Files

T

Developer 98d4393387 feat: redesign mobile Config Profiles detail, preview, and edit pages

- Rewrite ConfigProfilesMobileView to match desktop functionality:
  full detail view with all fields, preview action showing resolved
  profile, and edit view with project/tool selects, includes,
  environment variables, runtime hints, files, mounts with nested
  files, and git mounts.
- Update useConfigProfiles.handleSubmit to return boolean success.
- Update ConfigProfilesPage to pass required state and callbacks.
- Add mobile-specific CSS for config profile forms, includes,
  mount/file cards, and preview panels.
- Allow MobileDetailView to render extra children.

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

Refs: openspec/changes/mobile-config-profiles-ui

2026-06-13 22:04:17 +00:00

1.5 KiB

Raw Blame History

Mobile Config Profiles UI Rework

Goal

Redesign the mobile Config Profiles detail ("preview") and edit pages to match the full desktop functionality, following the same mobile UX pattern used for the Tool Workshop.

Scope

Rewrite ConfigProfilesMobileView so the detail view displays all profile fields and supports resolving/previewing the profile.
Rewrite the mobile edit view to expose every field available on the desktop editor:
- name, description, project, tool type, default flag
- includes with add/remove/reorder
- environment variables
- runtime hints
- files
- mounts with nested files
- git mounts
Update ConfigProfilesPage to pass the required state and callbacks.
Update useConfigProfiles so handleSubmit returns success status for cleaner mobile navigation.
Add mobile-specific CSS for config profile forms.

Acceptance Criteria

On viewports narrower than 768 px, the Config Profiles page renders a mobile-friendly list/detail/edit flow.
The mobile detail view shows all profile fields and offers a Preview action that displays the resolved profile.
The mobile edit view supports all desktop fields, including includes, runtime hints, files, mounts, nested mount files, and git mounts.
All existing desktop functionality remains intact.
npm run typecheck and npm run lint pass in apps/web.

Out of Scope

Backend API changes.
Changes to other pages.
New features beyond existing desktop capabilities.

1.5 KiB Raw Blame History