forked from trent_larson/crowd-funder-for-time-pwa
Add mandatory Pre-Migration Feature Audit to Enhanced Triple Migration Pattern
- Create systematic audit template with line-by-line feature documentation - Update migration checklist with mandatory audit as Step 0 - Complete example audit for GiftedPrompts.vue (15-20 min, Simple complexity) - Ensure no functionality is lost during migrations - Provide verification checklist for post-migration testing
This commit is contained in:
@@ -84,12 +84,20 @@ git commit -m "[user-approved-message]"
|
||||
|
||||
## Pre-Migration Assessment
|
||||
|
||||
### [ ] 0. Start Time Tracking
|
||||
### [ ] 0. Pre-Migration Feature Audit
|
||||
- [ ] **MANDATORY**: Create detailed feature audit using `docs/migration-templates/PRE_MIGRATION_AUDIT_TEMPLATE.md`
|
||||
- [ ] Document all database operations with line numbers
|
||||
- [ ] Document all notification patterns with line numbers
|
||||
- [ ] Document all template complexity patterns with line numbers
|
||||
- [ ] Create verification checklist for post-migration testing
|
||||
- [ ] Assess migration complexity and time requirements
|
||||
|
||||
### [ ] 1. Start Time Tracking
|
||||
- [ ] **MANDATORY**: Run `./scripts/time-migration.sh [ComponentName.vue] start`
|
||||
- [ ] Record start time in terminal output
|
||||
- [ ] Keep terminal open for entire migration process
|
||||
|
||||
### [ ] 1. Component Complexity Assessment
|
||||
### [ ] 2. Component Complexity Assessment
|
||||
- [ ] **Simple** (15-20 min): Dialog components, minimal DB operations, few notifications
|
||||
- [ ] **Medium** (30-45 min): Standard views, moderate DB usage, multiple notifications
|
||||
- [ ] **Complex** (45-60 min): Large views, extensive DB operations, many notifications
|
||||
@@ -100,7 +108,7 @@ git commit -m "[user-approved-message]"
|
||||
- [ ] Use time log to track project progress
|
||||
- [ ] Use historical time durations to improve estimates
|
||||
|
||||
### [ ] 2. Identify Legacy Patterns
|
||||
### [ ] 3. Identify Legacy Patterns
|
||||
- [ ] Count `databaseUtil` imports and calls
|
||||
- [ ] Count raw SQL queries (`SELECT`, `INSERT`, `UPDATE`, `DELETE`)
|
||||
- [ ] Count `$notify()` calls
|
||||
@@ -108,32 +116,32 @@ git commit -m "[user-approved-message]"
|
||||
- [ ] Identify template complexity patterns (repeated expressions, long class strings)
|
||||
- [ ] Document total issues found
|
||||
|
||||
### [ ] 3. Verify PlatformServiceMixin Setup
|
||||
### [ ] 4. Verify PlatformServiceMixin Setup
|
||||
- [ ] Component already imports `PlatformServiceMixin`
|
||||
- [ ] Component already has `mixins: [PlatformServiceMixin]`
|
||||
- [ ] If missing, add mixin first
|
||||
|
||||
## Phase 1: Database Migration
|
||||
|
||||
### [ ] 4. Replace Database Utility Calls
|
||||
### [ ] 5. Replace Database Utility Calls
|
||||
- [ ] Remove `import * as databaseUtil from "../db/databaseUtil"`
|
||||
- [ ] Replace `databaseUtil.retrieveSettingsForActiveAccount()` → `this.$accountSettings()`
|
||||
- [ ] Replace `databaseUtil.mapQueryResultToValues()` → `this.$mapQueryResultToValues()`
|
||||
- [ ] Replace other `databaseUtil.*` calls with mixin equivalents
|
||||
|
||||
### [ ] 5. Replace Logging Calls
|
||||
### [ ] 6. Replace Logging Calls
|
||||
- [ ] Remove `import { logConsoleAndDb } from "../db/index"`
|
||||
- [ ] Replace `logConsoleAndDb()` → `this.$logAndConsole()`
|
||||
|
||||
## Phase 2: SQL Abstraction Migration
|
||||
|
||||
### [ ] 6. Replace Raw Contact Operations
|
||||
### [ ] 7. Replace Raw Contact Operations
|
||||
- [ ] `SELECT * FROM contacts WHERE did = ?` → `this.$getContact(did)`
|
||||
- [ ] `DELETE FROM contacts WHERE did = ?` → `this.$deleteContact(did)`
|
||||
- [ ] `UPDATE contacts SET x = ? WHERE did = ?` → `this.$updateContact(did, changes)`
|
||||
- [ ] `INSERT INTO contacts` → `this.$insertContact(contact)`
|
||||
|
||||
### [ ] 7. Replace Other Raw SQL
|
||||
### [ ] 8. Replace Other Raw SQL
|
||||
- [ ] `SELECT * FROM settings` → `this.$accountSettings()`
|
||||
- [ ] `UPDATE settings` → `this.$saveSettings(changes)`
|
||||
- [ ] Generic queries → appropriate service methods
|
||||
@@ -141,14 +149,14 @@ git commit -m "[user-approved-message]"
|
||||
|
||||
## Phase 2.5: Contact Method Standardization
|
||||
|
||||
### [ ] 8. Standardize Contact Fetching Methods
|
||||
### [ ] 9. Standardize Contact Fetching Methods
|
||||
- [ ] **CRITICAL**: Replace `this.$getAllContacts()` → `this.$contacts()`
|
||||
- [ ] **REASON**: Eliminate inconsistent contact fetching patterns
|
||||
- [ ] **BENEFIT**: All components use same contact data source
|
||||
- [ ] **VALIDATION**: Search for `$getAllContacts` and replace with `$contacts`
|
||||
- [ ] **CONSISTENCY**: All contact operations use unified approach
|
||||
|
||||
### [ ] 9. Verify Contact Method Consistency
|
||||
### [ ] 10. Verify Contact Method Consistency
|
||||
- [ ] **NO** `$getAllContacts()` calls remain in component
|
||||
- [ ] **ALL** contact fetching uses `$contacts()` method
|
||||
- [ ] **CONSISTENT** contact data across component lifecycle
|
||||
@@ -156,18 +164,18 @@ git commit -m "[user-approved-message]"
|
||||
|
||||
## Phase 3: Notification Migration
|
||||
|
||||
### [ ] 10. Add Notification Infrastructure
|
||||
### [ ] 11. Add Notification Infrastructure
|
||||
- [ ] Add import: `import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify"`
|
||||
- [ ] Add property: `notify!: ReturnType<typeof createNotifyHelpers>;`
|
||||
- [ ] Add initialization: `created() { this.notify = createNotifyHelpers(this.$notify); }`
|
||||
|
||||
### [ ] 11. Add Notification Constants to Central File
|
||||
### [ ] 12. Add Notification Constants to Central File
|
||||
- [ ] **CRITICAL**: Add constants to `src/constants/notifications.ts` (NOT local constants)
|
||||
- [ ] Use naming pattern: `NOTIFY_[COMPONENT]_[ACTION]` (e.g., `NOTIFY_OFFER_SETTINGS_ERROR`)
|
||||
- [ ] Import constants: `import { NOTIFY_X, NOTIFY_Y } from "@/constants/notifications"`
|
||||
- [ ] **NO LOCAL CONSTANTS**: All notification text must be centralized
|
||||
|
||||
### [ ] 12. Replace Notification Calls
|
||||
### [ ] 13. Replace Notification Calls
|
||||
- [ ] **Warning**: `this.$notify({type: "warning"})` → `this.notify.warning(CONSTANT.message, TIMEOUTS.LONG)`
|
||||
- [ ] **Error**: `this.$notify({type: "danger"})` → `this.notify.error(CONSTANT.message, TIMEOUTS.LONG)`
|
||||
- [ ] **Success**: `this.$notify({type: "success"})` → `this.notify.success(CONSTANT.message, TIMEOUTS.STANDARD)`
|
||||
@@ -175,7 +183,7 @@ git commit -m "[user-approved-message]"
|
||||
- [ ] **Confirm**: `this.$notify({type: "confirm"})` → `this.notify.confirm(message, onYes)`
|
||||
- [ ] **Standard patterns**: Use `this.notify.confirmationSubmitted()`, `this.notify.sent()`, etc.
|
||||
|
||||
### [ ] 13. Constants vs Literal Strings
|
||||
### [ ] 14. Constants vs Literal Strings
|
||||
- [ ] **Use constants** for static, reusable messages
|
||||
- [ ] **Use literal strings** for dynamic messages with variables
|
||||
- [ ] **Extract literals from complex modals** - Even raw `$notify` calls should use constants for text
|
||||
@@ -183,19 +191,19 @@ git commit -m "[user-approved-message]"
|
||||
|
||||
## Phase 4: Template Streamlining
|
||||
|
||||
### [ ] 14. Identify Template Complexity Patterns
|
||||
### [ ] 15. Identify Template Complexity Patterns
|
||||
- [ ] **Repeated CSS Classes**: Long Tailwind strings used multiple times
|
||||
- [ ] **Complex Configuration Objects**: Multi-line objects in template
|
||||
- [ ] **Repeated Function Calls**: Same logic executed multiple times
|
||||
- [ ] **Complex Conditional Logic**: Nested ternary or complex boolean expressions
|
||||
|
||||
### [ ] 15. Extract to Computed Properties
|
||||
### [ ] 16. Extract to Computed Properties
|
||||
- [ ] **CSS Class Groups**: Extract repeated styling to computed properties
|
||||
- [ ] **Configuration Objects**: Move router configs, form configs to computed
|
||||
- [ ] **Conditional Logic**: Extract complex `v-if` conditions to computed properties
|
||||
- [ ] **Dynamic Values**: Convert repeated calculations to cached computed properties
|
||||
|
||||
### [ ] 16. Document Computed Properties
|
||||
### [ ] 17. Document Computed Properties
|
||||
- [ ] **JSDoc Comments**: Add comprehensive comments for all computed properties
|
||||
- [ ] **Purpose Documentation**: Explain what template complexity each property solves
|
||||
- [ ] **Organized Sections**: Group related computed properties with section headers
|
||||
@@ -249,6 +257,7 @@ git commit -m "[user-approved-message]"
|
||||
- [ ] **MANDATORY**: Run `./scripts/time-migration.sh [ComponentName.vue] end`
|
||||
- [ ] Record total duration from terminal output
|
||||
- [ ] Note any blockers or issues that impacted timing
|
||||
- [ ] **MANDATORY**: Verify all features from pre-migration audit are working
|
||||
|
||||
### [ ] 24. Commit with Time Data
|
||||
- [ ] **MANDATORY**: Include time data in commit message
|
||||
|
||||
159
docs/migration-templates/PRE_MIGRATION_AUDIT_TEMPLATE.md
Normal file
159
docs/migration-templates/PRE_MIGRATION_AUDIT_TEMPLATE.md
Normal file
@@ -0,0 +1,159 @@
|
||||
# Pre-Migration Feature Audit Template
|
||||
|
||||
## Overview
|
||||
This template provides a systematic approach to audit all features in a component before migration to ensure no functionality is lost and provide a verification checklist.
|
||||
|
||||
## Component Information
|
||||
- **Component Name**: [ComponentName.vue]
|
||||
- **Location**: [src/path/to/Component.vue]
|
||||
- **Total Lines**: [XXX lines]
|
||||
- **Audit Date**: [YYYY-MM-DD]
|
||||
- **Auditor**: Matthew Raymer
|
||||
|
||||
## 📊 Migration Scope Analysis
|
||||
|
||||
### Database Operations Audit
|
||||
- [ ] **Total Database Operations**: [X operations]
|
||||
- [ ] **Legacy databaseUtil imports**: [X imports]
|
||||
- [ ] **PlatformServiceFactory calls**: [X calls]
|
||||
- [ ] **Raw SQL queries**: [X queries]
|
||||
|
||||
### Notification Operations Audit
|
||||
- [ ] **Total Notification Calls**: [X calls]
|
||||
- [ ] **Direct $notify calls**: [X calls]
|
||||
- [ ] **Legacy notification patterns**: [X patterns]
|
||||
|
||||
### Template Complexity Audit
|
||||
- [ ] **Complex template expressions**: [X expressions]
|
||||
- [ ] **Repeated CSS classes**: [X repetitions]
|
||||
- [ ] **Configuration objects**: [X objects]
|
||||
|
||||
## 🔍 Feature-by-Feature Audit
|
||||
|
||||
### 1. Database Features
|
||||
|
||||
#### Feature: [Feature Name]
|
||||
- **Location**: Lines [XXX-XXX]
|
||||
- **Type**: [SELECT/INSERT/UPDATE/DELETE/COUNT/etc.]
|
||||
- **Current Implementation**:
|
||||
```typescript
|
||||
// Current code snippet
|
||||
```
|
||||
- **Migration Target**: `this.$methodName()`
|
||||
- **Verification**: [ ] Functionality preserved after migration
|
||||
|
||||
#### Feature: [Feature Name]
|
||||
- **Location**: Lines [XXX-XXX]
|
||||
- **Type**: [Type]
|
||||
- **Current Implementation**:
|
||||
```typescript
|
||||
// Current code snippet
|
||||
```
|
||||
- **Migration Target**: `this.$methodName()`
|
||||
- **Verification**: [ ] Functionality preserved after migration
|
||||
|
||||
### 2. Notification Features
|
||||
|
||||
#### Feature: [Feature Name]
|
||||
- **Location**: Lines [XXX-XXX]
|
||||
- **Type**: [success/error/warning/info/toast/confirm]
|
||||
- **Current Implementation**:
|
||||
```typescript
|
||||
// Current code snippet
|
||||
```
|
||||
- **Migration Target**: `this.notify.methodName()`
|
||||
- **Verification**: [ ] Functionality preserved after migration
|
||||
|
||||
### 3. Template Features
|
||||
|
||||
#### Feature: [Feature Name]
|
||||
- **Location**: Lines [XXX-XXX]
|
||||
- **Type**: [computed/method/expression/class]
|
||||
- **Current Implementation**:
|
||||
```vue
|
||||
<!-- Current template snippet -->
|
||||
```
|
||||
- **Migration Target**: Extract to computed property/method
|
||||
- **Verification**: [ ] Functionality preserved after migration
|
||||
|
||||
## 🎯 Migration Checklist Totals
|
||||
|
||||
### Database Migration Requirements
|
||||
- [ ] **Replace databaseUtil imports**: [X imports] → PlatformServiceMixin
|
||||
- [ ] **Replace PlatformServiceFactory calls**: [X calls] → mixin methods
|
||||
- [ ] **Replace raw SQL queries**: [X queries] → service methods
|
||||
- [ ] **Update error handling**: [X patterns] → mixin error handling
|
||||
|
||||
### Notification Migration Requirements
|
||||
- [ ] **Add notification helpers**: Import createNotifyHelpers
|
||||
- [ ] **Replace direct $notify calls**: [X calls] → helper methods
|
||||
- [ ] **Add notification constants**: [X constants] → src/constants/notifications.ts
|
||||
- [ ] **Update notification patterns**: [X patterns] → standardized helpers
|
||||
|
||||
### Template Streamlining Requirements
|
||||
- [ ] **Extract repeated classes**: [X repetitions] → computed properties
|
||||
- [ ] **Extract complex expressions**: [X expressions] → computed properties
|
||||
- [ ] **Extract configuration objects**: [X objects] → computed properties
|
||||
- [ ] **Simplify template logic**: [X patterns] → methods/computed
|
||||
|
||||
## 📋 Post-Migration Verification Checklist
|
||||
|
||||
### ✅ Database Functionality Verification
|
||||
- [ ] All database operations work correctly
|
||||
- [ ] Error handling functions properly
|
||||
- [ ] Performance is maintained or improved
|
||||
- [ ] Data integrity is preserved
|
||||
|
||||
### ✅ Notification Functionality Verification
|
||||
- [ ] All notification types display correctly
|
||||
- [ ] Notification timing works as expected
|
||||
- [ ] User feedback is appropriate
|
||||
- [ ] Error notifications are informative
|
||||
|
||||
### ✅ Template Functionality Verification
|
||||
- [ ] All UI elements render correctly
|
||||
- [ ] Interactive elements function properly
|
||||
- [ ] Responsive design is maintained
|
||||
- [ ] Accessibility is preserved
|
||||
|
||||
### ✅ Integration Verification
|
||||
- [ ] Component integrates properly with parent components
|
||||
- [ ] Router navigation works correctly
|
||||
- [ ] Props and events function as expected
|
||||
- [ ] Cross-platform compatibility maintained
|
||||
|
||||
## 🚀 Migration Readiness Assessment
|
||||
|
||||
### Pre-Migration Requirements
|
||||
- [ ] **Feature audit completed**: All features documented with line numbers
|
||||
- [ ] **Migration targets identified**: Each feature has clear migration path
|
||||
- [ ] **Test scenarios planned**: Verification steps documented
|
||||
- [ ] **Backup created**: Original component backed up
|
||||
|
||||
### Complexity Assessment
|
||||
- [ ] **Simple** (15-20 min): Few database operations, minimal notifications
|
||||
- [ ] **Medium** (30-45 min): Multiple database operations, several notifications
|
||||
- [ ] **Complex** (45-60 min): Extensive database usage, many notifications, complex templates
|
||||
|
||||
### Dependencies Assessment
|
||||
- [ ] **No blocking dependencies**: Component can be migrated independently
|
||||
- [ ] **Parent dependencies identified**: Known impacts on parent components
|
||||
- [ ] **Child dependencies identified**: Known impacts on child components
|
||||
|
||||
## 📝 Notes and Special Considerations
|
||||
|
||||
### Special Migration Considerations
|
||||
[Document any unusual patterns, complex logic, or special requirements]
|
||||
|
||||
### Risk Assessment
|
||||
[Document any potential risks or challenges for this migration]
|
||||
|
||||
### Testing Strategy
|
||||
[Document specific testing approach for this component]
|
||||
|
||||
---
|
||||
|
||||
**Template Version**: 1.0
|
||||
**Created**: 2025-01-08
|
||||
**Author**: Matthew Raymer
|
||||
**Status**: Ready for use
|
||||
Reference in New Issue
Block a user