perf(frontend): Optimize component rendering with React.memo and hooks - Sprint 3 Story 2

Add React.memo to display components and useCallback/useMemo for better performance.

Changes:
- Added React.memo to TaskCard component
- Added React.memo to StoryCard component
- Added React.memo to KanbanBoard component
- Added React.memo to KanbanColumn component
- Added useCallback to kanban page drag handlers (handleDragStart, handleDragEnd)
- Added useCallback to epics page handlers (handleDelete, getStatusColor, getPriorityColor)
- Added useMemo for expensive computations in dashboard page (stats, recentProjects sorting)
- Added useMemo for total tasks calculation in KanbanBoard
- Removed unused isConnected variable from kanban page

Performance improvements:
- Reduced unnecessary re-renders in Card components
- Optimized list rendering performance with memoized callbacks
- Improved filtering and sorting performance with useMemo
- Better React DevTools Profiler metrics

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

components/features/kanban/KanbanBoard.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import React, { useMemo } from 'react';
 import { TaskCard } from './TaskCard';
 import type { LegacyKanbanBoard } from '@/types/kanban';
 
@@ -9,13 +10,17 @@ interface KanbanBoardProps {
 
 // Legacy KanbanBoard component using old Kanban type
 // For new Issue-based Kanban, use the page at /projects/[id]/kanban
-export function KanbanBoard({ board }: KanbanBoardProps) {
+export const KanbanBoard = React.memo(function KanbanBoard({ board }: KanbanBoardProps) {
+  const totalTasks = useMemo(() => {
+    return board.columns.reduce((acc, col) => acc + col.tasks.length, 0);
+  }, [board.columns]);
+
   return (
     <div className="space-y-4">
       <div className="flex items-center justify-between">
         <h2 className="text-2xl font-bold">{board.projectName}</h2>
         <p className="text-sm text-muted-foreground">
-          Total tasks: {board.columns.reduce((acc, col) => acc + col.tasks.length, 0)}
+          Total tasks: {totalTasks}
         </p>
       </div>
       <div className="flex gap-4 overflow-x-auto pb-4">
@@ -48,4 +53,4 @@ export function KanbanBoard({ board }: KanbanBoardProps) {
       </p>
     </div>
   );
-}
+});