ColaFlow/docs/plans/sprint_3_story_1.md

story_id, sprint, priority, status, story_points, estimated_days, created_date, assignee

story_id	sprint	priority	status	story_points	estimated_days	created_date	assignee
sprint_3_story_1	sprint_3	P1	not_started	3	1-2	2025-11-05	Frontend Team

Story 1: Complete Logging Utility Migration

Sprint: Sprint 3 Priority: P1 (High) Estimated: 1-2 days Owner: Frontend Team

Description

Replace all remaining console.log statements in the frontend codebase with the unified logger utility (lib/utils/logger.ts). This improves production code quality, reduces console spam, enables proper error tracking integration, and provides environment-aware logging.

User Story

As a frontend developer, I want all logging to go through a unified logger utility, So that logs are properly managed in development and production environments.

Acceptance Criteria

• No console.log statements remain in React Query hooks (lib/hooks/)
• No console.log statements remain in SignalR files (lib/signalr/)
• All logging uses logger.debug(), logger.info(), or logger.error()
• Development logs are verbose, production logs are minimal
• Error logs are properly structured for error tracking services
• No production console spam

Technical Requirements

Affected Files:

• lib/hooks/use-projects.ts - React Query hook logging
• lib/hooks/use-stories.ts - React Query hook logging
• lib/hooks/use-tasks.ts - React Query hook logging
• lib/hooks/use-epics.ts - React Query hook logging (if console.log exists)
• lib/signalr/ConnectionManager.ts - SignalR connection logging
• Other hooks in lib/hooks/ directory

Logger Utility: lib/utils/logger.ts (already exists)

Tasks

• Task 1 - Replace console.log in use-projects.ts
• Task 2 - Replace console.log in use-stories.ts
• Task 3 - Replace console.log in use-tasks.ts
• Task 4 - Replace console.log in other React Query hooks
• Task 5 - Replace console.log in SignalR files
• Task 6 - Verify no console.log remains

Progress: 0/6 tasks completed

Dependencies

Prerequisites:

• ✅ Logger utility already created (lib/utils/logger.ts)
• ✅ Code review completed with specific console.log locations identified

Definition of Done

• All 6 tasks completed
• No console.log statements in production code (except dev tools)
• All React Query hooks use logger
• All SignalR files use logger
• Code reviewed and approved
• Git commit created

Test Plan

Manual Testing:

1. Run application in development mode
2. Verify debug logs appear in console
3. Build for production: npm run build
4. Verify production build has minimal console output
5. Trigger errors and verify they're logged properly

Verification Commands:

# Search for remaining console.log
grep -r "console.log" lib/hooks/
grep -r "console.log" lib/signalr/

# Expected: No results (or only in test files)

Notes

Why This Matters:

• Production console spam hurts performance
• Unstructured logs make debugging harder
• Missing error tracking integration
• Security: potential information leakage

Quick Wins:

• Simple find-and-replace in most cases
• Immediate production quality improvement
• Foundation for error tracking (Sentry/DataDog)

---

Created: 2025-11-05 by Frontend Agent