Merge pull request #1601 from bcgov/feat/daniel-new-renderer-1546

feat: Add nice renderer for login status
bcgov · Jan 4, 2025 · 6049bb1 · 6049bb1
2 parents 26b0bbb + 327c2c3
commit 6049bb1
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 19 deletions.
diff --git a/frontend/src/utils/grid/cellRenderers.jsx b/frontend/src/utils/grid/cellRenderers.jsx
@@ -65,6 +65,35 @@ export const StatusRenderer = (props) => {
   )
 }
 
+export const LoginStatusRenderer = (props) => {
+  return (
+    <BCBox
+      component={props.isView ? 'span' : 'div'}
+      mt={1}
+      sx={{ width: '100%', height: '100%' }}
+    >
+      <BCBadge
+        badgeContent={props.data.isLoginSuccessful ? 'True' : 'False'}
+        color={props.data.isLoginSuccessful ? 'success' : 'error'}
+        variant="gradient"
+        size="md"
+        sx={{
+          ...(!props.isView
+            ? { display: 'flex', justifyContent: 'center' }
+            : {}),
+          '& .MuiBadge-badge': {
+            minWidth: '120px',
+            fontWeight: 'regular',
+            textTransform: 'capitalize',
+            fontSize: '0.875rem',
+            padding: '0.4em 0.6em'
+          }
+        }}
+      />
+    </BCBox>
+  )
+}
+
 export const OrgStatusRenderer = (props) => {
   const location = useLocation()
   const statusArr = getAllOrganizationStatuses()

diff --git a/frontend/src/views/Admin/AdminMenu/components/UserLoginHistory.jsx b/frontend/src/views/Admin/AdminMenu/components/UserLoginHistory.jsx
@@ -10,7 +10,7 @@ export const UserLoginHistory = () => {
   const { t } = useTranslation(['common', 'admin'])
 
   const getRowId = useCallback((params) => {
-    return params.data.userLoginHistoryId
+    return params.data.userLoginHistoryId.toString()
   }, [])
 
   return (

diff --git a/frontend/src/views/Admin/AdminMenu/components/_schema.js b/frontend/src/views/Admin/AdminMenu/components/_schema.js
@@ -5,6 +5,7 @@ import {
 } from '@/utils/formatters'
 import {
   LinkRenderer,
+  LoginStatusRenderer,
   RoleRenderer,
   StatusRenderer
 } from '@/utils/grid/cellRenderers'
@@ -113,15 +114,6 @@ export const usersColumnDefs = (t) => [
   }
 ]
 
-export const usersDefaultColDef = {
-  resizable: true,
-  sortable: true,
-  filter: true,
-  minWidth: 300,
-  floatingFilter: true, // enables the filter boxes under the header label
-  suppressHeaderMenuButton: true // suppresses the menu button appearing next to the Header Label
-}
-
 export const idirUserDefaultFilter = [
   { filterType: 'text', type: 'blank', field: 'organizationId', filter: '' }
 ]
@@ -175,28 +167,24 @@ export const userLoginHistoryColDefs = (t) => [
   },
   {
     field: 'keycloakEmail',
-    headerName: t('admin:userLoginHistoryColLabels.keycloakEmail'),
-    cellDataType: 'string'
+    headerName: t('admin:userLoginHistoryColLabels.keycloakEmail')
   },
   {
     field: 'keycloakUserId',
-    headerName: t('admin:userLoginHistoryColLabels.keycloakUserId'),
-    cellDataType: 'string'
+    headerName: t('admin:userLoginHistoryColLabels.keycloakUserId')
   },
   {
     field: 'externalUsername',
-    headerName: t('admin:userLoginHistoryColLabels.externalUsername'),
-    cellDataType: 'string'
+    headerName: t('admin:userLoginHistoryColLabels.externalUsername')
   },
   {
     field: 'isLoginSuccessful',
     headerName: t('admin:userLoginHistoryColLabels.isLoginSuccessful'),
-    cellDataType: 'boolean'
+    cellRenderer: LoginStatusRenderer
   },
   {
     field: 'loginErrorMessage',
-    headerName: t('admin:userLoginHistoryColLabels.loginErrorMessage'),
-    cellDataType: 'string'
+    headerName: t('admin:userLoginHistoryColLabels.loginErrorMessage')
   },
   {
     field: 'createDate',