init

tasks/podcast-tui-app/08-player.md

@@ -0,0 +1,63 @@
+# 08. Build Discover Feed with Popular Shows
+
+meta:
+  id: podcast-tui-app-08
+  feature: podcast-tui-app
+  priority: P1
+  depends_on: [07]
+  tags: [discover, popular-shows, solidjs, opentui]
+
+objective:
+- Create popular shows data structure
+- Build discover page component
+- Display trending shows with categories
+- Implement category filtering
+
+deliverables:
+- `src/data/popular-shows.ts` with trending shows data
+- `src/components/DiscoverPage.tsx` with discover UI
+- `src/components/CategoryFilter.tsx` with category buttons
+
+steps:
+- Create `src/data/popular-shows.ts`:
+  - Array of popular podcasts with metadata
+  - Categories: Technology, Business, Science, Entertainment
+  - Reverse chronological ordering (newest first)
+  - Include feed URLs and descriptions
+- Create `src/components/DiscoverPage.tsx`:
+  - Title header
+  - Category filter buttons
+  - Grid/list display of popular shows
+  - Show details on selection
+  - Add to feed button
+- Create `src/components/CategoryFilter.tsx`:
+  - Category button group
+  - Active category highlighting
+  - Filter logic implementation
+- Add discover page to "Discover" navigation tab
+
+tests:
+- Unit: Test popular shows data structure
+- Unit: Test category filtering
+- Integration: Test discover page displays correctly
+- Integration: Test add to feed functionality
+
+acceptance_criteria:
+- Discover page displays popular shows
+- Category filtering works correctly
+- Shows are ordered reverse chronologically
+- Clicking a show shows details
+- Add to feed button works
+
+validation:
+- Run application and navigate to "Discover"
+- Verify popular shows appear
+- Click different categories
+- Click a show and verify details
+- Try add to feed
+
+notes:
+- Popular shows data can be static or fetched from sources
+- If sources don't provide trending, use curated list
+- Categories help users find shows by topic
+- Use Flexbox for category filter layout