# Unified App Migration Checklist

**Track your progress** as you implement the unified app.

---

## Phase 1: Project Setup (0.5 days)

### Directory Structure
- [ ] Create directory structure in root (`/mnt/e/proiecte/roa2web/`)
- [ ] Create `src/` subdirectories:
  - [ ] `src/modules/reports/views/`
  - [ ] `src/modules/reports/stores/`
  - [ ] `src/modules/reports/services/`
  - [ ] `src/modules/data-entry/views/receipts/`
  - [ ] `src/modules/data-entry/components/ocr/`
  - [ ] `src/modules/data-entry/stores/`
  - [ ] `src/modules/data-entry/services/`
  - [ ] `src/shared/components/`
  - [ ] `src/shared/stores/`
  - [ ] `src/shared/styles/`
  - [ ] `src/config/`
  - [ ] `src/router/`
  - [ ] `src/assets/css/`

### Core Configuration Files
- [ ] Create `package.json` (merge dependencies from both apps)
- [ ] Create `vite.config.js` (dual proxy + lazy loading)
- [ ] Create `src/main.js` (PrimeVue setup)
- [ ] Create `.env.example` (environment variables)
- [ ] Create `.gitignore`
- [ ] Create `README.md`

### Copy Shared Resources
- [ ] Copy `shared/frontend/components/` → `src/shared/components/`
- [ ] Copy `shared/frontend/stores/` → `src/shared/stores/`
- [ ] Copy `shared/frontend/styles/` → `src/shared/styles/`
- [ ] Copy `reports-app/frontend/src/assets/css/` → `src/assets/css/`

### Verification
- [ ] Run `npm install` - succeeds
- [ ] Run `npm run dev` - starts on port 3000
- [ ] No console errors

---

## Phase 2: Module Migration (1 day)

### Reports Module - Views
- [ ] Copy `DashboardView.vue` → `src/modules/reports/views/`
- [ ] Copy `InvoicesView.vue` → `src/modules/reports/views/`
- [ ] Copy `BankCashRegisterView.vue` → `src/modules/reports/views/`
- [ ] Copy `TrialBalanceView.vue` → `src/modules/reports/views/`
- [ ] Copy `TelegramView.vue` → `src/modules/reports/views/`
- [ ] Copy `CacheStatsView.vue` → `src/modules/reports/views/`
- [ ] Update imports in all views (if needed)

### Reports Module - Stores
- [ ] Copy `dashboard.js` → `src/modules/reports/stores/`
- [ ] Copy `invoices.js` → `src/modules/reports/stores/`
- [ ] Copy `treasury.js` → `src/modules/reports/stores/`
- [ ] Copy `trialBalance.js` → `src/modules/reports/stores/`
- [ ] Copy `cacheStore.js` → `src/modules/reports/stores/`
- [ ] Update imports in all stores (if needed)

### Reports Module - Services
- [ ] Copy `api.js` → `src/modules/reports/services/` (in root)
- [ ] Update base URL to `/api/reports/` in api.js
- [ ] Test API calls route to localhost:8001

### Data Entry Module - Views
- [ ] Copy `ReceiptsListView.vue` → `src/modules/data-entry/views/receipts/`
- [ ] Copy `ReceiptCreateView.vue` → `src/modules/data-entry/views/receipts/`
- [ ] Update imports in views (if needed)

### Data Entry Module - Components
- [ ] Copy `OCRUploadZone.vue` → `src/modules/data-entry/components/ocr/`
- [ ] Copy `OCRPreview.vue` → `src/modules/data-entry/components/ocr/`
- [ ] Copy `OCRConfidenceIndicator.vue` → `src/modules/data-entry/components/ocr/`
- [ ] Update imports in components (if needed)

### Data Entry Module - Stores
- [ ] Copy `receiptsStore.js` → `src/modules/data-entry/stores/`
- [ ] Update imports in store (if needed)

### Data Entry Module - Services
- [ ] Copy `api.js` → `src/modules/data-entry/services/` (in root)
- [ ] Update base URL to `/api/data-entry/` in api.js
- [ ] Test API calls route to localhost:8003

### CSS Merge
- [ ] Review `data-entry-app/frontend/src/assets/css/main.css`
- [ ] Merge unique styles into `src/assets/css/` (in root)
- [ ] Resolve any style conflicts
- [ ] Test responsive design

### Verification
- [ ] All Reports views render without errors
- [ ] All Data Entry views render without errors
- [ ] No import errors in console
- [ ] CSS loads correctly
- [ ] No style conflicts

---

## Phase 3: Routing & Navigation (0.5 days)

### Router Configuration
- [ ] Create `src/router/index.js` (in root)
- [ ] Add `/login` route (eager loaded)
- [ ] Add `/reports/*` routes (lazy loaded)
- [ ] Add `/data-entry/*` routes (lazy loaded)
- [ ] Add redirect `/` → `/reports/dashboard`
- [ ] Add authentication guard
- [ ] Add 404 handling
- [ ] Test all routes work

### Menu Configuration
- [ ] Create `src/config/menu.js` (in root)
- [ ] Define "Rapoarte" section
- [ ] Define "Introduceri Date" section
- [ ] Define "Sistem" section
- [ ] Export menu configuration

### Feature Flags
- [ ] Create `src/config/features.js` (in root)
- [ ] Add reports.enabled flag
- [ ] Add dataEntry.enabled flag
- [ ] Add module-level flags
- [ ] Export isFeatureEnabled function

### Root Component
- [ ] Create `src/App.vue` (in root)
- [ ] Integrate AppHeader with unified menu
- [ ] Integrate SlideMenu with menu sections
- [ ] Add router-view
- [ ] Add Toast and ConfirmDialog
- [ ] Test menu navigation

### Verification
- [ ] Can navigate to all routes
- [ ] Menu highlights active route
- [ ] Authentication guard works
- [ ] Login redirects to dashboard
- [ ] 404 redirects work

---

## Phase 4: Error Boundaries & Resilience (0.25 days)

### Error Boundary Component
- [ ] Create `src/shared/components/ErrorBoundary.vue` (in root)
- [ ] Implement onErrorCaptured hook
- [ ] Add user-friendly error display
- [ ] Add retry functionality
- [ ] Add navigate away option
- [ ] Test with intentional error

### Module Layouts
- [ ] Create `src/modules/reports/ReportsLayout.vue` (in root)
- [ ] Wrap with ErrorBoundary component
- [ ] Create `src/modules/data-entry/DataEntryLayout.vue` (in root)
- [ ] Wrap with ErrorBoundary component

### Error Isolation Testing
- [ ] Introduce error in Reports module
- [ ] Verify Data Entry still works
- [ ] Introduce error in Data Entry module
- [ ] Verify Reports still works
- [ ] Test retry functionality
- [ ] Test navigate away functionality

### Feature Flags Testing
- [ ] Disable Reports module
- [ ] Verify menu items hidden
- [ ] Disable Data Entry module
- [ ] Verify menu items hidden
- [ ] Re-enable all modules

### Loading States
- [ ] Add loading spinner for lazy routes
- [ ] Test module switching loading
- [ ] Add skeleton screens (optional)

### Verification
- [ ] Error boundary catches component errors
- [ ] User sees friendly error message
- [ ] Can retry or navigate away
- [ ] Module isolation works (error in one doesn't crash other)
- [ ] Feature flags work

---

## Phase 5: Build & Deploy (0.25 days)

### Production Build
- [ ] Run `npm run build`
- [ ] Build succeeds without errors
- [ ] Check `dist/` output
- [ ] Verify chunks created:
  - [ ] vendor-core.[hash].js
  - [ ] vendor-primevue.[hash].js
  - [ ] vendor-utils.[hash].js
  - [ ] reports.[hash].js (lazy)
  - [ ] data-entry.[hash].js (lazy)
  - [ ] main.[hash].js
  - [ ] main.[hash].css

### Bundle Analysis
- [ ] Install `rollup-plugin-visualizer`
- [ ] Analyze bundle sizes
- [ ] Verify total size ≤ sum of current apps
- [ ] Check for duplicate dependencies

### Local Preview
- [ ] Run `npm run preview`
- [ ] Test all routes work
- [ ] Test API calls work
- [ ] Test error boundaries
- [ ] Test lazy loading

### IIS Configuration
- [ ] Create `web.config` (in root) with URL rewrite rules
- [ ] Add SPA routing rule (all → index.html)
- [ ] Add proxy rule: `/api/reports/*` → `http://localhost:8001/api/*`
- [ ] Add proxy rule: `/api/data-entry/*` → `http://localhost:8003/api/*`
- [ ] Add proxy rule: `/uploads/*` → `http://localhost:8003/uploads/*`

### Staging Deployment
- [ ] Deploy to staging IIS site
- [ ] Test all routes
- [ ] Test API calls
- [ ] Test error boundaries
- [ ] Test on different browsers
- [ ] Test on mobile devices

### Production Deployment
- [ ] Backup current IIS configuration
- [ ] Backup current builds
- [ ] Deploy unified app
- [ ] Test all routes
- [ ] Test API calls
- [ ] Monitor error logs

### Verification
- [ ] Build succeeds
- [ ] Chunks split correctly
- [ ] IIS deployment works
- [ ] API routing correct
- [ ] All features work in production

---

## Testing Checklist

### Manual Testing
- [ ] Login flow works
- [ ] Navigate to all Reports views
- [ ] Navigate to all Data Entry views
- [ ] Switch between modules
- [ ] Test company selector
- [ ] Test period selector
- [ ] Test logout
- [ ] Test on mobile (375px)
- [ ] Test on tablet (768px)
- [ ] Test on desktop (1920px)

### E2E Tests
- [ ] Create `tests/e2e/login.spec.js` (in root)
- [ ] Create `tests/e2e/reports-navigation.spec.js` (in root)
- [ ] Create `tests/e2e/data-entry-navigation.spec.js` (in root)
- [ ] Create `tests/e2e/module-switching.spec.js` (in root)
- [ ] Create `tests/e2e/error-isolation.spec.js` (in root)
- [ ] Run all E2E tests - pass

### Performance Testing
- [ ] Run Lighthouse audit
- [ ] Performance score ≥ 90
- [ ] Initial load < 2 seconds
- [ ] Module switching < 500ms (cached)

---

## Post-Implementation Checklist

### Documentation Updates
- [ ] Update `CLAUDE.md` - Architecture section
- [ ] Update `CLAUDE.md` - Deployment section
- [ ] Update `README.md` - Quick start
- [ ] Update `README.md` - URL structure
- [ ] Update `DEPLOYMENT_GUIDE.md` - IIS configuration
- [ ] Update `docs/ARCHITECTURE_SCHEMA.md` - Diagrams
- [ ] Update `deployment/windows/README.md` - Deployment steps

### Cleanup (After 1 Week)
- [ ] Archive `reports-app/frontend/` → `reports-app/frontend-archived/`
- [ ] Archive `data-entry-app/frontend/` → `data-entry-app/frontend-archived/`
- [ ] Update `start-test.sh` to use root directory
- [ ] Update `start-data-entry.sh` to use root directory
- [ ] Update CI/CD pipelines (if any)
- [ ] Document migration in CHANGELOG.md

### Monitoring (First Week)
- [ ] Day 1: Review error logs
- [ ] Day 2: Review error logs
- [ ] Day 3: Review error logs
- [ ] Day 4: Review error logs
- [ ] Day 5: Review error logs
- [ ] Day 6: Review error logs
- [ ] Day 7: Review error logs + user feedback

### Optimization (First Month)
- [ ] Week 2: Analyze bundle sizes
- [ ] Week 2: Optimize images/assets
- [ ] Week 3: Consider further code splitting
- [ ] Week 3: Add performance monitoring
- [ ] Week 4: Evaluate feature flag usage
- [ ] Week 4: Plan next improvements

---

## Common Issues & Solutions

### Issue: CSS Conflicts
**Solution**: Use CSS modules, check `docs/CSS_PATTERNS.md`

### Issue: Import Errors
**Solution**: Update import paths, check alias configuration in vite.config.js

### Issue: API Calls Failing
**Solution**: Verify proxy configuration, check backend is running

### Issue: Error Boundary Not Catching
**Solution**: Check onErrorCaptured implementation, add global error handler

### Issue: Large Bundle Size
**Solution**: Review manualChunks, enable tree shaking, lazy load more

### Issue: IIS Routing Not Working
**Solution**: Check web.config URL rewrite rules, verify IIS URL Rewrite module installed

### Issue: Store Contamination
**Solution**: Use module-scoped stores, check for global state

### Issue: PrimeVue Theme Conflicts
**Solution**: Use single theme (saga-blue), override in vendor CSS

---

## Progress Tracking

**Phase 1: Setup**
- Started: ___________
- Completed: ___________
- Time Spent: ___________ hours

**Phase 2: Migration**
- Started: ___________
- Completed: ___________
- Time Spent: ___________ hours

**Phase 3: Routing**
- Started: ___________
- Completed: ___________
- Time Spent: ___________ hours

**Phase 4: Error Boundaries**
- Started: ___________
- Completed: ___________
- Time Spent: ___________ hours

**Phase 5: Build & Deploy**
- Started: ___________
- Completed: ___________
- Time Spent: ___________ hours

**Total Time**: ___________ hours (Estimated: 20 hours)

---

## Success Metrics

### Deployment
- [ ] Single IIS site running (not 2)
- [ ] Single build process (not 2)
- [ ] Zero downtime during deployment

### Performance
- [ ] Initial load < 2 seconds
- [ ] Module switching < 500ms
- [ ] Lighthouse score ≥ 90
- [ ] Bundle size ≤ sum of old apps

### Quality
- [ ] 100% feature parity
- [ ] All E2E tests passing
- [ ] Zero user-reported bugs (first week)
- [ ] Error isolation verified

---

**Status**: ⬜ Not Started | 🔵 In Progress | ✅ Complete

**Last Updated**: ___________
**Completed By**: ___________
**Production Deploy Date**: ___________