PodTui/tasks/podcast-tui-app/03-file-sync.md

03. Implement Direct File Sync (JSON/XML Import/Export)

meta: id: podcast-tui-app-03 feature: podcast-tui-app priority: P1 depends_on: [02] tags: [file-sync, json, xml, import-export, solidjs]

objective:

• Create data models for JSON and XML sync formats
• Implement import functionality to load feeds and settings from files
• Implement export functionality to save feeds and settings to files
• Add file picker UI for selecting files

deliverables:

• src/types/sync.ts with sync data models
• src/utils/sync.ts with import/export functions
• src/components/SyncPanel.tsx with sync UI
• File picker component for file selection

steps:

• Create src/types/sync.ts with data models:
  • SyncData interface for JSON format
  • SyncDataXML interface for XML format
  • Include fields: feeds, sources, settings, preferences
• Create src/utils/sync.ts with functions:
  • exportToJSON(data: SyncData): string
  • importFromJSON(json: string): SyncData
  • exportToXML(data: SyncDataXML): string
  • importFromXML(xml: string): SyncDataXML
  • Handle validation and error checking
• Create src/components/SyncPanel.tsx with:
  • Import button
  • Export button
  • File picker UI using <input> component
  • Sync status indicator
• Add sync functionality to Settings screen

tests:

• Unit: Test JSON import/export with sample data
• Unit: Test XML import/export with sample data
• Integration: Test file picker selects correct files
• Integration: Test sync panel buttons work correctly

acceptance_criteria:

• Export creates valid JSON file with all data
• Export creates valid XML file with all data
• Import loads data from JSON file
• Import loads data from XML file
• File picker allows selecting files from disk

validation:

• Run bun run src/index.tsx
• Go to Settings > Sync
• Click Export, verify file created
• Click Import, select file, verify data loaded
• Test with both JSON and XML formats

notes:

• JSON format: Simple, human-readable
• XML format: More structured, better for complex data
• Use FileReader API for file operations
• Handle file not found and invalid format errors