fix: Network: Add size and time to Waterfall #30

[krishvsoni]

feat: enhance network request tracking with detailed timing and size information for waterfall view

Purpose of the PR*

This PR integrates a comprehensive Network Waterfall view into the main extension UI to display captured network requests with detailed timing and size information. This enhancement significantly improves debugging capabilities by providing developers with visual insights into network performance, request/response sizes, and timing data similar to browser DevTools.

Closes #30

Priority*

• High: This PR needs to be merged first, before other tasks.
• Medium: This PR should be merged quickly to prevent conflicts due to common changes. (default)
• Low: This PR does not affect other tasks, so it can be merged later.

Changes*

New Features

• Network Waterfall View Component: Complete React component with dark theme support
• Tab Navigation: Added "Network Waterfall" tab alongside "Screenshot & Annotations"
• Enhanced Network Interceptors: Improved fetch and XHR interceptors with detailed timing data
• Shared Type Definitions: Type-safe NetworkRecord interface for consistency across components

Technical Improvements

• Accessibility Compliance: Full keyboard navigation and ARIA support
• Performance Optimizations: Efficient handling of large datasets and binary responses
• Type Safety: Eliminated any types with proper TypeScript interfaces
• Code Quality: Fixed ESLint errors and improved export patterns

[github-actions]

Your PR was set to target main, but it should be directed to develop. The base branch has been updated to develop, please check for any merge conflicts.

[github-actions]

Hey @krishvsoni,
Thanks for another PR! 🚀

[ionleu]

@krishvsoni thank you for your contribution!

Sorry for the wait!

We are a bit busy with fixing a critical defect and a big refactor. Will look into your PR tonight or tomorrow!