fix(connections): show destination IP as host for raw-IP targets (#7483)

* fix(connections): show destination IP as host for raw-IP targets

When metadata.host is empty (a raw-IP CONNECT with no domain), the
connection "Host" column fell back to remoteDestination (the outbounds
relay/exit address) joined with the destination port, which misleadingly
showed the relay as the connections destination.

Fall back to metadata.destinationIP instead, in both the list column
(getConnectionHost) and the detail panel.

Closes #6669

* fix(connections): preserve fallback for empty destination IP

---------

Co-authored-by: wonfen <eiwonfen@gmail.com>

src/components/connection/connection-detail.tsx

@@ -73,9 +73,9 @@ const InnerConnectionDetail = ({ data, closed, onClose }: InnerProps) => {
   const theme = useTheme()
   const chains = [...data.chains].reverse().join(' / ')
   const rule = rulePayload ? `${data.rule}(${rulePayload})` : data.rule
-  const host = metadata.host
-    ? `${metadata.host}:${metadata.destinationPort}`
-    : `${metadata.remoteDestination}:${metadata.destinationPort}`
+  const hostAddress =
+    metadata.host || metadata.destinationIP || metadata.remoteDestination
+  const host = `${hostAddress}:${metadata.destinationPort}`
   const Destination = metadata.destinationIP
     ? metadata.destinationIP
     : metadata.remoteDestination

src/components/connection/connection-row-view.ts

@@ -57,9 +57,9 @@ export const getConnectionDestination = (connection: IConnectionsItem) => {
 
 export const getConnectionHost = (connection: IConnectionsItem) => {
   const { metadata } = connection
-  return metadata.host
-    ? `${metadata.host}:${metadata.destinationPort}`
-    : `${metadata.remoteDestination}:${metadata.destinationPort}`
+  const host =
+    metadata.host || metadata.destinationIP || metadata.remoteDestination
+  return `${host}:${metadata.destinationPort}`
 }
 
 export const getConnectionProcess = (connection: IConnectionsItem) => {