feat: Task Manager - Add Sorting Feature and Code Improvements

[seaburrows]

Overview

This PR adds alphabetical sorting functionality to the Task Manager and includes several code quality improvements and refactoring across the codebase.

Changes Made

task-list.tsx - New Sorting Feature + Code Refactoring

• Added alphabetical sorting with ascending/descending toggle (shows ↑/↓ indicator)
• Refactored into helper functions: renderTasks, filterTasksFn, and tasksSortFn
• Improved sort-then-filter order for more efficient processing

add-task-form.tsx - Code Quality Improvements + Enhanced UX

• Changed submission counter from useRef to useState for proper reactivity and displays count to users
• Added Escape key support to clear input field
• Improved focus management to run only on mount

task-item.tsx - No Changes

• No changes (already optimized with React.memo)

use-local-storage.ts - Code Quality Improvements

• Added JSDoc documentation and explicit return types
• Improved error logging with [useLocalStorage] prefix

Testing

• Manually tested all functionality, tasks can be added, completed, and deleted successfully
• Tasks can be filtered, searched and sorted
• LocalStorage persistence works correctly
• Escape key clears input field as expected
• Submission counter displays correctly

Performance Impact

These changes improve code maintainability while adding useful sorting functionality. The refactored helper functions make the code more modular and easier to maintain. The sorting implementation is straightforward and efficient, using standard JavaScript array methods.

User Experience

• Users can now sort their tasks alphabetically
• Sort button is intuitively placed next to filter buttons
• Visual feedback shows current sort direction
• Seamless integration with existing features
• Improved keyboard accessibility with Escape key support