"Luna" is a clean, intuitive application for organizing tasks, tracking the time spent on each, and analyzing your productivity.
Perfect for those who value focus, structure, and results.
Always visible — no need to open a calendar to check what day it is.
Modal window with input:
- Character limit enforcement
- Real-time character counter
- Validation and warning messages if the limit is exceeded
Modal window with:
- Pre-filled task name
- Character counter
- Option to save updates
Confirmation modal to prevent accidental mass deletion.
- A detailed table showing:
- Creation date
- Stop date
- Resume date
- Completion date
- Task name
- Status
Clicking any row opens a context menu with actions (varies by status).
- Tasks "In Progress" have a green background
- Deleted tasks have a grey background
Powerful, flexible filtering system:
- By status: created, in progress, resumed, paused, completed, deleted
- By date range: from / to, with modal warning if the range is invalid
- By name: case-insensitive search
🔄 Filters can be applied independently or combined. Each filter can be reset separately or all at once.
When a task is marked as In Progress or Resumed, all other interactions are disabled to encourage deep focus until the task is completed.
For each task you can view:
- Name
- Status
- Start and end time
- Number of work sessions
- Total time spent
- Average time per session
📌 Clicking the analytics button automatically scrolls to the task table
Shows stats for all tasks:
- Count per status
- Table view of filtered tasks
- Custom date range supported
🔝 Back-to-top button
📱 Mobile/tablet modals for:
- task creation / deletion
- filters
- analytics navigation
All tasks and filters are saved to localStorage
- React
- Redux Toolkit — app logic
- Redux Persist — state persistence
- React Responsive — adaptive layout
- Formik — form management
- Yup — form validation
- React Icons — icon library
- Clone the repository:
git clone https://github.com/sofi-dobriak/luna-todo-manager.git
- Navigate to the project folder:
cd luna-todo-manager - Install dependencies:
npm install
- Start the development server:
npm run dev
- Open in your browser:
http://localhost:5173
👩💻 Author: Sofi Dobriak