add UI support for filtering users by source

Author: bernardodemarco

ui/public/locales/en.json

@@ -1320,6 +1320,7 @@
 "label.lbprovider": "Load balancer provider",
 "label.lbruleid": "Load balancer ID",
 "label.lbtype": "Load balancer type",
+"label.ldap": "LDAP",
 "label.ldap.configuration": "LDAP configuration",
 "label.ldap.group.name": "LDAP group",
 "label.level": "Level",
@@ -1487,6 +1488,7 @@
 "label.name": "Name",
 "label.name.optional": "Name (Optional)",
 "label.nat": "BigSwitch BCF NAT enabled",
+"label.native": "Native",
 "label.ncc": "NCC",
 "label.netmask": "Netmask",
 "label.netscaler": "NetScaler",
@@ -1984,7 +1986,9 @@
 "label.s3.secret.key": "Secret key",
 "label.s3.socket.timeout": "Socket timeout",
 "label.s3.use.https": "Use HTTPS",
+"label.saml": "SAML",
 "label.saml.disable": "SAML disable",
+"label.saml.disabled": "SAML Disabled",
 "label.saml.enable": "SAML enable",
 "label.samlenable": "Authorize SAML SSO",
 "label.samlentity": "Identity provider",

ui/src/components/view/DetailsTab.vue

@@ -124,6 +124,9 @@
               </div>
             </div>
           </div>
+          <div v-else-if="item === 'usersource'">
+            {{ $t(getUserSourceLabel(dataResource[item])) }}
+          </div>
           <div v-else>{{ dataResource[item] }}</div>
         </div>
       </a-list-item>
@@ -406,6 +409,15 @@ export default {
       })
 
       return resources
+    },
+    getUserSourceLabel (source) {
+      if (source === 'saml2') {
+        source = 'saml'
+      } else if (source === 'saml2disabled') {
+        source = 'saml.disabled'
+      }
+
+      return `label.${source}`
     }
   }
 }

ui/src/components/view/SearchView.vue

@@ -306,7 +306,8 @@ export default {
         }
         if (['zoneid', 'domainid', 'imagestoreid', 'storageid', 'state', 'account', 'hypervisor', 'level',
           'clusterid', 'podid', 'groupid', 'entitytype', 'accounttype', 'systemvmtype', 'scope', 'provider',
-          'type', 'scope', 'managementserverid', 'serviceofferingid', 'diskofferingid', 'networkid', 'usagetype', 'restartrequired', 'guestiptype'].includes(item)
+          'type', 'scope', 'managementserverid', 'serviceofferingid', 'diskofferingid', 'networkid',
+          'usagetype', 'restartrequired', 'guestiptype', 'usersource'].includes(item)
         ) {
           type = 'list'
         } else if (item === 'tags') {
@@ -435,6 +436,13 @@ export default {
         ]
         this.fields[apiKeyAccessIndex].loading = false
       }
+
+      if (arrayField.includes('usersource')) {
+        const userSourceIndex = this.fields.findIndex(item => item.name === 'usersource')
+        this.fields[userSourceIndex].loading = true
+        this.fields[userSourceIndex].opts = this.fetchAvailableUserSourceTypes()
+        this.fields[userSourceIndex].loading = false
+      }
     },
     async fetchDynamicFieldData (arrayField, searchKeyword) {
       const promises = []
@@ -1294,6 +1302,26 @@ export default {
           })
       })
     },
+    fetchAvailableUserSourceTypes () {
+      return [
+        {
+          id: 'native',
+          name: 'label.native'
+        },
+        {
+          id: 'saml2',
+          name: 'label.saml'
+        },
+        {
+          id: 'saml2disabled',
+          name: 'label.saml.disabled'
+        },
+        {
+          id: 'ldap',
+          name: 'label.ldap'
+        }
+      ]
+    },
     onSearch (value) {
       this.paramsFilter = {}
       this.searchQuery = value

ui/src/config/section/user.js

@@ -17,6 +17,7 @@
 
 import { shallowRef, defineAsyncComponent } from 'vue'
 import store from '@/store'
+import { i18n } from '@/locales'
 
 export default {
   name: 'accountuser',
@@ -26,13 +27,31 @@ export default {
   hidden: true,
   permission: ['listUsers'],
   searchFilters: () => {
-    var filters = []
+    const filters = ['usersource']
     if (store.getters.userInfo.roletype === 'Admin') {
       filters.push('apikeyaccess')
     }
     return filters
   },
-  columns: ['username', 'state', 'firstname', 'lastname', 'email', 'account', 'domain'],
+  columns: [
+    'username', 'state', 'firstname', 'lastname',
+    'email', 'account', 'domain',
+    {
+      field: 'userSource',
+      customTitle: 'userSource',
+      userSource: (record) => {
+        let { usersource: source } = record
+
+        if (source === 'saml2') {
+          source = 'saml'
+        } else if (source === 'saml2disabled') {
+          source = 'saml.disabled'
+        }
+
+        return i18n.global.t(`label.${source}`)
+      }
+    }
+  ],
   details: ['username', 'id', 'firstname', 'lastname', 'email', 'usersource', 'timezone', 'rolename', 'roletype', 'is2faenabled', 'account', 'domain', 'created'],
   tabs: [
     {