99} from "@/components/ui/table" ;
1010import { LogEntry } from "@/hooks/useWebSocket" ;
1111import { format } from "date-fns" ;
12- import { Globe , Server , Router } from "lucide-react" ;
12+ import { Globe , Server , Router , Network , ExternalLink } from "lucide-react" ;
1313import { useEffect , useRef , useState } from "react" ;
1414
1515interface LogTableProps {
@@ -89,6 +89,8 @@ export function LogTable({ logs, requestLogs }: LogTableProps) {
8989 < TableHead > Response Time</ TableHead >
9090 < TableHead > Service</ TableHead >
9191 < TableHead > Router</ TableHead >
92+ < TableHead > Request Addr</ TableHead >
93+ < TableHead > Request Host</ TableHead >
9294 < TableHead > Client IP</ TableHead >
9395 < TableHead > Location</ TableHead >
9496 < TableHead > Size</ TableHead >
@@ -97,7 +99,7 @@ export function LogTable({ logs, requestLogs }: LogTableProps) {
9799 < TableBody >
98100 { logs . length === 0 ? (
99101 < TableRow >
100- < TableCell colSpan = { 10 } className = "h-24 text-center text-muted-foreground" >
102+ < TableCell colSpan = { 12 } className = "h-24 text-center text-muted-foreground" >
101103 No logs found. Waiting for incoming requests...
102104 </ TableCell >
103105 </ TableRow >
@@ -139,6 +141,22 @@ export function LogTable({ logs, requestLogs }: LogTableProps) {
139141 < span className = "text-xs" > { log . routerName } </ span >
140142 </ div >
141143 </ TableCell >
144+ < TableCell >
145+ < div className = "flex items-center gap-1" >
146+ < Network className = "h-3 w-3 text-muted-foreground" />
147+ < span className = "text-xs font-mono max-w-32 truncate" title = { log . requestAddr } >
148+ { log . requestAddr || '-' }
149+ </ span >
150+ </ div >
151+ </ TableCell >
152+ < TableCell >
153+ < div className = "flex items-center gap-1" >
154+ < ExternalLink className = "h-3 w-3 text-muted-foreground" />
155+ < span className = "text-xs font-mono max-w-32 truncate" title = { log . requestHost } >
156+ { log . requestHost || '-' }
157+ </ span >
158+ </ div >
159+ </ TableCell >
142160 < TableCell className = "font-mono text-xs" >
143161 { log . clientIP }
144162 </ TableCell >
@@ -160,12 +178,12 @@ export function LogTable({ logs, requestLogs }: LogTableProps) {
160178 } )
161179 ) }
162180 < TableRow ref = { loader } >
163- < TableCell colSpan = { 10 } className = "text-center text-muted-foreground" >
181+ < TableCell colSpan = { 12 } className = "text-center text-muted-foreground" >
164182 Loading more logs...
165183 </ TableCell >
166184 </ TableRow >
167185 </ TableBody >
168186 </ Table >
169187 </ div >
170188 ) ;
171- }
189+ }
0 commit comments