From 4c91cc7c6f59b1eee44dcf1d4e1c2eab96d879a2 Mon Sep 17 00:00:00 2001
From: Abhishek Kumar <abhishek.mrt22@gmail.com>
Date: Wed, 6 Dec 2023 16:29:15 +0530
Subject: [PATCH] ui: change ipaddress tab label for shared networks (#8305)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In UI, shared network IP addresses are shown in a tab named Public IP addresses inside the network view.

Public IP addresses have their own subsection in the UI. Network → Public IP address. Shared network IP addresses are not shown in this view.

This is confusing for users and Public IP addresses tab in the network view has been renamed as IP addresses for a shared network.

Signed-off-by: Abhishek Kumar <abhishek.mrt22@gmail.com>
---
 ui/public/locales/en.json               | 1 +
 ui/src/components/view/ResourceView.vue | 8 +++++++-
 ui/src/config/section/network.js        | 2 +-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/ui/public/locales/en.json b/ui/public/locales/en.json
index d1f0d84e7552..69a794079b54 100644
--- a/ui/public/locales/en.json
+++ b/ui/public/locales/en.json
@@ -1030,6 +1030,7 @@
 "label.ipv6.dns1": "IPv6 DNS1",
 "label.ipv6.dns2": "IPv6 DNS2",
 "label.ipv6.subnets": "IPv6 Subnets",
+"label.ip.addresses": "IP Addresses",
 "label.iqn": "Target IQN",
 "label.is.in.progress": "is in progress",
 "label.is.shared": "Is shared",
diff --git a/ui/src/components/view/ResourceView.vue b/ui/src/components/view/ResourceView.vue
index 8ff0dcb8f55d..a919005d427a 100644
--- a/ui/src/components/view/ResourceView.vue
+++ b/ui/src/components/view/ResourceView.vue
@@ -44,7 +44,7 @@
           <template v-for="tab in tabs" :key="tab.name">
             <a-tab-pane
               :key="tab.name"
-              :tab="$t('label.' + tab.name)"
+              :tab="$t('label.' + tabName(tab))"
               v-if="showTab(tab)">
               <keep-alive>
                 <component
@@ -158,6 +158,12 @@ export default {
       )
       this.$emit('onTabChange', key)
     },
+    tabName (tab) {
+      if (typeof tab.name === 'function') {
+        return tab.name(this.resource)
+      }
+      return tab.name
+    },
     showTab (tab) {
       if (this.networkService && this.networkService.service && tab.networkServiceFilter) {
         return tab.networkServiceFilter(this.networkService.service)
diff --git a/ui/src/config/section/network.js b/ui/src/config/section/network.js
index 3105798b0a48..f92327141ab2 100644
--- a/ui/src/config/section/network.js
+++ b/ui/src/config/section/network.js
@@ -65,7 +65,7 @@ export default {
         component: shallowRef(defineAsyncComponent(() => import('@/views/network/Ipv6FirewallRulesTab.vue'))),
         show: (record, route, user) => { return record.type === 'Isolated' && ['IPv6', 'DualStack'].includes(record.internetprotocol) && !('vpcid' in record) && 'listIpv6FirewallRules' in store.getters.apis && (['Admin', 'DomainAdmin'].includes(user.roletype) || record.account === user.account || record.projectid) }
       }, {
-        name: 'public.ip.addresses',
+        name: (record) => { return record.type === 'Shared' ? 'ip.addresses' : 'public.ip.addresses' },
         component: shallowRef(defineAsyncComponent(() => import('@/views/network/IpAddressesTab.vue'))),
         show: (record, route, user) => { return 'listPublicIpAddresses' in store.getters.apis && (record.type === 'Shared' || (record.type === 'Isolated' && !('vpcid' in record) && (['Admin', 'DomainAdmin'].includes(user.roletype) || record.account === user.account || record.projectid))) }
       }, {