add user status to details and grid

Author: rdonigian

src/common/fragments/user.graphql

@@ -54,6 +54,11 @@ fragment DisplayUser on User {
     canEdit
     value
   }
+  status {
+    canRead
+    canEdit
+    value
+  }
   fullName
   timezone {
     canRead

src/components/UserDataGrid/UserColumns.tsx

@@ -4,9 +4,15 @@ import {
   GridToolbarColumnsButton,
   GridToolbarFilterButton,
 } from '@mui/x-data-grid-pro';
-import { RoleLabels, RoleList } from '~/api/schema.graphql';
+import {
+  RoleLabels,
+  RoleList,
+  UserStatusLabels,
+  UserStatusList,
+} from '~/api/schema.graphql';
 import {
   booleanColumn,
+  enumColumn,
   getInitialVisibility,
   multiEnumColumn,
   QuickFilterButton,
@@ -43,6 +49,12 @@ export const UserColumns: Array<GridColDef<User>> = [
       return roles.value;
     },
   },
+  {
+    headerName: 'Status',
+    field: 'status',
+    ...enumColumn(UserStatusList, UserStatusLabels),
+    valueGetter: (_, row) => row.status.value,
+  },
   {
     headerName: 'Pinned',
     field: 'pinned',

src/components/UserDataGrid/userDataGridRow.graphql

@@ -10,5 +10,8 @@ fragment userDataGridRow on User {
   email {
     value
   }
+  status {
+    value
+  }
   ...TogglePin
 }

src/scenes/Users/Detail/UserDetail.tsx

@@ -96,6 +96,11 @@ export const UserDetail = () => {
             <ToggleCommentsButton loading={!user} />
             <ImpersonationToggle user={user} />
           </Box>
+          <DisplayProperty
+            label="Status"
+            value={user?.status.value}
+            loading={!user}
+          />
           <DisplayProperty
             label="Email"
             value={user?.email.value}

src/scenes/Users/Edit/EditUser.tsx

@@ -30,6 +30,7 @@ export const EditUser = (props: EditUserProps) => {
               email: user.email.value,
               title: user.title.value,
               roles: user.roles.value,
+              status: user.status.value,
             },
           }
         : undefined,

src/scenes/Users/UserForm/UserForm.tsx

@@ -1,14 +1,19 @@
 import { Stack } from '@mui/material';
 import { memoize } from 'lodash';
 import { SetRequired } from 'type-fest';
-import { RoleLabels } from '~/api/schema.graphql';
+import {
+  RoleLabels,
+  UserStatusLabels,
+  UserStatusList,
+} from '~/api/schema.graphql';
 import { labelFrom } from '~/common';
 import {
   DialogForm,
   DialogFormProps,
 } from '../../../components/Dialog/DialogForm';
 import {
   EmailField,
+  EnumField,
   matchFieldIfSame,
   SecuredField,
   SubmitError,
@@ -91,6 +96,16 @@ export const UserForm = <T, R = void>({
             )}
           </SecuredField>
         </Stack>
+        <SecuredField obj={user} name="status">
+          {(props) => (
+            <EnumField
+              label="Status"
+              options={UserStatusList}
+              getLabel={(value) => UserStatusLabels[value]}
+              {...props}
+            />
+          )}
+        </SecuredField>
         <SecuredField obj={user} name="email">
           {(props) => <EmailField {...props} required={false} />}
         </SecuredField>