Dominic's Tasks & Family Hub - Complete Implementation Plan
Version: 3.1 (with Task Comments & Admin Features) Project Name: dominicstasks Deployment URL: https://dominicstasks.pages.dev Firebase Project: dominics-tasks Last Updated: January 18, 2026
---
1. Executive Summary
This document outlines the comprehensive implementation plan for Dominic's Tasks & Family Hub, a gamified task management application enhanced with real-time family messaging, private parent communications, Google Drive document sharing, task comments with chat integration, and advanced task organization with types, deadlines, tags, and calendar views.
The application serves three users: Dominic (the primary student user) and his two parents, all of whom require equal access to view, edit, and manage the application's data. Version 3.1 introduces significant new features including a complete task comment system and admin delete capabilities.
---
2. Version 3.1 New Features
2.1 Task Comment System
The Task Comment System allows family members to add discussions directly to tasks. Comments appear both on the task detail view and automatically post to the Family Chat, creating a seamless communication flow.
Comment Badge on Task Cards:
Comments Section in Task Modal:
Auto-Post to Family Chat:
"💬 Comment on "Task Title": Comment text"Data Structure:
// Task comments subcollection: tasks/{taskId}/comments
{
id: "comment_id",
text: "Don't forget to...",
authorId: "user_uid",
authorName: "Parent Name",
authorEmail: "parent@example.com",
timestamp: serverTimestamp(),
}// Task document update
{
commentCount: 5, // Denormalized count for quick display
}
2.2 Admin Delete Capability
Admin Users:
Capabilities:
Implementation:
ADMIN_EMAILS.includes(user.email)"Delete message from [Sender Name]?"---
3. Recent Changes (January 18, 2026)
Culture Rebrand - Gaming Terms to Productivity Terms
The application has been updated to remove gaming terminology and replace it with more productive, positive language:
Files Updated:
src/types/index.ts - All type definitions updatedsrc/utils/index.ts - All utility constants updatedsrc/pages/Achievements.tsx - Achievement names and logic updatedsrc/pages/History.tsx - Statistics display updated---
4. Application Overview
Pages (8 Total)
Key Features
---
5. User Interface Design
5.1 Task Card Design
The task card displays key information with comment count visible on the front:
┌─────────────────────────────────────────────────┐
│ ☑ 📋 [Assignment] [High] │
│ │
│ Math Homework │
│ Pages 45-47 │
│ #math #homework │
│ │
│ 📅 Due today ⭐ 50 EP 💬 3 │
└─────────────────────────────────────────────────┘
Comment Badge Features:
5.2 Task Modal Comments Section
When viewing or editing an existing task, the modal includes a comments section:
┌─────────────────────────────────────────────────┐
│ Edit Task [X] │
├─────────────────────────────────────────────────┤
│ Task Title │
│ [Description...] │
│ [Task Type][Section][Priority] │
│ [Dates][EP Value][Tags] │
├─────────────────────────────────────────────────┤
│ 💬 Comments (3) │
│ ┌─────────────────────────────────────────┐ │
│ │ 👤 Parent Name - Jan 18, 10:30 AM │ │
│ │ Don't forget to check your work! │ │
│ └─────────────────────────────────────────┘ │
│ ┌─────────────────────────────────────────┐ │
│ │ 👤 Parent Name - Jan 18, 9:15 AM │ │
│ │ Good luck on this one! │ │
│ └─────────────────────────────────────────┘ │
│ ┌─────────────────────────────────────────┐ │
│ │ 👤 Parent Name - Jan 17, 4:00 PM │ │
│ │ Let me know if you need help │ │
│ └─────────────────────────────────────────┘ │
│ [Add a comment... ➤] │
│ Comments will also appear in Family Chat │
├─────────────────────────────────────────────────┤
│ [Cancel] [Update] │
└─────────────────────────────────────────────────┘
5.3 Family Chat Integration
When a comment is added, it appears in Family Chat as:
┌─────────────────────────────────────────────────┐
│ 💬 Comment on "Math Homework": Don't forget │
│ to check your work! │
│ 10:30 AM │
└─────────────────────────────────────────────────┘
---
6. Data Structure
6.1 Tasks Collection (tasks)
{
id: "auto_generated_id",
title: "Math Homework",
description: "Pages 45-47",
dueDate: timestamp,
deadlineDate: timestamp,
status: "todo" "today" "afternoon" "assignments" "leftovers" "experiments" "assignment" "exam" "project" "medium" "high" 6.2 Task Comments Subcollection (tasks/{taskId}/comments)
{
id: "comment_id",
text: "Don't forget to check your work!",
authorId: "user_uid",
authorName: "Parent Name",
authorEmail: "parent@example.com",
timestamp: serverTimestamp(),
}
6.3 Family Messages Collection (family_messages)
{
id: "message_id",
text: "💬 Comment on \"Math Homework\": Don't forget to check your work!",
senderId: "user_uid",
senderName: "Parent Name",
senderEmail: "parent@example.com",
timestamp: serverTimestamp(),
type: "system",
systemEvent: "task_comment",
relatedTaskId: "task_id",
attachments: [],
reactions: {},
}
---
7. Technical Implementation
7.1 TasksContext Changes
New Functions:
// Add a comment to a task and auto-post to Family Chat
addTaskComment: (taskId: string, taskTitle: string, text: string) => Promise<void>// Get all comments for a task
getTaskComments: (taskId: string) => Promise<any[]>
Implementation Details:
tasks/{taskId}/comments subcollectioncommentCount on parent task documentfamily_messages collection7.2 TaskCard Changes
Comment Badge Display:
{(task.commentCount || 0) > 0 && (
<div className="flex items-center space-x-1 text-gray-500 bg-gray-100 px-2 py-1 rounded-full">
<MessageCircle size={14} />
<span className="font-medium">{task.commentCount}</span>
</div>
)}
7.3 TaskModal Changes
Comments Section:
getTaskComments()7.4 FamilyChat Admin Features
Admin Detection:
const ADMIN_EMAILS = ['derrickmg.admin@gmail.com', 'brendamgiles@gmail.com'];
const isAdmin = user?.email && ADMIN_EMAILS.includes(user.email);
Admin Delete UI:
---
8. Gamification System
8.1 Experience Points (EP)
8.2 Level Progression
8.3 Updated Achievements (v3.1)
Daily Achievements:
Subject Achievements:
Time Achievements:
Special Achievements:
---
9. User Roles and Permissions
---
10. Deployment
Production Deployment
Build the project
cd /workspace/dominicstasks
npm run buildDeploy to Cloudflare Pages (Production)
npx wrangler pages deploy ./dist --project-name=dominicstasks --branch=production
Important: Always use --branch=production to update the main URL.
Deployment URLs
---
11. Testing Checklist
Task Comment Features
Admin Delete Features
Culture Rebrand
---
12. Version History
---
13. Summary
Version 3.1 of Dominic's Tasks introduces powerful new communication features:
Task Comments System:
Admin Capabilities:
Culture Refinements:
The application is live at https://dominicstasks.pages.dev with all new features deployed and functional.
---
Document Version: 3.1 Last Updated: January 18, 2026 Maintained by: MiniMax Agent