fix(frontend): Add comprehensive debugging for API connection issues

Enhanced error handling and debugging to diagnose API connection problems.

Changes:
- Added detailed console logging in API client (client.ts)
- Enhanced error display in projects page with troubleshooting steps
- Added logging in useProjects hook for better debugging
- Display API URL and error details on error screen
- Added retry button for easy error recovery

This will help diagnose why the backend API (localhost:5167) is not connecting.

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

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

lib/hooks/use-projects.ts

@@ -5,8 +5,19 @@ import type { Project, CreateProjectDto, UpdateProjectDto } from '@/types/projec
 export function useProjects(page = 1, pageSize = 20) {
   return useQuery<Project[]>({
     queryKey: ['projects', page, pageSize],
-    queryFn: () => projectsApi.getAll(page, pageSize),
+    queryFn: async () => {
+      console.log('[useProjects] Fetching projects...', { page, pageSize });
+      try {
+        const result = await projectsApi.getAll(page, pageSize);
+        console.log('[useProjects] Fetch successful:', result);
+        return result;
+      } catch (error) {
+        console.error('[useProjects] Fetch failed:', error);
+        throw error;
+      }
+    },
     staleTime: 5 * 60 * 1000, // 5 minutes
+    retry: 1, // Only retry once to fail faster
   });
 }