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
This commit is contained in:
@@ -6,7 +6,7 @@ import { ConfigProfileListSidebar } from "../components/features/config-profiles
|
||||
import { ConfigProfileEditorPanel } from "../components/features/config-profiles/ConfigProfileEditorPanel";
|
||||
import { ConfigProfilesMobileView } from "../components/features/config-profiles/ConfigProfilesMobileView";
|
||||
|
||||
type MobileView = "list" | "detail" | "edit";
|
||||
type MobileView = "list" | "detail" | "edit" | "preview";
|
||||
|
||||
export const ConfigProfilesPage = () => {
|
||||
const isMobile = useMobileViewport();
|
||||
@@ -100,11 +100,18 @@ export const ConfigProfilesPage = () => {
|
||||
return (
|
||||
<ConfigProfilesMobileView
|
||||
profiles={profiles}
|
||||
projects={projects}
|
||||
toolTypes={toolTypes}
|
||||
selectedProfile={selectedProfile}
|
||||
mobileView={mobileView}
|
||||
isCreating={isCreating}
|
||||
formData={formData}
|
||||
includedProfileIds={includedProfileIds}
|
||||
availableProfiles={availableProfilesForInclude()}
|
||||
previewData={previewData}
|
||||
previewingId={previewingId}
|
||||
saveStatus={saveStatus}
|
||||
error={error}
|
||||
onViewChange={setMobileView}
|
||||
onSelect={handleSelectProfile}
|
||||
onCreate={handleCreateNew}
|
||||
@@ -112,6 +119,23 @@ export const ConfigProfilesPage = () => {
|
||||
onFormChange={updateFormField}
|
||||
onSubmit={handleSubmit}
|
||||
getScopeLabel={getScopeLabel}
|
||||
getIncludedProfile={getIncludedProfile}
|
||||
onAddInclude={addInclude}
|
||||
onRemoveInclude={removeInclude}
|
||||
onAddEnvVar={addEnvVar}
|
||||
onUpdateEnvVar={updateEnvVar}
|
||||
onRemoveEnvVar={removeEnvVar}
|
||||
onAddFile={addFile}
|
||||
onUpdateFile={updateFile}
|
||||
onRemoveFile={removeFile}
|
||||
onAddMount={addMount}
|
||||
onUpdateMount={updateMount}
|
||||
onRemoveMount={removeMount}
|
||||
onAddMountFile={addMountFile}
|
||||
onUpdateMountFile={updateMountFile}
|
||||
onRemoveMountFile={removeMountFile}
|
||||
onPreview={handlePreview}
|
||||
onClosePreview={() => setPreviewData(null)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user