Move URL column between Priority and Start Time in HTTP requests table

- Reorder table headers: URL now appears after Priority, before Start Time
- Update RequestRowSummary component to match new column order
- Improved table layout with URL positioned earlier for better visibility
- Maintains all existing functionality and styling

New column order:
Expand | Method | Status | Type | Priority | URL | Start Time | Queue Time | DNS | Connection | Server Latency | Duration | Total Response Time | Size | Content-Length | Protocol | CDN | Cache

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Michael Mainguy 2025-08-11 12:42:13 -05:00
parent b112fdf8ca
commit 69025c17ee
2 changed files with 10 additions and 10 deletions

View File

@ -53,6 +53,11 @@ const RequestRowSummary: React.FC<RequestRowSummaryProps> = ({
<td className={`${styles.tableCell} ${styles.priorityCell}`} style={{ color: getPriorityColor(request.priority) }}>
{request.priority || '-'}
</td>
<td className={`${styles.tableCell} ${styles.urlCell}`}>
<a href={request.url} target="_blank" rel="noopener noreferrer" className={styles.urlLink}>
{truncateUrl(request.url)}
</a>
</td>
<td className={`${styles.tableCell} ${styles.timeCell}`}>
{formatDuration(request.timing.startOffset)}
</td>
@ -95,11 +100,6 @@ const RequestRowSummary: React.FC<RequestRowSummaryProps> = ({
<td className={styles.serverLatencyCell} style={{ ...getServerLatencyColor(request.timing.serverLatency) }}>
{formatDuration(request.timing.serverLatency)}
</td>
<td className={`${styles.tableCell} ${styles.urlCell}`}>
<a href={request.url} target="_blank" rel="noopener noreferrer" className={styles.urlLink}>
{truncateUrl(request.url)}
</a>
</td>
<td className={styles.durationCell} style={{ ...getDurationColor(request.timing.duration) }}>
{formatDuration(request.timing.duration)}
</td>

View File

@ -66,6 +66,11 @@ const RequestsTable: React.FC<RequestsTableProps> = ({
Priority
</Tooltip>
</th>
<th className={`${styles.tableHeaderCell} ${styles.left}`}>
<Tooltip type={TooltipType.REQUEST_URL}>
URL
</Tooltip>
</th>
<th className={`${styles.tableHeaderCell} ${styles.right}`}>
<Tooltip type={TooltipType.START_TIME}>
Start Time
@ -91,11 +96,6 @@ const RequestsTable: React.FC<RequestsTableProps> = ({
Server Latency
</Tooltip>
</th>
<th className={`${styles.tableHeaderCell} ${styles.left}`}>
<Tooltip type={TooltipType.REQUEST_URL}>
URL
</Tooltip>
</th>
<th className={`${styles.tableHeaderCell} ${styles.right}`}>
<Tooltip type={TooltipType.REQUEST_DURATION}>
Duration