feat: add email reminder system

Backend changes:
- Add reminder_sent field to Todo model
- Create email service with Gmail SMTP support
- Create reminder service with hourly scheduler
- Integrate APScheduler in FastAPI lifespan
- Add Gmail configuration to settings
- Update todo API to return reminder_sent
- Create database migration for reminder_sent column

Frontend changes:
- Show reminder info in CreateTodoModal
- Add reminder indicator (🔔) in TodoList
- Add reminder_sent to Todo type interface

Features:
- Sends reminder emails 1 day before due date
- Includes full task details (title, description, due date, priority, tags)
- Uses Gmail SMTP for email delivery
- Runs hourly checks via APScheduler
- Tracks sent reminders to avoid duplicates

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

EMAIL-REMINDERS-GUIDE.md

@@ -0,0 +1,358 @@
+# 📧 Email Reminder System - Setup Guide
+
+## ✅ Feature Complete!
+
+Email reminders have been successfully added to your Todo App. Here's how to set them up.
+
+---
+
+## 🎯 What This Feature Does
+
+- **Automatically sends reminder emails** to users 1 day before their task's due date
+- **Sends to user's login email** (the email they used to sign up)
+- **Only for tasks with due dates** set
+- **Includes full task details** in the email:
+  - Task title
+  - Task description
+  - Due date and time
+  - Priority level (High/Medium/Low)
+  - Tags
+  - Time remaining
+
+---
+
+## 📧 How to Setup Gmail SMTP
+
+### Step 1: Enable 2-Step Verification
+
+1. Go to https://myaccount.google.com/security
+2. Find "2-Step Verification" and enable it (if not already enabled)
+3. Follow the prompts to set it up
+
+### Step 2: Generate App Password
+
+1. On the same security page, search for "App Passwords"
+2. Click on it (you may need to sign in again)
+3. Select:
+   - **App**: Select "Mail"
+   - **Device**: Select "Other (Custom name)"
+4. Enter "Todo App" as the name
+5. Click **Generate**
+6. **Copy the 16-character password** (it will look like: `abcd efgh ijkl mnop`)
+7. **Save it securely** - you won't see it again!
+
+### Step 3: Add to Backend Environment Variables
+
+**For Local Development:**
+
+Edit `backend/.env` and add:
+```bash
+GMAIL_EMAIL=your-email@gmail.com
+GMAIL_APP_PASSWORD=your-16-char-app-password
+```
+
+**For Hugging Face Space (Production):**
+
+Add these secrets via Hugging Face API or web UI:
+```bash
+# Via Hugging Face CLI
+huggingface-cli login
+# Then add secrets via web UI at:
+# https://huggingface.co/spaces/ammaraak/todo-app/settings
+```
+
+Add these two secrets:
+- `GMAIL_EMAIL`: Your Gmail address
+- `GMAIL_APP_PASSWORD`: The 16-character app password
+
+---
+
+## 🗄️ Database Migration
+
+### Apply Migration to Add `reminder_sent` Column
+
+**For Local Database:**
+```bash
+cd backend
+python -m alembic upgrade head
+```
+
+**For Hugging Face Production Database:**
+The migration will run automatically when the space rebuilds.
+
+**What this does:**
+- Adds `reminder_sent` column to `todos` table
+- Sets default value to `False` for existing tasks
+- Tracks whether reminder email has been sent for each task
+
+---
+
+## 🚀 How to Run
+
+### Local Development
+
+1. **Install backend dependencies:**
+   ```bash
+   cd backend
+   pip install -r requirements.txt
+   ```
+
+2. **Set environment variables in `.env`:**
+   ```bash
+   GMAIL_EMAIL=your-email@gmail.com
+   GMAIL_APP_PASSWORD=your-app-password
+   NEON_DATABASE_URL=your-database-url
+   JWT_SECRET=your-jwt-secret
+   # ... other env vars
+   ```
+
+3. **Apply database migration:**
+   ```bash
+   python -m alembic upgrade head
+   ```
+
+4. **Run the backend:**
+   ```bash
+   python -m uvicorn src.main:app --reload --port 8801
+   ```
+
+5. **Check startup logs:**
+   Look for:
+   ```
+   ✅ Reminder scheduler started (runs every hour)
+   ```
+
+   If you see:
+   ```
+   ⚠️  Reminder scheduler disabled (Gmail not configured)
+   ```
+   Then your Gmail credentials are missing or incorrect.
+
+### Production (Hugging Face Space)
+
+1. **Add secrets to Hugging Face Space:**
+   - `GMAIL_EMAIL`
+   - `GMAIL_APP_PASSWORD`
+   - `NEON_DATABASE_URL`
+   - `JWT_SECRET`
+   - `QWEN_API_KEY`
+
+2. **Push to Hugging Face:**
+   ```bash
+   cd hf-space
+   git add .
+   git commit -m "feat: add email reminder system"
+   git push
+   ```
+
+3. **Wait for rebuild** (~5 minutes)
+
+4. **Check logs:**
+   - Go to https://huggingface.co/spaces/ammaraak/todo-app
+   - Click "Logs" or "Settings"
+   - Look for "✅ Reminder scheduler started"
+
+---
+
+## 📱 How to Use
+
+### For Users
+
+1. **Create a task with a due date:**
+   - Login to the app
+   - Click "Create New Todo"
+   - Fill in title, description
+   - **Select a due date**
+   - You'll see: "🔔 Reminder email will be sent 1 day before"
+
+2. **The reminder indicator:**
+   - In the todo list, tasks with due dates show a 🔔 icon
+   - This means reminder is scheduled
+   - After reminder is sent, the icon disappears
+
+3. **Receive the email:**
+   - 1 day before the due date, check your email
+   - You'll get a beautiful HTML email with:
+     - Task title
+     - Full description
+     - Due date and time
+     - Priority level
+     - Tags
+     - Time remaining
+
+---
+
+## 🧪 Testing
+
+### Test 1: Manual Email Test
+
+Create a test script `backend/test_email.py`:
+
+```python
+from src.services.email_service import email_service
+from datetime import datetime, timedelta
+
+# Test email sending
+test_due_date = datetime.utcnow() + timedelta(hours=24)
+
+success = email_service.send_reminder(
+    to_email="your-test-email@gmail.com",
+    task_title="Test Task - Email Reminder",
+    task_description="This is a test to verify email reminders are working!",
+    due_date=test_due_date,
+    priority="high",
+    tags=["test"],
+    task_id="test-123"
+)
+
+print(f"Email sent: {success}")
+```
+
+Run it:
+```bash
+cd backend
+python test_email.py
+```
+
+Check your inbox!
+
+### Test 2: Full Integration Test
+
+1. **Create a task due tomorrow:**
+   - Due date: Tomorrow's date
+   - Title: "Test Reminder Task"
+
+2. **Wait for hourly check** (or manually trigger):
+   ```python
+   from src.services.reminder_service import check_and_send_reminders
+   from src.core.database import get_session
+
+   session = next(get_session())
+   result = check_and_send_reminders(session)
+   print(result)  # Should show {"sent": 1, ...}
+   ```
+
+3. **Check your email** - you should receive reminder immediately
+
+4. **Verify in database:**
+   ```python
+   # Check that reminder_sent is now True
+   ```
+
+---
+
+## 📊 Email Template Preview
+
+Here's what the email looks like:
+
+```
+🔔 Task Reminder
+
+Your task is due tomorrow:
+
+┌─────────────────────────────────────┐
+│ Test Reminder Task                  │
+│                                     │
+│ This is a test to verify email...   │
+│                                     │
+│ 📅 Due Date: January 29, 2026      │
+│ ⏰ Time Remaining: 24 hours         │
+│ 🎯 Priority: 🔴 High                │
+│ 🏷️ Tags: test                       │
+└─────────────────────────────────────┘
+
+💡 Tip: Make sure to complete your task on time!
+
+---
+This is an automated reminder from your Todo App.
+Task ID: test-123
+```
+
+---
+
+## 🔍 Troubleshooting
+
+### Scheduler Not Starting
+
+**Problem:** `⚠️ Reminder scheduler disabled (Gmail not configured)`
+
+**Solution:**
+1. Check `.env` file has `GMAIL_EMAIL` and `GMAIL_APP_PASSWORD`
+2. Restart the backend server
+3. Check for typos in env var names
+
+### Emails Not Sending
+
+**Problem:** No emails received
+
+**Solutions:**
+1. **Check app password:**
+   - Make sure you're using the 16-character app password, NOT your regular password
+   - Regenerate the app password if needed
+
+2. **Check Gmail settings:**
+   - Make sure 2-Step Verification is enabled
+   - Make sure "Less secure app access" is NOT blocked
+
+3. **Check logs:**
+   ```bash
+   # Look for error messages in backend console
+   # Common errors:
+   # - "Authentication failed" → Wrong password
+   # - "Connection refused" → Network/firewall issue
+   ```
+
+### Migration Failed
+
+**Problem:** `Can't locate revision identified by '29f774bde39a'`
+
+**Solution:**
+The migration was already created manually at `backend/alembic/versions/002_add_reminder_sent.py`. Just run:
+```bash
+cd backend
+python -m alembic upgrade head
+```
+
+---
+
+## 📝 Summary
+
+### Files Created/Modified
+
+**Backend:**
+- ✅ `backend/src/models/todo.py` - Added `reminder_sent` field
+- ✅ `backend/src/schemas/todo.py` - Updated response schema
+- ✅ `backend/src/services/email_service.py` - NEW email sending service
+- ✅ `backend/src/services/reminder_service.py` - NEW reminder checker
+- ✅ `backend/src/core/config.py` - Added Gmail config
+- ✅ `backend/src/main.py` - Integrated scheduler
+- ✅ `backend/src/api/todos.py` - Updated to return `reminder_sent`
+- ✅ `backend/requirements.txt` - Added APScheduler
+- ✅ `backend/alembic/versions/002_add_reminder_sent.py` - NEW migration
+
+**Frontend:**
+- ✅ `frontend/src/components/dashboard/CreateTodoModal.tsx` - Shows reminder info
+- ✅ `frontend/src/components/dashboard/TodoList.tsx` - Shows reminder indicator
+- ✅ `frontend/src/types/index.ts` - Added `reminder_sent` to Todo interface
+
+---
+
+## 🎉 You're All Set!
+
+Once you:
+1. ✅ Generate Gmail app password
+2. ✅ Add to `.env` or Hugging Face secrets
+3. ✅ Run database migration
+4. ✅ Restart the backend
+
+Your app will automatically send reminder emails 1 day before tasks are due!
+
+**The scheduler runs every hour**, checking for tasks due in ~24 hours and sending reminders.
+
+---
+
+*Implementation Date: 2026-01-28*
+*Feature: Email Reminders for Tasks*
+*Trigger: 1 day before due date*
+*Service: Gmail SMTP*
+*Scheduler: APScheduler (hourly)*

MOBILE-FIXES.md

@@ -0,0 +1,190 @@
+# 📱 Mobile Responsiveness Fixes - DEPLOYED
+
+## Status: DEPLOYED to GitHub ✅
+
+---
+
+## 🎯 Problem
+
+**Issue:** "chat mobile responsive ni ha"
+Chat interface was not responsive on mobile devices - fixed positioning didn't work well on small screens.
+
+---
+
+## ✅ What Was Fixed
+
+### **1. AIChatPanel.tsx** - Full Width on Mobile
+**Before:**
+```tsx
+className="fixed bottom-20 right-4 ... w-full md:max-w-md md:h-600px"
+```
+**After:**
+```tsx
+className="fixed bottom-20 right-4 left-4 md:left-auto md:right-6 w-auto md:w-full md:max-w-md h-[calc(100vh-80px)] md:h-auto"
+```
+
+**Mobile:** `left-4 right-4` (full width with margins), `h-[calc(100vh-80px)]` (fit viewport)
+**Desktop:** `md:left-auto md:right-6` (right side only), `md:h-auto` (fixed height)
+
+---
+
+### **2. AIChatButton.tsx** - Smaller Button on Mobile
+**Before:**
+```tsx
+className="fixed bottom-6 right-4 md:bottom-6 md:right-6"
+// Button: w-16 h-16 (64px)
+```
+**After:**
+```tsx
+className="fixed bottom-20 right-4 z-50 md:bottom-6 md:right-6"
+// Button: w-14 h-14 md:w-16 md:h-16
+```
+
+**Mobile:** 14x14 (56px) at bottom-20 (avoids mobile elements)
+**Desktop:** 16x16 (64px) at bottom-6
+
+---
+
+### **3. ChatInput.tsx** - Mobile-Friendly Sizing
+**Before:**
+```tsx
+className="flex gap-2 items-end p-4 ... text-base"
+// Button: min-w-[60px]
+```
+**After:**
+```tsx
+className="flex gap-2 items-end p-3 md:p-4 ... text-sm md:text-base"
+// Button: min-w-[40px] md:min-w-[60px]
+```
+
+**Mobile:** Smaller padding (p-3), smaller text (text-sm), smaller button (40px)
+**Desktop:** Normal padding (p-4), base text, larger button (60px)
+
+---
+
+## 🚀 Deployment Status
+
+### **GitHub:** ✅ Pushed to `001-ai-assistant` branch
+```
+https://github.com/ammarakk/Todo-App
+```
+
+### **Vercel:** 🔄 Auto-deploying from GitHub
+Vercel will automatically build and deploy when it detects the new commit.
+
+**Check deployment status:**
+```
+https://vercel.com/ammar-ahmed-khans-projects-6b1515e7
+```
+
+### **Hugging Face:** ⏳ Rebuilding with latest backend
+```
+https://huggingface.co/spaces/ammaraak/todo-app
+```
+
+---
+
+## 🧪 Test Steps (5 Minutes Baad)
+
+### **Mobile Test:**
+1. **Open your phone or browser mobile view**
+2. **Go to:** `https://frontend-48posvy29-ammar-ahmed-khans-projects-6b1515e7.vercel.app`
+3. **Login** with your credentials
+4. **Go to Dashboard**
+5. **Tap the AI chat button** (bottom-right corner)
+6. **Verify:**
+   - ✅ Chat panel opens with full width (with small margins)
+   - ✅ Panel height fits screen (not too tall)
+   - ✅ Input field and send button are touch-friendly
+   - ✅ Close button works
+   - ✅ Messages scroll properly
+
+### **Desktop Test:**
+1. **Open desktop browser**
+2. **Go to same URL**
+3. **Verify:**
+   - ✅ Chat panel is fixed width on right side
+   - ✅ Button is larger (64px)
+   - ✅ All functionality works
+
+---
+
+## 📊 Before vs After
+
+### **BEFORE (Mobile):**
+```
+❌ Chat panel fixed width (not full screen)
+❌ Panel too tall for mobile viewport
+❌ Button too large (64px)
+❌ Input text too large
+❌ Touch targets too small
+```
+
+### **AFTER (Mobile):**
+```
+✅ Chat panel full width (with margins)
+✅ Panel height fits viewport (calc(100vh-80px))
+✅ Button properly sized (56px)
+✅ Text size appropriate for mobile (text-sm)
+✅ Touch targets large enough (40px minimum)
+✅ Proper positioning (bottom-20 to avoid overlap)
+```
+
+---
+
+## 🎯 Breakdown by Screen Size
+
+### **Mobile (< 768px):**
+- Chat Panel: Full width with 16px margins on each side
+- Chat Button: 56x56px at bottom-20
+- Input Padding: 12px (p-3)
+- Input Text: 14px (text-sm)
+- Send Button: 40px min-width
+
+### **Desktop (>= 768px):**
+- Chat Panel: Fixed width (max-w-md = 448px) on right side
+- Chat Button: 64x64px at bottom-6
+- Input Padding: 16px (p-4)
+- Input Text: 16px (text-base)
+- Send Button: 60px min-width
+
+---
+
+## 🔧 Technical Details
+
+### **Responsive Classes Used:**
+- `left-4 right-4` - Mobile full width
+- `md:left-auto md:right-6` - Desktop right side
+- `h-[calc(100vh-80px)]` - Mobile viewport height
+- `md:h-auto` - Desktop fixed height
+- `w-14 h-14` - Mobile button size
+- `md:w-16 md:h-16` - Desktop button size
+- `text-sm md:text-base` - Responsive text
+- `min-w-[40px] md:min-w-[60px]` - Touch targets
+
+### **Key Changes:**
+1. Used Tailwind's `md:` breakpoint for desktop-specific styles
+2. Calculated mobile height using `calc(100vh-80px)` to avoid overflow
+3. Made touch targets at least 40px for mobile usability
+4. Used smaller padding and text on mobile for space efficiency
+
+---
+
+## ✅ Summary
+
+**Fixed Issues:**
+1. ✅ Chat panel now full width on mobile
+2. ✅ Chat button properly sized on mobile
+3. ✅ Input field mobile-friendly
+4. ✅ All touch targets appropriate size
+5. ✅ Height calculations prevent viewport overflow
+6. ✅ Pushed to GitHub for Vercel deployment
+
+**Next:** Wait 5 minutes for Vercel deployment, then test on mobile!
+
+---
+
+*Fixed: 2026-01-28*
+*Branch: 001-ai-assistant*
+*Deployment: Vercel auto-deploying*
+*Result: Chat will be mobile responsive after deployment!*

PLAN-EMAIL-REMINDERS.md

@@ -0,0 +1,252 @@
+# Email Reminder System for Todo App
+
+## Overview
+Add email reminder functionality that sends notifications to users 1 day before their task's due date.
+
+## Requirements (from user)
+- Send reminder to user's login email
+- Trigger: 1 day before due date/time
+- Only for tasks with due dates set
+- Email service: Gmail SMTP
+- Email content: Task title, description, due date/time
+
+---
+
+## Architecture
+
+### Components to Add
+
+1. **Database Schema Changes**
+   - Add `reminder_sent` boolean column to `todos` table
+   - Tracks whether reminder has been sent for each task
+
+2. **Email Service Module**
+   - New module: `backend/src/services/email_service.py`
+   - Handles SMTP connection and email sending
+   - Uses Gmail SMTP with app-specific password
+
+3. **Background Scheduler**
+   - Add APScheduler to FastAPI lifespan
+   - Runs every hour to check for tasks needing reminders
+   - Finds tasks due in ~24 hours that haven't had reminders sent
+
+4. **Frontend UI Updates**
+   - Add reminder indicator in CreateTodoModal
+   - Show reminder status in TodoList
+   - Display "Reminder will be sent 1 day before" message
+
+---
+
+## Implementation Plan
+
+### Phase 1: Database & Backend Core
+
+#### 1.1 Update Todo Model
+**File**: `backend/src/models/todo.py`
+
+Add field:
+```python
+reminder_sent: Optional[bool] = Field(
+    default=False,
+    description='Whether reminder email has been sent',
+)
+```
+
+#### 1.2 Create Database Migration
+**Command**: From `backend/` directory
+```bash
+alembic revision --autogenerate -m "add reminder_sent to todos"
+```
+
+**Migration will add**:
+```sql
+ALTER TABLE todos ADD COLUMN reminder_sent BOOLEAN DEFAULT FALSE;
+```
+
+**Apply migration**:
+```bash
+alembic upgrade head
+```
+
+#### 1.3 Update Todo Schemas
+**File**: `backend/src/schemas/todo.py`
+
+Update `TodoCreateRequest` and `TodoResponse` to include `reminder_sent` field
+
+---
+
+### Phase 2: Email Service
+
+#### 2.1 Create Email Service Module
+**New File**: `backend/src/services/email_service.py`
+
+Handles SMTP connection to Gmail and sends HTML email reminders.
+
+#### 2.2 Update Configuration
+**File**: `backend/src/core/config.py`
+
+Add environment variables:
+```python
+gmail_email: Optional[str] = Field(None, env="GMAIL_EMAIL")
+gmail_app_password: Optional[str] = Field(None, env="GMAIL_APP_PASSWORD")
+```
+
+#### 2.3 Update requirements.txt
+**File**: `backend/requirements.txt`
+
+```
+apscheduler>=3.10.0
+```
+
+---
+
+### Phase 3: Reminder Scheduler
+
+#### 3.1 Create Reminder Service
+**New File**: `backend/src/services/reminder_service.py`
+
+Function `check_and_send_reminders(session)` that:
+- Finds tasks due within 25 hours
+- Filters out completed tasks
+- Filters out tasks that already had reminders sent
+- Sends email for each eligible task
+- Marks task as `reminder_sent = True`
+
+#### 3.2 Integrate Scheduler into FastAPI
+**File**: `backend/src/main.py`
+
+Update lifespan function to:
+- Initialize APScheduler on startup
+- Add job to run `check_and_send_reminders` every hour
+- Shutdown scheduler on app shutdown
+- Only start if Gmail credentials are configured
+
+---
+
+### Phase 4: Frontend Updates
+
+#### 4.1 Update CreateTodoModal
+**File**: `frontend/src/components/dashboard/CreateTodoModal.tsx`
+
+Add info message after due date field showing:
+"🔔 Reminder email will be sent 1 day before due date"
+
+#### 4.2 Update TodoList (Optional)
+**File**: `frontend/src/components/dashboard/TodoList.tsx`
+
+Add reminder icon (🔔) next to tasks with due dates
+
+---
+
+### Phase 5: Environment Configuration
+
+#### 5.1 Backend Environment Variables
+**File**: `backend/.env`
+
+```bash
+# Gmail SMTP Configuration
+GMAIL_EMAIL=your-email@gmail.com
+GMAIL_APP_PASSWORD=your-app-specific-password
+```
+
+#### 5.2 Generate Gmail App Password
+Instructions:
+1. Go to https://myaccount.google.com/security
+2. Enable 2-Step Verification
+3. Search for "App Passwords"
+4. Create app password: "Mail" + "Other (Custom name)" = "Todo App"
+5. Copy 16-character password
+6. Add to `.env`
+
+---
+
+## Implementation Files Summary
+
+### New Files to Create
+1. `backend/src/services/email_service.py` - Email sending logic
+2. `backend/src/services/reminder_service.py` - Reminder checking logic
+
+### Files to Modify
+1. `backend/src/models/todo.py` - Add `reminder_sent` field
+2. `backend/src/schemas/todo.py` - Update schemas
+3. `backend/src/core/config.py` - Add Gmail config
+4. `backend/src/main.py` - Add scheduler to lifespan
+5. `backend/requirements.txt` - Add APScheduler
+6. `frontend/src/components/dashboard/CreateTodoModal.tsx` - Show reminder info
+7. `frontend/src/components/dashboard/TodoList.tsx` - Add reminder indicator (optional)
+
+### Database
+1. Run: `alembic revision --autogenerate -m "add reminder_sent to todos"`
+2. Run: `alembic upgrade head`
+
+---
+
+## Testing Plan
+
+### Backend Testing
+1. Run migration to add `reminder_sent` column
+2. Test email service with sample email
+3. Create task due in ~24 hours
+4. Manually trigger reminder check
+5. Verify email received and `reminder_sent = True`
+
+### Frontend Testing
+1. Open Create Todo modal
+2. Set due date
+3. Verify reminder message appears
+4. Create task and verify indicator shows in list
+
+### End-to-End Testing
+1. Create task with due date = tomorrow
+2. Wait for hourly check (or trigger manually)
+3. Check email arrives
+4. Verify no duplicate emails for same task
+
+---
+
+## Deployment Checklist
+
+### Hugging Face Space Secrets
+Add to your Hugging Face Space:
+- `GMAIL_EMAIL`: Your Gmail address
+- `GMAIL_APP_PASSWORD`: Gmail app-specific password
+
+### Migration on Production
+```bash
+cd hf-space/backend
+alembic upgrade head
+```
+
+### Verification
+1. Check logs for "✅ Reminder scheduler started"
+2. Monitor `/health` endpoint
+3. Check error logs for email failures
+
+---
+
+## Security Considerations
+
+1. **Gmail App Password**: Never commit to git, always use env vars
+2. **Rate Limiting**: Hourly checks minimize Gmail API usage
+3. **Error Handling**: Email failures don't crash the app
+4. **User Privacy**: Only user's own email receives their reminders
+
+---
+
+## Future Enhancements (Optional)
+
+1. Customizable reminder timing (1 day, 1 hour, etc.)
+2. Snooze functionality
+3. Overdue task reminders
+4. Email preferences in user profile
+5. Multiple reminders per task
+6. Unsubscribe link in emails
+
+---
+
+## Rollback Plan
+
+If issues arise:
+1. Disable scheduler: Remove Gmail env vars
+2. Revert migration: `alembic downgrade -1`
+3. Remove `reminder_sent` handling from code

backend/alembic/versions/002_add_reminder_sent.py

@@ -0,0 +1,32 @@
+"""add reminder_sent to todos
+
+Revision ID: 002
+Revises: 29f774bde39a
+Create Date: 2026-01-28 02:41:00.000000
+
+"""
+from typing import Sequence, Union
+
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision: str = '002'
+down_revision: Union[str, None] = '29f774bde39a'
+branch_labels: Union[str, Sequence[str], None] = None
+depends_on: Union[str, Sequence[str], None] = None
+
+
+def upgrade() -> None:
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.add_column('todos', sa.Column('reminder_sent', sa.Boolean(), nullable=True))
+    op.execute("UPDATE todos SET reminder_sent = FALSE")
+    op.alter_column('todos', 'reminder_sent', nullable=False)
+    # ### end Alembic commands ###
+
+
+def downgrade() -> None:
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.drop_column('todos', 'reminder_sent')
+    # ### end Alembic commands ###

backend/requirements.txt

@@ -12,3 +12,4 @@ httpx>=0.26.0
 pydantic>=2.5.0
 pydantic-settings>=2.1.0
 python-dotenv>=1.0.0
+apscheduler>=3.10.0

backend/src/api/todos.py

@@ -72,6 +72,7 @@ async def list_todos(
             priority=todo.priority.value,
             tags=todo.tags,
             due_date=todo.due_date.isoformat() if todo.due_date else None,
+            reminder_sent=todo.reminder_sent,
             created_at=todo.created_at.isoformat(),
             updated_at=todo.updated_at.isoformat(),
         )
@@ -115,6 +116,7 @@ async def create_todo(
         priority=todo.priority.value,
         tags=todo.tags,
         due_date=todo.due_date.isoformat() if todo.due_date else None,
+        reminder_sent=todo.reminder_sent,
         created_at=todo.created_at.isoformat(),
         updated_at=todo.updated_at.isoformat(),
     )
@@ -167,6 +169,7 @@ async def toggle_todo_post(
         priority=todo.priority.value,
         tags=todo.tags,
         due_date=todo.due_date.isoformat() if todo.due_date else None,
+        reminder_sent=todo.reminder_sent,
         created_at=todo.created_at.isoformat(),
         updated_at=todo.updated_at.isoformat(),
     )
@@ -217,6 +220,7 @@ async def toggle_complete(
         priority=todo.priority.value,
         tags=todo.tags,
         due_date=todo.due_date.isoformat() if todo.due_date else None,
+        reminder_sent=todo.reminder_sent,
         created_at=todo.created_at.isoformat(),
         updated_at=todo.updated_at.isoformat(),
     )
@@ -255,6 +259,7 @@ async def get_todo(
         priority=todo.priority.value,
         tags=todo.tags,
         due_date=todo.due_date.isoformat() if todo.due_date else None,
+        reminder_sent=todo.reminder_sent,
         created_at=todo.created_at.isoformat(),
         updated_at=todo.updated_at.isoformat(),
     )
@@ -310,6 +315,7 @@ async def update_todo(
         priority=todo.priority.value,
         tags=todo.tags,
         due_date=todo.due_date.isoformat() if todo.due_date else None,
+        reminder_sent=todo.reminder_sent,
         created_at=todo.created_at.isoformat(),
         updated_at=todo.updated_at.isoformat(),
     )

backend/src/core/config.py

@@ -58,6 +58,16 @@ class Settings(BaseSettings):
         default=None, description='Hugging Face API key'
     )
 
+    # ========================================
+    # Email Configuration (Gmail SMTP)
+    # ========================================
+    gmail_email: Optional[str] = Field(
+        default=None, description='Gmail address for sending reminders'
+    )
+    gmail_app_password: Optional[str] = Field(
+        default=None, description='Gmail app-specific password for SMTP'
+    )
+
     # ========================================
     # Frontend URL
     # ========================================

backend/src/main.py

@@ -21,6 +21,9 @@ async def lifespan(app: FastAPI) -> AsyncGenerator[None, None]:
 
     Handles startup and shutdown events.
     """
+    # Scheduler instance
+    scheduler = None
+
     # Startup
     print(f"Starting Todo App API")
     print(f"Environment: {settings.env}")
@@ -32,9 +35,44 @@ async def lifespan(app: FastAPI) -> AsyncGenerator[None, None]:
         init_db()
         print("Database initialized")
 
+    # Start reminder scheduler if Gmail configured
+    if settings.gmail_email and settings.gmail_app_password:
+        try:
+            from apscheduler.schedulers.asyncio import AsyncIOScheduler
+            from src.services.reminder_service import check_and_send_reminders
+            from src.core.database import get_session
+
+            scheduler = AsyncIOScheduler()
+
+            # Add job to check reminders every hour
+            def run_reminder_check():
+                """Wrapper to get fresh session for each check."""
+                session = next(get_session())
+                try:
+                    check_and_send_reminders(session)
+                finally:
+                    session.close()
+
+            scheduler.add_job(
+                run_reminder_check,
+                'interval',
+                hours=1,
+                id='reminder_checker',
+                name='Check and send task reminders'
+            )
+            scheduler.start()
+            print("✅ Reminder scheduler started (runs every hour)")
+        except Exception as e:
+            print(f"⚠️  Failed to start reminder scheduler: {e}")
+    else:
+        print("⚠️  Reminder scheduler disabled (Gmail not configured)")
+
     yield
 
     # Shutdown
+    if scheduler:
+        scheduler.shutdown()
+        print("Reminder scheduler stopped")
     print("Shutting down Todo App API")
 
 

backend/src/models/todo.py

@@ -76,6 +76,10 @@ class Todo(SQLModel, table=True):
         default=None,
         description='Completion timestamp',
     )
+    reminder_sent: Optional[bool] = Field(
+        default=False,
+        description='Whether reminder email has been sent',
+    )
     user_id: UUID = Field(
         default=None,
         foreign_key='users.id',

backend/src/schemas/todo.py

@@ -38,6 +38,7 @@ class TodoResponse(BaseModel):
     priority: str
     tags: Optional[List[str]]
     due_date: Optional[str]
+    reminder_sent: Optional[bool]
     created_at: str
     updated_at: str
 

backend/src/services/email_service.py

@@ -0,0 +1,137 @@
+"""
+Email service for sending reminders via Gmail SMTP.
+"""
+import smtplib
+from email.mime.text import MIMEText
+from email.mime.multipart import MIMEMultipart
+from typing import Optional
+from datetime import datetime
+
+from src.core.config import settings
+
+
+class EmailService:
+    """Service for sending emails via Gmail SMTP."""
+
+    def __init__(self):
+        self.smtp_server = "smtp.gmail.com"
+        self.smtp_port = 587
+        self.gmail_email = getattr(settings, 'gmail_email', None)
+        self.gmail_app_password = getattr(settings, 'gmail_app_password', None)
+
+    def send_reminder(
+        self,
+        to_email: str,
+        task_title: str,
+        task_description: Optional[str],
+        due_date: datetime,
+        priority: Optional[str] = None,
+        tags: Optional[list] = None,
+        task_id: Optional[str] = None
+    ) -> bool:
+        """
+        Send reminder email for task due soon.
+
+        Args:
+            to_email: Recipient email address
+            task_title: Title of the task
+            task_description: Detailed description of the task
+            due_date: When the task is due
+            priority: Task priority (low, medium, high)
+            tags: Task tags
+            task_id: Unique task identifier
+
+        Returns:
+            bool: True if email sent successfully, False otherwise
+        """
+        if not self.gmail_email or not self.gmail_app_password:
+            print("Email service not configured: Gmail credentials missing")
+            return False
+
+        try:
+            # Create message
+            msg = MIMEMultipart('alternative')
+            msg['Subject'] = f'🔔 Reminder: Task Due Tomorrow - {task_title}'
+            msg['From'] = self.gmail_email
+            msg['To'] = to_email
+
+            # Format priority for display
+            priority_display = {
+                'low': '🟢 Low',
+                'medium': '🟡 Medium',
+                'high': '🔴 High'
+            }.get(priority or 'medium', '⚪ Medium')
+
+            # Format tags for display
+            tags_display = ''
+            if tags:
+                tags_display = '<p style="color: #666;"><strong>🏷️ Tags:</strong> ' + ', '.join(tags) + '</p>'
+
+            # Calculate time until due
+            now = datetime.utcnow()
+            time_until_due = due_date - now
+            hours_remaining = int(time_until_due.total_seconds() / 3600)
+
+            # Email body with full task details
+            html = f"""
+            <html>
+              <body style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; line-height: 1.6; color: #333;">
+                <div style="max-width: 600px; margin: 0 auto; padding: 20px;">
+                  <h2 style="color: #667eea; margin-bottom: 10px;">🔔 Task Reminder</h2>
+                  <p style="color: #666; font-size: 16px;">Your task is due <strong>tomorrow</strong>:</p>
+
+                  <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 30px; border-radius: 12px; margin: 25px 0; box-shadow: 0 4px 6px rgba(0,0,0,0.1);">
+                    <h3 style="color: #ffffff; margin-top: 0; font-size: 24px;">{task_title}</h3>
+
+                    {f'<p style="color: #e0e7ff; font-size: 16px; margin: 15px 0; line-height: 1.8;">{task_description}</p>' if task_description else ''}
+
+                    <div style="background: rgba(255,255,255,0.2); padding: 20px; border-radius: 8px; margin-top: 20px;">
+                      <p style="color: #ffffff; margin: 8px 0; font-size: 15px;">
+                        <strong>📅 Due Date:</strong> {due_date.strftime('%B %d, %Y at %I:%M %p')}
+                      </p>
+                      <p style="color: #ffffff; margin: 8px 0; font-size: 15px;">
+                        <strong>⏰ Time Remaining:</strong> {hours_remaining} hours
+                      </p>
+                      <p style="color: #ffffff; margin: 8px 0; font-size: 15px;">
+                        <strong>🎯 Priority:</strong> {priority_display}
+                      </p>
+                      {f'{tags_display}' if tags_display else ''}
+                    </div>
+                  </div>
+
+                  <div style="background: #f8f9fa; padding: 20px; border-radius: 8px; border-left: 4px solid #667eea; margin: 20px 0;">
+                    <p style="margin: 0; color: #495057; font-size: 15px;">
+                      <strong>💡 Tip:</strong> Make sure to complete your task on time to stay productive!
+                    </p>
+                  </div>
+
+                  <hr style="margin: 30px 0; border: none; border-top: 1px solid #dee2e6;">
+                  <p style="color: #6c757d; font-size: 12px; text-align: center;">
+                    This is an automated reminder from your <strong>Todo App</strong>.<br>
+                    You received this because you created this task with a due date.<br>
+                    Task ID: {task_id or 'N/A'}
+                  </p>
+                </div>
+              </body>
+            </html>
+            """
+
+            part = MIMEText(html, 'html')
+            msg.attach(part)
+
+            # Send email
+            server = smtplib.SMTP(self.smtp_server, self.smtp_port)
+            server.starttls()
+            server.login(self.gmail_email, self.gmail_app_password)
+            server.send_message(msg)
+            server.quit()
+
+            print(f"✅ Reminder email sent to {to_email} for task: {task_title}")
+            return True
+        except Exception as e:
+            print(f"❌ Failed to send email: {e}")
+            return False
+
+
+# Singleton instance
+email_service = EmailService()

backend/src/services/reminder_service.py

@@ -0,0 +1,128 @@
+"""
+Background service to check and send task reminders.
+"""
+from datetime import datetime, timedelta
+from typing import List
+from uuid import UUID
+
+from sqlalchemy.orm import Session
+from sqlalchemy import and_
+
+from src.models.todo import Todo, Status
+from src.models.user import User
+from src.services.email_service import email_service
+
+
+def check_and_send_reminders(session: Session) -> dict:
+    """
+    Check for tasks due in ~24 hours and send reminders.
+
+    This function should be called hourly by the scheduler.
+    It finds tasks that are:
+    - Not completed
+    - Have a due_date set
+    - Due within the next 25 hours
+    - Haven't had a reminder sent yet
+
+    Args:
+        session: Database session
+
+    Returns:
+        dict with count of reminders sent and errors
+    """
+    # Calculate time window: now to now+25 hours
+    # This ensures we catch tasks due "tomorrow" when checking hourly
+    now = datetime.utcnow()
+    reminder_window_start = now
+    reminder_window_end = now + timedelta(hours=25)
+
+    print(f"🔍 Checking for tasks due between {reminder_window_start} and {reminder_window_end}")
+
+    # Build query to find eligible tasks
+    query = session.query(Todo, User).join(
+        User, Todo.user_id == User.id
+    ).filter(
+        and_(
+            Todo.status != Status.COMPLETED,        # Not completed
+            Todo.due_date.isnot(None),              # Has due date
+            Todo.due_date >= reminder_window_start, # Due in future
+            Todo.due_date <= reminder_window_end,   # Due within 25 hours
+            Todo.reminder_sent == False             # Reminder not sent yet
+        )
+    )
+
+    results = query.all()
+    sent_count = 0
+    error_count = 0
+    skipped_count = 0
+
+    print(f"📋 Found {len(results)} tasks eligible for reminders")
+
+    for todo, user in results:
+        try:
+            # Send reminder email with full task details
+            success = email_service.send_reminder(
+                to_email=user.email,
+                task_title=todo.title,
+                task_description=todo.description,
+                due_date=todo.due_date,
+                priority=todo.priority.value if todo.priority else None,
+                tags=todo.tags,
+                task_id=str(todo.id)
+            )
+
+            if success:
+                # Mark reminder as sent
+                todo.reminder_sent = True
+                session.commit()
+                sent_count += 1
+                print(f"✅ Reminder sent for task '{todo.title}' to {user.email}")
+            else:
+                error_count += 1
+                print(f"❌ Failed to send reminder for task '{todo.title}'")
+
+        except Exception as e:
+            print(f"❌ Error sending reminder for task {todo.id}: {e}")
+            error_count += 1
+            session.rollback()
+
+    summary = {
+        "checked": len(results),
+        "sent": sent_count,
+        "errors": error_count,
+        "skipped": skipped_count
+    }
+
+    print(f"📊 Reminder check complete: {summary}")
+    return summary
+
+
+def send_test_reminder(session: Session, user_id: UUID) -> bool:
+    """
+    Send a test reminder to verify email configuration.
+
+    Args:
+        session: Database session
+        user_id: User ID to send test email to
+
+    Returns:
+        bool: True if test email sent successfully
+    """
+    from src.models.user import User
+
+    user = session.query(User).filter(User.id == user_id).first()
+    if not user:
+        print(f"User not found: {user_id}")
+        return False
+
+    test_due_date = datetime.utcnow() + timedelta(hours=24)
+
+    return email_service.send_reminder(
+        to_email=user.email,
+        task_title="🧪 Test Task - Todo App Reminder",
+        task_description="This is a test reminder email to verify your email configuration is working correctly!",
+        due_date=test_due_date,
+        priority="medium",
+        tags=["test"],
+        task_id="test-task-id"
+    )

frontend/src/components/dashboard/CreateTodoModal.tsx

@@ -187,6 +187,16 @@ export function CreateTodoModal({ onClose, onCreate }: CreateTodoModalProps) {
                         onChange={(e) => setDueDate(e.target.value)}
                         className="w-full px-2 sm:px-3 py-2 text-xs border border-gray-300 dark:border-green-500/50 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-green-500 dark:focus:shadow-[0_0_10px_rgba(74,222,128,0.5)] bg-white dark:bg-gray-800 text-gray-900 dark:text-white transition-all"
                       />
+                      {dueDate && (
+                        <div className="mt-1.5 p-2 bg-blue-50 dark:bg-blue-900/20 rounded-md border border-blue-200 dark:border-blue-800">
+                          <div className="flex items-center gap-1.5 text-xs text-blue-700 dark:text-blue-300">
+                            <svg className="w-3.5 h-3.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" />
+                            </svg>
+                            <span className="font-medium">Reminder email will be sent 1 day before</span>
+                          </div>
+                        </div>
+                      )}
                     </div>
 
                     <div>

frontend/src/components/dashboard/TodoList.tsx

@@ -108,6 +108,14 @@ export function TodoList({ todos, loading, onToggleComplete, onDelete }: TodoLis
                         <span className="flex items-center gap-1 text-xs text-gray-500 dark:text-gray-400">
                           <Calendar className="w-3 h-3" />
                           {format(new Date(todo.due_date), 'MMM d, yyyy')}
+                          {!todo.reminder_sent && todo.status !== 'completed' && (
+                            <span
+                              className="ml-1 text-blue-500 dark:text-blue-400"
+                              title="Reminder scheduled"
+                            >
+                              🔔
+                            </span>
+                          )}
                         </span>
                       )}
 

frontend/src/types/index.ts

@@ -71,6 +71,7 @@ export interface Todo {
   completed_at?: string;
   user_id: string;
   tags?: string[];
+  reminder_sent?: boolean;
   created_at: string;
   updated_at: string;
 }