Ensure UsersTable sub-components return a single react element

Previously was returning an array in a couple instances. Unnoticed
mishap from refactor

ui/src/admin/components/chronograf/UsersTableOrgCell.js

@@ -8,6 +8,7 @@ import {
   NO_ORG,
   NO_ROLE,
 } from 'src/admin/constants/dummyUsers'
+import {USERS_TABLE} from 'src/admin/constants/chronografTableSizing'
 
 const UsersTableOrgCell = ({
   user,
@@ -15,9 +16,12 @@ const UsersTableOrgCell = ({
   onChangeUserRole,
   onChooseFilter,
 }) => {
+  const {colOrg} = USERS_TABLE
+
   // Expects Users to always have at least 1 role (as a member of the default org)
   if (user.roles.length === 1) {
     return (
+      <td style={{width: colOrg}}>
         <Dropdown
           items={DUMMY_ORGS.filter(org => {
             return !(org.name === DEFAULT_ORG || org.name === NO_ORG)
@@ -31,11 +35,14 @@ const UsersTableOrgCell = ({
           buttonSize="btn-xs"
           className="dropdown-190"
         />
+      </td>
     )
   }
 
   if (organizationName === DEFAULT_ORG) {
-    return user.roles
+    return (
+      <td style={{width: colOrg}}>
+        {user.roles
           .filter(role => {
             return !(role.organizationName === DEFAULT_ORG)
           })
@@ -45,18 +52,23 @@ const UsersTableOrgCell = ({
                 {role.organizationName}
               </a>
             </span>
+          )}
+      </td>
     )
   }
 
   const currentOrg = user.roles.find(
     role => role.organizationName === organizationName
   )
+
   return (
+    <td style={{width: colOrg}}>
       <span className="chronograf-user--org">
         <a href="#" onClick={onChooseFilter(currentOrg.organizationName)}>
           {currentOrg.organizationName}
         </a>
       </span>
+    </td>
   )
 }
 

ui/src/admin/components/chronograf/UsersTableRoleCell.js

@@ -3,15 +3,24 @@ import React, {PropTypes} from 'react'
 import Dropdown from 'shared/components/Dropdown'
 
 import {DEFAULT_ORG, USER_ROLES} from 'src/admin/constants/dummyUsers'
+import {USERS_TABLE} from 'src/admin/constants/chronografTableSizing'
 
 const UsersTableRoleCell = ({user, organizationName, onChangeUserRole}) => {
+  const {colRole} = USERS_TABLE
+
   // User must be part of more than one organization to be able to be assigned a role
   if (user.roles.length === 1) {
-    return <span className="chronograf-user--role">N/A</span>
+    return (
+      <td style={{width: colRole}}>
+        <span className="chronograf-user--role">N/A</span>
+      </td>
+    )
   }
 
   if (organizationName === DEFAULT_ORG) {
-    return user.roles
+    return (
+      <td style={{width: colRole}}>
+        {user.roles
           .filter(role => {
             return !(role.organizationName === DEFAULT_ORG)
           })
@@ -28,6 +37,8 @@ const UsersTableRoleCell = ({user, organizationName, onChangeUserRole}) => {
               buttonSize="btn-xs"
               className="dropdown-80"
             />
+          )}
+      </td>
     )
   }
 
@@ -35,6 +46,7 @@ const UsersTableRoleCell = ({user, organizationName, onChangeUserRole}) => {
     role => role.organizationName === organizationName
   )
   return (
+    <td style={{width: colRole}}>
       <span className="chronograf-user--role">
         <Dropdown
           items={USER_ROLES.map(r => ({
@@ -48,6 +60,7 @@ const UsersTableRoleCell = ({user, organizationName, onChangeUserRole}) => {
           className="dropdown-80"
         />
       </span>
+    </td>
   )
 }
 

ui/src/admin/components/chronograf/UsersTableRow.js

@@ -14,7 +14,7 @@ const UsersTableRow = ({
   onChangeUserRole,
   onChooseFilter,
 }) => {
-  const {colOrg, colRole, colSuperAdmin, colProvider, colScheme} = USERS_TABLE
+  const {colSuperAdmin, colProvider, colScheme} = USERS_TABLE
 
   const isSelected = selectedUsers.find(u => isSameUser(user, u))
 
@@ -34,21 +34,17 @@ const UsersTableRow = ({
           {user.name}
         </strong>
       </td>
-      <td style={{width: colOrg}}>
       <UsersTableOrgCell
         user={user}
         organizationName={organizationName}
         onChangeUserRole={onChangeUserRole}
         onChooseFilter={onChooseFilter}
       />
-      </td>
-      <td style={{width: colRole}}>
       <UsersTableRoleCell
         user={user}
         organizationName={organizationName}
         onChangeUserRole={onChangeUserRole}
       />
-      </td>
       <td style={{width: colSuperAdmin}}>
         {user.superadmin ? 'Yes' : '--'}
       </td>