frontend/src/lib/components/datatables/xmr/HostPortCell.svelte

@@ -1,21 +1,19 @@
 <script>
 	import { getModalStore } from '@skeletonlabs/skeleton';
-	import { formatHostname } from '$lib/utils/strings';
 
 	const modalStore = getModalStore();
-
-	/**
-	 * @type {{
-	 *  is_tor: boolean,
-	 *  hostname: string,
-	 *  port: number,
-	 *  ipv6_only: boolean
-	 * }}
-	 */
+	/** @type {string} */
+	export let ip;
+	/** @type {boolean} */
 	export let is_tor;
+	/** @type {string} */
 	export let hostname;
+	/** @type {number} */
 	export let port;
-	export let ipv6_only;
+
+	// if (is_tor) {
+	// 	hostname = hostname.substring(0, 8) + '[...].onion';
+	// }
 
 	/**
 	 * @param {string} onionAddr
@@ -42,8 +40,8 @@
 	</button><br />.onion:<span class="text-indigo-800 dark:text-indigo-400">{port}</span>
 	<span class="text-gray-700 dark:text-gray-400">(TOR)</span>
 {:else}
-	{formatHostname(hostname)}:<span class="text-indigo-800 dark:text-indigo-400">{port}</span><br />
-	{#if ipv6_only}
-		<span class="text-rose-800 dark:text-rose-400">(IPv6 only)</span>
+	{hostname}:<span class="text-indigo-800 dark:text-indigo-400">{port}</span>
+	{#if ip !== ''}
+		<br /><span class="text-gray-700 dark:text-gray-400">{ip}</span>
 	{/if}
 {/if}

frontend/src/lib/utils/strings.js

@@ -1,26 +1,3 @@
-/**
- * Modifies the input string based on whether it is an IPv6 address.
- * If the input is an IPv6 address, it wraps it in square brackets `[ ]`.
- * Otherwise, it returns the input string as-is (for domain names or
- * IPv4 addresses). AND I'M SORRY USING REGEX FOR THIS!
- *
- * @param {string} hostname
- * @returns {string} - The modified string, IPv6 addresses wrapped in `[ ]`.
- */
-export const formatHostname = (hostname) => {
-	// const ipv6Pattern = /^(?:[a-fA-F0-9]{1,4}:){7}[a-fA-F0-9]{1,4}$/; // full
-	// pattern for both full and compressed IPv6 addresses.
-	// source: https://regex101.com/library/cP9mH9?filterFlavors=dotnet&filterFlavors=javascript&orderBy=RELEVANCE&search=ip
-	// This may be incorrect, but let's assume it's correct. xD
-	const ipv6Pattern =
-		/^(([0-9A-Fa-f]{1,4}:){7})([0-9A-Fa-f]{1,4})$|(([0-9A-Fa-f]{1,4}:){1,6}:)(([0-9A-Fa-f]{1,4}:){0,4})([0-9A-Fa-f]{1,4})$/;
-	if (ipv6Pattern.test(hostname)) {
-		return `[${hostname}]`;
-	}
-
-	return hostname;
-};
-
 /**
  * @param {number} bytes
  * @param {number} decimals

frontend/src/routes/remote-nodes/+page.svelte

@@ -211,10 +211,10 @@
 						<tr>
 							<td
 								><HostPortCell
+									ip={row.ip}
 									is_tor={row.is_tor}
 									hostname={row.hostname}
 									port={row.port}
-									ipv6_only={row.ipv6_only}
 								/>
 								<a class="anchor" href="/remote-nodes/logs/?node_id={row.id}">[Logs]</a>
 							</td>

frontend/src/routes/remote-nodes/logs/+page.svelte

@@ -3,7 +3,7 @@
 	import { format, formatDistance } from 'date-fns';
 	import { loadData, loadNodeInfo } from './api-handler';
 	import { onMount } from 'svelte';
-	import { formatHostname, formatHashes, formatBytes } from '$lib/utils/strings';
+	import { formatHashes, formatBytes } from '$lib/utils/strings';
 	import {
 		DtSrRowsPerPage,
 		DtSrThSort,
@@ -71,7 +71,7 @@
 				<tbody>
 					<tr>
 						<td class="font-bold">Hostname:Port</td>
-						<td>{formatHostname(nodeInfo?.hostname)}:{nodeInfo?.port}</td>
+						<td>{nodeInfo?.hostname}:{nodeInfo?.port}</td>
 					</tr>
 					<tr>
 						<td class="font-bold">Public IP</td>