Notify user what role & organization they switched to

Show that notification for 4 seconds.
Change copy from 'signed in' to 'logged in'.
Remove concept of userHasRoleInOrg since now obsolete.

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

@@ -44,7 +44,6 @@ class OrganizationsTable extends Component {
       currentOrganization,
       authConfig: {superAdminNewUsers},
       onChangeAuthConfig,
-      me,
     } = this.props
     const {isCreatingOrganization} = this.state
 
@@ -93,7 +92,6 @@ class OrganizationsTable extends Component {
               onRename={onRenameOrg}
               onChooseDefaultRole={onChooseDefaultRole}
               currentOrganization={currentOrganization}
-              userHasRoleInOrg={!!me.organizations.find(o => org.id === o.id)}
             />
           )}
           <Authorized requiredRole={SUPERADMIN_ROLE}>
@@ -146,14 +144,5 @@ OrganizationsTable.propTypes = {
   authConfig: shape({
     superAdminNewUsers: bool,
   }),
-  me: shape({
-    organizations: arrayOf(
-      shape({
-        id: string.isRequired,
-        name: string.isRequired,
-        defaultRole: string.isRequired,
-      })
-    ),
-  }),
 }
 export default OrganizationsTable

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

@@ -39,19 +39,9 @@ class OrganizationsTableRow extends Component {
   }
 
   handleChangeCurrentOrganization = async () => {
-    const {
-      router,
-      links,
-      meChangeOrganization,
-      organization,
-      userHasRoleInOrg,
-    } = this.props
+    const {router, links, meChangeOrganization, organization} = this.props
 
-    await meChangeOrganization(
-      links.me,
-      {organization: organization.id},
-      {userHasRoleInOrg}
-    )
+    await meChangeOrganization(links.me, {organization: organization.id})
     router.push('')
   }
 
@@ -204,7 +194,7 @@ class OrganizationsTableRow extends Component {
   }
 }
 
-const {arrayOf, bool, func, shape, string} = PropTypes
+const {arrayOf, func, shape, string} = PropTypes
 
 OrganizationsTableRow.propTypes = {
   organization: shape({
@@ -235,7 +225,6 @@ OrganizationsTableRow.propTypes = {
     }),
   }),
   meChangeOrganization: func.isRequired,
-  userHasRoleInOrg: bool.isRequired,
 }
 
 OrganizationsTableRowDeleteButton.propTypes = {

ui/src/shared/actions/auth.js

@@ -5,6 +5,8 @@ import {linksReceived} from 'shared/actions/links'
 import {publishAutoDismissingNotification} from 'shared/dispatchers'
 import {errorThrown} from 'shared/actions/errors'
 
+import {LONG_NOTIFICATION_DISMISS_DELAY} from 'shared/constants'
+
 export const authExpired = auth => ({
   type: 'AUTH_EXPIRED',
   payload: {
@@ -84,18 +86,20 @@ export const getMeAsync = ({shouldResetMe = false} = {}) => async dispatch => {
 
 export const meChangeOrganizationAsync = (
   url,
-  organization,
-  {userHasRoleInOrg = true} = {}
+  organization
 ) => async dispatch => {
   dispatch(meChangeOrganizationRequested())
   try {
     const {data: me, auth, logoutLink} = await updateMeAJAX(url, organization)
+    const currentRole = me.roles.find(
+      r => r.organization === me.currentOrganization.id
+    )
     dispatch(
       publishAutoDismissingNotification(
         'success',
-        `Now signed in to ${me.currentOrganization.name}${userHasRoleInOrg
-          ? ''
-          : ' with Admin role.'}`
+        `Now logged in to '${me.currentOrganization
+          .name}' as '${currentRole.name}'`,
+        LONG_NOTIFICATION_DISMISS_DELAY
       )
     )
     dispatch(meChangeOrganizationCompleted())

ui/src/shared/constants/index.js

@@ -387,6 +387,7 @@ export const PRESENTATION_MODE_ANIMATION_DELAY = 0 // In milliseconds.
 export const PRESENTATION_MODE_NOTIFICATION_DELAY = 2000 // In milliseconds.
 
 export const SHORT_NOTIFICATION_DISMISS_DELAY = 2000 // in milliseconds
+export const LONG_NOTIFICATION_DISMISS_DELAY = 4000 // in milliseconds
 
 export const REVERT_STATE_DELAY = 1500 // ms
 

ui/src/sources/containers/SourcePage.js

@@ -10,6 +10,7 @@ import {
 import {publishNotification} from 'shared/actions/notifications'
 import {connect} from 'react-redux'
 
+import Notifications from 'shared/components/Notifications'
 import SourceForm from 'src/sources/components/SourceForm'
 import FancyScrollbar from 'shared/components/FancyScrollbar'
 import SourceIndicator from 'shared/components/SourceIndicator'
@@ -200,6 +201,8 @@ class SourcePage extends Component {
     }
 
     return (
+      <div>
+        <Notifications />
         <div className={`${isInitialSource ? '' : 'page'}`}>
           {isInitialSource
             ? null
@@ -237,6 +240,7 @@ class SourcePage extends Component {
             </div>
           </FancyScrollbar>
         </div>
+      </div>
     )
   }
 }