chore(ui): simplify UserRole component

ui/src/admin/components/UserRow.tsx

@@ -1,4 +1,4 @@
-import React, {PureComponent} from 'react'
+import React from 'react'
 
 import UserPermissionsDropdown from 'src/admin/components/UserPermissionsDropdown'
 import UserRoleDropdown from 'src/admin/components/UserRoleDropdown'
@@ -6,7 +6,6 @@ import {USERS_TABLE} from 'src/admin/constants/tableSizing'
 
 import UserRowEdit from 'src/admin/components/UserRowEdit'
 import {User, UserPermission} from 'src/types/influxAdmin'
-import {ErrorHandling} from 'src/shared/decorators/errors'
 import {Link} from 'react-router'
 
 const ADMIN_STYLES = [
@@ -51,7 +50,7 @@ const OssUserDBPermissions = ({user}: {user: User}) => (
   </>
 )
 
-interface UserRowProps {
+interface Props {
   user: User
   allRoles: any[]
   allPermissions: string[]
@@ -66,10 +65,7 @@ interface UserRowProps {
   onUpdateRoles: (user: User, roles: any[]) => void
 }
 
-@ErrorHandling
+const UserRow = ({
-class UserRow extends PureComponent<UserRowProps> {
-  public render() {
-    const {
   user,
   allRoles,
   allPermissions,
@@ -82,8 +78,7 @@ class UserRow extends PureComponent<UserRowProps> {
   onCancel,
   onUpdatePermissions,
   onUpdateRoles,
-    } = this.props
+}: Props) => {
-
   if (isEditing) {
     return (
       <UserRowEdit
@@ -123,7 +118,7 @@ class UserRow extends PureComponent<UserRowProps> {
         </td>
       )}
       <td>
-          {this.hasPermissions ? (
+        {hasRoles ? (
           <UserPermissionsDropdown
             user={user}
             allPermissions={allPermissions}
@@ -137,10 +132,4 @@ class UserRow extends PureComponent<UserRowProps> {
   )
 }
 
-  private get hasPermissions() {
-    const {allPermissions, hasRoles} = this.props
-    return hasRoles && allPermissions && !!allPermissions.length
-  }
-}
-
 export default UserRow