From 52d5b271617a5d220308f1948fbf2e9142c7e9b5 Mon Sep 17 00:00:00 2001
From: Vishesh <vishesh92@gmail.com>
Date: Wed, 28 Feb 2024 16:04:03 +0530
Subject: [PATCH] UI: Add button to show public IPs associated with vlanid
 (#8717)

---
 ui/src/config/section/infra/phynetworks.js       | 5 +++++
 ui/src/views/infra/network/IpRangesTabPublic.vue | 6 ++++++
 2 files changed, 11 insertions(+)

diff --git a/ui/src/config/section/infra/phynetworks.js b/ui/src/config/section/infra/phynetworks.js
index 92d1e9abec8..578a12516fa 100644
--- a/ui/src/config/section/infra/phynetworks.js
+++ b/ui/src/config/section/infra/phynetworks.js
@@ -42,6 +42,11 @@ export default {
     name: 'guestnetwork',
     title: 'label.guest.networks',
     param: 'physicalnetworkid'
+  },
+  {
+    name: 'publicip',
+    title: 'label.public.ip.addresses',
+    param: 'physicalnetworkid'
   }],
   actions: [
     {
diff --git a/ui/src/views/infra/network/IpRangesTabPublic.vue b/ui/src/views/infra/network/IpRangesTabPublic.vue
index d7f743fda13..dc5589785ab 100644
--- a/ui/src/views/infra/network/IpRangesTabPublic.vue
+++ b/ui/src/views/infra/network/IpRangesTabPublic.vue
@@ -53,6 +53,12 @@
         <div
           class="actions"
           style="text-align: right" >
+          <router-link :to="{ name: 'publicip', query: { vlanid: record.id }}" target="_blank">
+            <tooltip-button
+              tooltipPlacement="bottom"
+              :tooltip="$t('label.view') + ' ' + $t('label.public.ip.addresses')"
+              icon="environment-outlined"/>
+          </router-link>
           <tooltip-button
             v-if="!record.domain && !basicGuestNetwork && record.gateway && !record.ip6gateway"
             tooltipPlacement="bottom"