← Back to Projects
TaskFlow

TaskFlow

A proactive task and productivity manager with calendar scheduling, an AI project coach, and visual workload insights.

A smart task management web app designed to turn daily task lists into clear productivity insights. Features include flexible list and calendar views, automated repeating habits, an AI planning coach to decompose large projects, and an integrated Pomodoro focus timer with automated time logs.

Live SiteGitHub
ReactTypeScriptTailwind CSSTanStack QueryAxiosRechartsPythonFlaskSQLAlchemy 2.0JWT

Core Problem Solved

Standard to-do lists quickly turn into overwhelming backlogs. They do not help you decide what to do first, they do not break down complex projects into easy steps, and they do not show you where your time actually went.

Why I Built This

Created to combine practical task scheduling, time tracking, and AI assistance into a single dashboard that actively helps you complete work rather than just listing it.

Features

  • •Dual List & Calendar Views: Switch between a straightforward to-do list and a detailed monthly calendar view.
  • •Repeating Habits: Build consistent routines with tasks that repeat daily, weekly, or monthly. Skip or reschedule individual occurrences to keep your habits flexible and your schedule under control.
  • •AI Morning Brief: An AI assistant reviews pending and overdue items each morning to recommend a sensible, prioritised schedule.
  • •AI Task Decomposition: Break down daunting tasks into smaller, manageable step-by-step checklists at the click of a button.
  • •Natural Language Quick-Add: Type tasks naturally (e.g. 'Review proposal tomorrow at 3pm') to populate dates and priorities instantly.
  • •Integrated Pomodoro Timer: Run focused work intervals and have time automatically recorded against your active tasks.
  • •Workload Insights & Activity Map: Interactive Recharts graphs show weekly category breakdowns (Work, Study, Personal) and long-term habits.

Architecture

Frontend: • React and TypeScript Single-Page Application (SPA) designed for rapid interaction. • TanStack Query manages API data fetching, optimistic UI updates, and intelligent caching. • Axios network client configured with interceptors for seamless JWT authentication. • Recharts for animated, responsive charts of weekly workload and time logs. Backend: • Python and Flask API structured with the Application Factory pattern. • SQLAlchemy 2.0 for relational task schemas, habit frequencies, and session logs. • Secure JWT session management via HTTP-only cookies.

Database Modelling

Schema for TaskFlow

Challenges

  • •Implementing Ghost Tasks vs Batch Generation: Needed a way to show recurring tasks on future calendar days without flooding the database with hundreds of redundant rows. Implemented a dynamic 'ghost task' algorithm that computes projected occurrences on the fly. This kept the database clean and made editing the master schedule straightforward, while requiring thoughtful rendering logic on the calendar.

Tradeoffs and Decisions

Chose TanStack Query with Axios over Redux Toolkit because it delivers server-state caching, automatic refetching, and error handling out of the box with far less boilerplate code. Axios interceptors also made token refresh handling straightforward for JWT authentication.

Impact

Actively used to identify recurring bottlenecks, eliminate procrastinated items by breaking them down with the AI decomposition tool, and maintain consistent daily focus.