How hajra-khattak/taskflow-ai works
TaskFlow AI is a React task-and-habit planner. A signed-in user works through the protected dashboard: task and habit screens use hooks to subscribe to user-scoped data and send changes to Firebase; dashboard views also expose search, statistics, streaks, and AI task breakdown. The README documents Firestore live updates, date and streak behavior, and the serverless Gemini flow. Edges rely on the shown entry point, excerpts, indexed references, or README; unsampled implementation details are not inferred.
Main entry points: DashboardLayout.jsx Dashboard shell · useTasks.js Task hook · main.jsx App router · HabitsPage.jsx Habits page
Components 24
App and identity
- App router
src/main.jsx - Sign-in pages
src/pages/Login/Login.jsx - Auth context
src/context/AuthContext.jsx
Task planning
- Dashboard shell
src/pages/Dashboard/DashboardLayout.jsx - Tasks page
src/pages/Dashboard/TasksPage.jsx - Task board
src/components/Dashboard/TaskBoard.jsx - Task hook
src/hooks/useTasks.js - AI breakdown dialog
src/components/Dashboard/AiBreakdownModal.jsx
Habits and streaks
- Habits page
src/pages/Dashboard/HabitsPage.jsx - Weekly habit grid
src/components/Dashboard/WeeklyHabits.jsx - Habit hook
src/hooks/useHabits.js - Activity heatmap
src/components/Dashboard/ActivityStreak.jsx
Search and insights
- Stats views
src/pages/Dashboard/StatsPage.jsx - Stats calculations
src/utils/stats.js - Global search
src/pages/Dashboard/SearchPage.jsx
Data and preferences
- User collection hook
src/hooks/useUserCollection.js - Task service
src/services/taskService.js - Cloud Firestore
- Habit service
src/services/habitService.js - AI client service
src/services/aiService.js - Breakdown endpoint
api/breakdown.js - Theme and timezone
src/context/TimeZoneContext.jsx
Other components
- User
- Gemini API
Connections 27
- User → App router: uses app
- App router → Sign-in pages: routes to
src/main.jsx - App router → Dashboard shell: routes to
src/main.jsx - Sign-in pages → Auth context: authenticates with
src/pages/Login/Login.jsx - Dashboard shell → Task hook: uses
src/pages/Dashboard/DashboardLayout.jsx - Tasks page → Task board: renders
src/pages/Dashboard/TasksPage.jsx - Task board → Task hook: changes tasks through
- Task hook → User collection hook: subscribes through
src/hooks/useTasks.js - Task hook → Task service: calls
src/hooks/useTasks.js - User collection hook → Auth context: gets user from
src/hooks/useUserCollection.js - Task service → Cloud Firestore: reads and writes
src/services/taskService.js - Dashboard shell → Habits page: hosts
- Habits page → Weekly habit grid: renders
src/pages/Dashboard/HabitsPage.jsx - Habits page → Habit hook: uses
- Habit hook → User collection hook: subscribes through
src/hooks/useHabits.js - Habit hook → Habit service: calls
src/hooks/useHabits.js - Habit service → Cloud Firestore: reads and writes
src/services/habitService.js - Dashboard shell → Activity heatmap: renders
- Dashboard shell → Stats views: hosts
- Stats views → Stats calculations: calculates with
- Dashboard shell → Global search: hosts
- Tasks page → AI breakdown dialog: opens via dashboard
- AI breakdown dialog → AI client service: requests breakdown
- AI client service → Breakdown endpoint: posts task text and token
- Breakdown endpoint → Gemini API: requests suggestions
- Dashboard shell → Theme and timezone: uses timezone
src/pages/Dashboard/DashboardLayout.jsx - Theme and timezone → User: sets calendar zone