From ff021b6861b733b92377a3313a3f7cd3286697ba Mon Sep 17 00:00:00 2001
From: Bernd Storath <999999bst@gmail.com>
Date: Fri, 25 Jul 2025 11:52:32 +0200
Subject: [PATCH] show client endpoint

---
 src/app/components/Form/InfoField.vue         | 21 +++++++++++++++++++
 src/app/pages/clients/[id].vue                |  6 ++++++
 src/i18n/locales/en.json                      |  5 ++++-
 src/server/api/client/[clientId]/index.get.ts | 14 ++++++++++++-
 src/server/utils/WireGuard.ts                 | 11 ++++++++++
 5 files changed, 55 insertions(+), 2 deletions(-)
 create mode 100644 src/app/components/Form/InfoField.vue

diff --git a/src/app/components/Form/InfoField.vue b/src/app/components/Form/InfoField.vue
new file mode 100644
index 00000000..0bec3ee0
--- /dev/null
+++ b/src/app/components/Form/InfoField.vue
@@ -0,0 +1,21 @@
+<template>
+  <div class="flex items-center">
+    <FormLabel :for="id">
+      {{ label }}
+    </FormLabel>
+    <BaseTooltip v-if="description" :text="description">
+      <IconsInfo class="size-4" />
+    </BaseTooltip>
+  </div>
+  <span :id="id">{{ data }}</span>
+</template>
+
+<script lang="ts" setup>
+defineProps<{
+  id: string;
+  label: string;
+  description?: string;
+  disabled?: boolean;
+  data?: string;
+}>();
+</script>
diff --git a/src/app/pages/clients/[id].vue b/src/app/pages/clients/[id].vue
index 70d836d6..c07e1342 100644
--- a/src/app/pages/clients/[id].vue
+++ b/src/app/pages/clients/[id].vue
@@ -39,6 +39,12 @@
               v-model="data.ipv6Address"
               label="IPv6"
             />
+            <FormInfoField
+              id="endpoint"
+              :data="data.endpoint ?? $t('client.notConnected')"
+              :label="$t('client.endpoint')"
+              :description="$t('client.endpointDesc')"
+            />
           </FormGroup>
           <FormGroup>
             <FormHeading :description="$t('client.allowedIpsDesc')">
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index 060f4f91..73dba722 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -113,7 +113,10 @@
     "hooks": "Hooks",
     "hooksDescription": "Hooks only work with wg-quick",
     "hooksLeaveEmpty": "Only for wg-quick. Otherwise, leave it empty",
-    "dnsDesc": "DNS server clients will use (overrides global config)"
+    "dnsDesc": "DNS server clients will use (overrides global config)",
+    "notConnected": "Client not connected",
+    "endpoint": "Endpoint",
+    "endpointDesc": "IP of the client from which the WireGuard connection is established"
   },
   "dialog": {
     "change": "Change",
diff --git a/src/server/api/client/[clientId]/index.get.ts b/src/server/api/client/[clientId]/index.get.ts
index 13941671..444f2b64 100644
--- a/src/server/api/client/[clientId]/index.get.ts
+++ b/src/server/api/client/[clientId]/index.get.ts
@@ -18,6 +18,18 @@ export default definePermissionEventHandler(
         statusMessage: 'Client not found',
       });
     }
-    return result;
+
+    const data = await WireGuard.dumpByPublicKey(result.publicKey);
+    if (!data) {
+      throw createError({
+        statusCode: 404,
+        statusMessage: 'Could not dump client data',
+      });
+    }
+
+    return {
+      ...result,
+      endpoint: data.endpoint,
+    };
   }
 );
diff --git a/src/server/utils/WireGuard.ts b/src/server/utils/WireGuard.ts
index 22132371..034561c4 100644
--- a/src/server/utils/WireGuard.ts
+++ b/src/server/utils/WireGuard.ts
@@ -93,6 +93,17 @@ class WireGuard {
     return clients;
   }
 
+  async dumpByPublicKey(publicKey: string) {
+    const wgInterface = await Database.interfaces.get();
+
+    const dump = await wg.dump(wgInterface.name);
+    const clientDump = dump.find(
+      ({ publicKey: dumpPublicKey }) => dumpPublicKey === publicKey
+    );
+
+    return clientDump;
+  }
+
   async getAllClients() {
     const wgInterface = await Database.interfaces.get();
     const dbClients = await Database.clients.getAllPublic();