From 40bcfbf9935c925dc237ef4818a379621093209c Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Mon, 30 Mar 2026 13:36:30 +0700
Subject: [PATCH] Enhance user data handling in users page

- Added a new API call to fetch unique IPs alongside existing user data, improving the richness of information displayed.
- Implemented derived state to organize unique IPs by user, allowing for better data presentation in the UI.
- Updated the table to display IP-server pairs for each user, enhancing clarity and usability.
- Improved error handling during data fetching to ensure robust user experience.
---
 web/src/routes/users/+page.svelte | 73 +++++++++++++++++++++++++++----
 1 file changed, 65 insertions(+), 8 deletions(-)

diff --git a/web/src/routes/users/+page.svelte b/web/src/routes/users/+page.svelte
index 09e9871..a6430df 100644
--- a/web/src/routes/users/+page.svelte
+++ b/web/src/routes/users/+page.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
-	import { fetchAggUsers, ApiError } from '$lib/api/client.js';
+	import { fetchAggUsers, fetchAggUniqueIps, ApiError } from '$lib/api/client.js';
 	import type { components } from '$lib/api/aggregate.gen.js';
 	import { formatBytes, formatMiB } from '$lib/format.js';
 	import { Button } from '$lib/components/ui/button/index.js';
@@ -14,6 +14,7 @@
 	let loading = $state(true);
 	let err = $state<string | null>(null);
 	let rows = $state<components['schemas']['UsersRow'][]>([]);
+	let uniqueIps = $state<components['schemas']['UniqueIPsRow'][]>([]);
 	let partial = $state(false);
 	let includeLinks = $state(false);
 
@@ -21,9 +22,13 @@
 		loading = true;
 		err = null;
 		try {
-			const env = await fetchAggUsers({ include_links: includeLinks });
-			partial = !!env.partial;
-			rows = env.data ?? [];
+			const [usersEnv, uniqueIpsEnv] = await Promise.all([
+				fetchAggUsers({ include_links: includeLinks }),
+				fetchAggUniqueIps({ geo: false })
+			]);
+			partial = !!(usersEnv.partial || uniqueIpsEnv.partial);
+			rows = usersEnv.data ?? [];
+			uniqueIps = uniqueIpsEnv.data ?? [];
 		} catch (e) {
 			err = e instanceof ApiError ? e.message : String(e);
 		} finally {
@@ -33,6 +38,38 @@
 
 	onMount(load);
 
+	type IPServerPair = {
+		ip: string;
+		server: string;
+	};
+
+	let ipServerPairsByUser = $derived.by((): Record<string, IPServerPair[]> => {
+		const byUser: Record<string, IPServerPair[]> = {};
+		for (const ur of uniqueIps) {
+			const username = ur.username ?? '';
+			if (!username) continue;
+
+			// Дедупликация по ключу `${ip}|${server}`.
+			const dedupe: Record<string, IPServerPair> = {};
+
+			for (const ipa of ur.ips ?? []) {
+				const ip = ipa.ip;
+				if (!ip) continue;
+
+				for (const server of ipa.active_on_servers ?? []) {
+					if (!server) continue;
+					const key = `${ip}|${server}`;
+					dedupe[key] = { ip, server };
+				}
+			}
+
+			const pairs = Object.values(dedupe);
+			pairs.sort((a, b) => a.ip.localeCompare(b.ip) || a.server.localeCompare(b.server));
+			byUser[username] = pairs;
+		}
+		return byUser;
+	});
+
 	function copy(text: string) {
 		void navigator.clipboard.writeText(text);
 	}
@@ -80,13 +117,16 @@
 						<Table.Head>Имя</Table.Head>
 						<Table.Head>Ссылки</Table.Head>
 						<Table.Head class="text-right">Трафик</Table.Head>
-						<Table.Head class="text-right">IP</Table.Head>
+						<Table.Head class="text-right">IP - сервер</Table.Head>
 						<Table.Head class="text-right">Квота</Table.Head>
 						<Table.Head>Истекает</Table.Head>
 					</Table.Row>
 				</Table.Header>
 				<Table.Body>
 					{#each rows as row (row.username)}
+						{@const username = row.username ?? ''}
+						{@const pairs = ipServerPairsByUser[username] ?? []}
+
 						<Table.Row>
 							<Table.Cell class="font-medium">
 								<a href="/users/{encodeURIComponent(row.username ?? '')}" class="text-primary hover:underline">
@@ -111,9 +151,13 @@
 							</Table.Cell>
 							<Table.Cell class="text-right tabular-nums">{formatMiB(row.total_megabytes ?? 0)}</Table.Cell>
 							<Table.Cell class="text-right text-sm tabular-nums">
-								{row.active_unique_ips ?? 0}
-								{#if row.max_unique_ips != null}
-									<span class="text-muted-foreground"> / {row.max_unique_ips}</span>
+								{#if (row.active_unique_ips ?? 0) > 0}
+									{row.active_unique_ips}
+									{#if row.max_unique_ips != null}
+										<span class="text-muted-foreground"> / {row.max_unique_ips}</span>
+									{/if}
+								{:else}
+									—
 								{/if}
 							</Table.Cell>
 							<Table.Cell class="text-right text-sm">
@@ -125,6 +169,19 @@
 									: '—'}
 							</Table.Cell>
 						</Table.Row>
+
+						{#if pairs.length > 0}
+							{#each pairs as pair (pair.ip + '|' + pair.server)}
+								<Table.Row>
+									<Table.Cell>&nbsp;</Table.Cell>
+									<Table.Cell>&nbsp;</Table.Cell>
+									<Table.Cell>&nbsp;</Table.Cell>
+									<Table.Cell class="text-right text-sm font-mono">{pair.ip} - {pair.server}</Table.Cell>
+									<Table.Cell>&nbsp;</Table.Cell>
+									<Table.Cell>&nbsp;</Table.Cell>
+								</Table.Row>
+							{/each}
+						{/if}
 					{/each}
 				</Table.Body>
 			</Table.Root>