feat(admin-ui): update count style and url param

GluuFederation · Aug 4, 2022 · 8134ce9 · 8134ce9
1 parent 28bf678
commit 8134ce9
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 11 deletions.
diff --git a/admin-ui/plugins/auth-server/components/Clients/ClientListPage.js b/admin-ui/plugins/auth-server/components/Clients/ClientListPage.js
@@ -52,7 +52,7 @@ function ClientListPage({ clients, permissions, scopes, loading, dispatch }) {
   const themeColors = getThemeColor(selectedTheme)
   const bgThemeColor = { background: themeColors.background }
   const [scopeClients, setScopeClients] = useState()
-  const [haveINUMParam] = useState(search.indexOf('?inum=') > -1)
+  const [haveScopeINUMParam] = useState(search.indexOf('?scopeInum=') > -1)
 
   SetTitle(t('titles.oidc_clients'))
 
@@ -133,11 +133,11 @@ function ClientListPage({ clients, permissions, scopes, loading, dispatch }) {
   ]
 
   useEffect(() => {
-    if (haveINUMParam) {
-      const inumParam = search.replace('?inum=', '')
+    if (haveScopeINUMParam) {
+      const scopeInumParam = search.replace('?scopeInum=', '')
 
-      if (inumParam.length > 0) {
-        const clientsScope = scopes.find(({ inum }) => inum === inumParam)?.clients || []
+      if (scopeInumParam.length > 0) {
+        const clientsScope = scopes.find(({ inum }) => inum === scopeInumParam)?.clients || []
         setScopeClients(clientsScope)
       }
     } else {
@@ -148,7 +148,7 @@ function ClientListPage({ clients, permissions, scopes, loading, dispatch }) {
       buildPayload(userAction, '', options)
       dispatch(getScopes(userAction))
     }
-  }, [haveINUMParam])
+  }, [haveScopeINUMParam])
 
   function handleOptionsChange(event) {
     if (event.target.name == 'limit') {
@@ -283,7 +283,7 @@ function ClientListPage({ clients, permissions, scopes, loading, dispatch }) {
               Container: (props) => <Paper {...props} elevation={0} />,
             }}
             columns={tableColumns}
-            data={haveINUMParam ? scopeClients : clients}
+            data={haveScopeINUMParam ? scopeClients : clients}
             isLoading={loading}
             title=""
             actions={myActions}

diff --git a/admin-ui/plugins/auth-server/components/Scopes/ScopeListPage.js b/admin-ui/plugins/auth-server/components/Scopes/ScopeListPage.js
@@ -65,15 +65,27 @@ function ScopeListPage({ scopes, permissions, loading, dispatch }) {
   const tableColumns = [
     { title: `${t('fields.id')}`, field: 'id' },
     {
-      title: `${t('fields.openid')}`,
+      title: `${t('menus.clients')}`,
       field: 'dn',
       render: (rowData) => {
         if (!rowData.clients) {
-          return 0
+          return (
+            <Badge
+              color={`primary-${selectedTheme}`}
+              role={'button'}
+            >
+              0
+            </Badge>
+          )
         }
         return (
-          <Link to={`/auth-server/clients?inum=${rowData.inum}`} style={{ color: '#3f51b5' }}>
-            {rowData.clients?.length}
+          <Link to={`/auth-server/clients?scopeInum=${rowData.inum}`} style={{ color: '#3f51b5', textDecoration: 'underline' }}>
+            <Badge
+              color={`primary-${selectedTheme}`}
+              role={'button'}
+            >
+              {rowData.clients?.length}
+            </Badge>
           </Link>
         )
       },