egullickson/motovaultpro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Frontend manual extraction flow (#129) #136

New Issue
Closed
opened 2026-02-11 03:05:04 +00:00 by egullickson · 1 comment
egullickson commented 2026-02-11 03:05:04 +00:00
Owner
Copy Link

Relates to #129

Milestone 7: Frontend Manual Extraction Flow

Build the complete frontend flow for manual maintenance schedule extraction, review, and creation.

Flags: needs conformance check (mobile + desktop)

Files

  • frontend/src/features/documents/components/DocumentForm.tsx
  • frontend/src/features/documents/hooks/useManualExtraction.ts (NEW)
  • frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.tsx (NEW)
  • frontend/src/features/maintenance/hooks/useCreateSchedulesFromExtraction.ts (NEW)

Requirements

  • Remove "(Coming soon)" label from DocumentForm maintenance scan checkbox
  • After document upload with scanForMaintenance=true, trigger manual extraction job
  • Create useManualExtraction hook: submit job, poll status, track progress
  • Show progress indicator during extraction (percentage + message)
  • On completion, navigate to MaintenanceScheduleReviewScreen
  • Review screen: display items with checkboxes, inline editing, select/deselect
  • "Create Selected Schedules" button creates maintenance_schedules via existing API
  • All components work on mobile (full-screen) and desktop (modal/page)

Acceptance Criteria

  • Uploading a manual PDF with scan checkbox triggers extraction job
  • Progress indicator shows percentage and status message during processing
  • Review screen displays all extracted maintenance items
  • User can select/deselect and edit items before creation
  • Created items are maintenance_schedules with correct category, subtypes, intervals
  • Created schedules appear in vehicle's maintenance schedules list
  • Works on both mobile and desktop viewports
  • Error states handled: extraction failure, no items found, schedule creation failure

Tests

  • Test files: frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.test.tsx (NEW)
  • Test type: unit (component rendering + interaction)
  • Scenarios:
    • Normal: Renders extracted items with checkboxes
    • Normal: Select/deselect toggles items
    • Normal: Edit field updates item data
    • Edge: Empty extraction shows "no items found" message
    • Error: Schedule creation failure shows error
Relates to #129 ## Milestone 7: Frontend Manual Extraction Flow Build the complete frontend flow for manual maintenance schedule extraction, review, and creation. **Flags**: needs conformance check (mobile + desktop) ### Files - `frontend/src/features/documents/components/DocumentForm.tsx` - `frontend/src/features/documents/hooks/useManualExtraction.ts` (NEW) - `frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.tsx` (NEW) - `frontend/src/features/maintenance/hooks/useCreateSchedulesFromExtraction.ts` (NEW) ### Requirements - Remove "(Coming soon)" label from DocumentForm maintenance scan checkbox - After document upload with scanForMaintenance=true, trigger manual extraction job - Create `useManualExtraction` hook: submit job, poll status, track progress - Show progress indicator during extraction (percentage + message) - On completion, navigate to MaintenanceScheduleReviewScreen - Review screen: display items with checkboxes, inline editing, select/deselect - "Create Selected Schedules" button creates maintenance_schedules via existing API - All components work on mobile (full-screen) and desktop (modal/page) ### Acceptance Criteria - [ ] Uploading a manual PDF with scan checkbox triggers extraction job - [ ] Progress indicator shows percentage and status message during processing - [ ] Review screen displays all extracted maintenance items - [ ] User can select/deselect and edit items before creation - [ ] Created items are maintenance_schedules with correct category, subtypes, intervals - [ ] Created schedules appear in vehicle's maintenance schedules list - [ ] Works on both mobile and desktop viewports - [ ] Error states handled: extraction failure, no items found, schedule creation failure ### Tests - **Test files**: `frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.test.tsx` (NEW) - **Test type**: unit (component rendering + interaction) - **Scenarios**: - Normal: Renders extracted items with checkboxes - Normal: Select/deselect toggles items - Normal: Edit field updates item data - Edge: Empty extraction shows "no items found" message - Error: Schedule creation failure shows error
egullickson added the
status
backlog
type
feature
 labels 2026-02-11 03:12:41 +00:00
egullickson added
status
in-progress
 and removed
status
backlog
 labels 2026-02-11 16:38:44 +00:00
egullickson commented 2026-02-11 16:49:07 +00:00
Author
Owner
Copy Link

Milestone: Frontend Manual Extraction Flow

Phase: Execution | Agent: Frontend | Status: PASS

Completed

  • useManualExtraction hook (frontend/src/features/documents/hooks/useManualExtraction.ts)

    • Submits PDF to POST /api/ocr/extract/manual as multipart form
    • Polls GET /api/ocr/jobs/:jobId every 3s via React Query refetchInterval
    • Returns status, progress, result, error with full lifecycle management

  • useCreateSchedulesFromExtraction hook (frontend/src/features/maintenance/hooks/useCreateSchedulesFromExtraction.ts)

    • Batch creates maintenance schedules from extraction results
    • Maps items to CreateScheduleRequest with routine_maintenance category
    • Invalidates schedule and upcoming queries on success

  • MaintenanceScheduleReviewScreen (frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.tsx)

    • MUI Dialog: fullScreen on mobile, modal on desktop
    • Checkboxes with Select All / Deselect All
    • Inline editing for service name, interval miles, interval months
    • Confidence indicators, subtype chips, details display
    • Empty state ("No maintenance items found")
    • Error handling for schedule creation failures

  • DocumentForm updates (frontend/src/features/documents/components/DocumentForm.tsx)

    • Removed "(Coming soon)" label from scan checkbox
    • Shows "PDF will be scanned after upload" hint when checkbox checked
    • After file upload with scanForMaintenance, triggers extraction job
    • LinearProgress indicator during extraction with percentage
    • Extraction error display
    • Opens review dialog on extraction completion
    • Submit/Cancel buttons disabled during extraction

  • Unit tests (frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.test.tsx)

    • 12 tests, all passing
    • Rendering: items with checkboxes, intervals, details, subtype chips
    • Selection: toggle, deselect all, select all, disabled create when empty
    • Empty state: no items found message
    • Schedule creation: correct items passed, only selected items, error handling

Quality

  • TypeScript: 0 errors
  • ESLint: 0 new errors (222 pre-existing warnings)
  • Tests: 12/12 passing

Verdict: PASS | Next: Quality review

## Milestone: Frontend Manual Extraction Flow **Phase**: Execution | **Agent**: Frontend | **Status**: PASS ### Completed - **useManualExtraction hook** (`frontend/src/features/documents/hooks/useManualExtraction.ts`) - Submits PDF to `POST /api/ocr/extract/manual` as multipart form - Polls `GET /api/ocr/jobs/:jobId` every 3s via React Query refetchInterval - Returns status, progress, result, error with full lifecycle management - **useCreateSchedulesFromExtraction hook** (`frontend/src/features/maintenance/hooks/useCreateSchedulesFromExtraction.ts`) - Batch creates maintenance schedules from extraction results - Maps items to `CreateScheduleRequest` with `routine_maintenance` category - Invalidates schedule and upcoming queries on success - **MaintenanceScheduleReviewScreen** (`frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.tsx`) - MUI Dialog: fullScreen on mobile, modal on desktop - Checkboxes with Select All / Deselect All - Inline editing for service name, interval miles, interval months - Confidence indicators, subtype chips, details display - Empty state ("No maintenance items found") - Error handling for schedule creation failures - **DocumentForm updates** (`frontend/src/features/documents/components/DocumentForm.tsx`) - Removed "(Coming soon)" label from scan checkbox - Shows "PDF will be scanned after upload" hint when checkbox checked - After file upload with scanForMaintenance, triggers extraction job - LinearProgress indicator during extraction with percentage - Extraction error display - Opens review dialog on extraction completion - Submit/Cancel buttons disabled during extraction - **Unit tests** (`frontend/src/features/maintenance/components/MaintenanceScheduleReviewScreen.test.tsx`) - 12 tests, all passing - Rendering: items with checkboxes, intervals, details, subtype chips - Selection: toggle, deselect all, select all, disabled create when empty - Empty state: no items found message - Schedule creation: correct items passed, only selected items, error handling ### Quality - TypeScript: 0 errors - ESLint: 0 new errors (222 pre-existing warnings) - Tests: 12/12 passing *Verdict*: PASS | *Next*: Quality review
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
status
backlog
status/blocked
status
done
status
in-progress
status
ready
status
review
type
bug
type
chore
type
docs
type
feature
No Label
status
in-progress
type
feature
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
egullickson
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: egullickson/motovaultpro#136
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?