From 87f186a61d3f57c7d298f20a772d6f288018cbef Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 7 Nov 2017 00:46:36 -0800 Subject: [PATCH 1/7] Create skeleton for Purgatory page --- ui/src/auth/Purgatory.js | 28 ++++++++++++++++++++++++++++ ui/src/auth/index.js | 10 +++++++++- ui/src/index.js | 8 +++++++- ui/src/style/pages/auth-page.scss | 29 +++++++++++++++++++++++++++-- 4 files changed, 71 insertions(+), 4 deletions(-) create mode 100644 ui/src/auth/Purgatory.js diff --git a/ui/src/auth/Purgatory.js b/ui/src/auth/Purgatory.js new file mode 100644 index 0000000000..ff892687ea --- /dev/null +++ b/ui/src/auth/Purgatory.js @@ -0,0 +1,28 @@ +import React from 'react' + +const Purgatory = () => { + return ( +
+
+
+
+
+

+ Logged in to [ORGNAME] +

+

+ You have not been assigned a Role yet
Contact your + Administrator for assistance +

+
+
+

+ Made by InfluxData +

+
+
+
+ ) +} + +export default Purgatory diff --git a/ui/src/auth/index.js b/ui/src/auth/index.js index 0b9eb546a7..9239661bea 100644 --- a/ui/src/auth/index.js +++ b/ui/src/auth/index.js @@ -1,7 +1,15 @@ import Login from './Login' +import Purgatory from './Purgatory' + import { UserIsAuthenticated, Authenticated, UserIsNotAuthenticated, } from './Authenticated' -export {Login, UserIsAuthenticated, Authenticated, UserIsNotAuthenticated} +export { + Login, + Purgatory, + UserIsAuthenticated, + Authenticated, + UserIsNotAuthenticated, +} diff --git a/ui/src/index.js b/ui/src/index.js index 5f3cb6d072..09227471af 100644 --- a/ui/src/index.js +++ b/ui/src/index.js @@ -11,7 +11,12 @@ import configureStore from 'src/store/configureStore' import {loadLocalStorage} from 'src/localStorage' import App from 'src/App' -import {Login, UserIsAuthenticated, UserIsNotAuthenticated} from 'src/auth' +import { + Login, + UserIsAuthenticated, + UserIsNotAuthenticated, + Purgatory, +} from 'src/auth' import CheckSources from 'src/CheckSources' import {StatusPage} from 'src/status' import {HostsPage, HostPage} from 'src/hosts' @@ -137,6 +142,7 @@ const Root = React.createClass({ + h3 { + white-space: nowrap; + } + > p { + text-align: center; } } From 2cdb22043a85ff4825d102430223f45bd540f40d Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 7 Nov 2017 22:33:18 -0800 Subject: [PATCH 2/7] Redirect lost souls to purgatory not limbo --- ui/src/CheckSources.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/ui/src/CheckSources.js b/ui/src/CheckSources.js index d17a6f71d1..d8cdd0fbb6 100644 --- a/ui/src/CheckSources.js +++ b/ui/src/CheckSources.js @@ -106,8 +106,8 @@ const CheckSources = React.createClass({ const restString = rest === null ? DEFAULT_HOME_PAGE : rest[1] if (isUsingAuth && me.role === MEMBER_ROLE) { - // if you're a member, go to limbo. - return router.push('/limbo') + // if you're a member, go to purgatory. + return router.push('/purgatory') } if (isUsingAuth && me.role === VIEWER_ROLE) { @@ -116,8 +116,8 @@ const CheckSources = React.createClass({ } else if (sources[0]) { return router.push(`/sources/${sources[0].id}/${restString}`) } - // if you're a viewer and there are no sources, go to limbo. - return router.push('/limbo') + // if you're a viewer and there are no sources, go to purgatory. + return router.push('/purgatory') } // if you're an editor or not using auth, try for sources or otherwise From 0716e5e53cfb4d0e0624124cde2b6d451f2545ac Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 7 Nov 2017 22:40:59 -0800 Subject: [PATCH 3/7] Wire up Purgatory page --- ui/src/auth/Purgatory.js | 22 ++++++++++++++++++---- 1 file changed, 18 insertions(+), 4 deletions(-) diff --git a/ui/src/auth/Purgatory.js b/ui/src/auth/Purgatory.js index ff892687ea..eaf65573c5 100644 --- a/ui/src/auth/Purgatory.js +++ b/ui/src/auth/Purgatory.js @@ -1,6 +1,7 @@ -import React from 'react' +import React, {PropTypes} from 'react' +import {connect} from 'react-redux' -const Purgatory = () => { +const Purgatory = ({currentOrganization}) => { return (
@@ -8,7 +9,7 @@ const Purgatory = () => {

- Logged in to [ORGNAME] + Logged in to {currentOrganization.name}

You have not been assigned a Role yet
Contact your @@ -25,4 +26,17 @@ const Purgatory = () => { ) } -export default Purgatory +const {shape, string} = PropTypes + +Purgatory.propTypes = { + currentOrganization: shape({ + id: string.isRequired, + name: string.isRequired, + }).isRequired, +} + +const mapStateToProps = ({auth: {me: {currentOrganization}}}) => ({ + currentOrganization, +}) + +export default connect(mapStateToProps)(Purgatory) From 145b1e267a4dcfdd1cd7433a33e890fc30bf82e3 Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 7 Nov 2017 22:41:29 -0800 Subject: [PATCH 4/7] Require user authentication to route to Purgatory --- ui/src/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/src/index.js b/ui/src/index.js index 09227471af..4c478c3731 100644 --- a/ui/src/index.js +++ b/ui/src/index.js @@ -142,7 +142,7 @@ const Root = React.createClass({ - + Date: Tue, 7 Nov 2017 22:50:37 -0800 Subject: [PATCH 5/7] Guard against Purgatory redirect until currentOrganization has loaded --- ui/src/CheckSources.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/ui/src/CheckSources.js b/ui/src/CheckSources.js index d8cdd0fbb6..3d1838d64b 100644 --- a/ui/src/CheckSources.js +++ b/ui/src/CheckSources.js @@ -47,6 +47,10 @@ const CheckSources = React.createClass({ auth: shape({ isUsingAuth: bool, me: shape(), + currentOrganization: shape({ + name: string.isRequired, + id: string.isRequired, + }), }), }, @@ -142,7 +146,11 @@ const CheckSources = React.createClass({ }, render() { - const {params, sources, auth: {isUsingAuth, me}} = this.props + const { + params, + sources, + auth: {isUsingAuth, me, currentOrganization}, + } = this.props const {isFetching} = this.state const source = sources.find(s => s.id === params.sourceID) @@ -150,7 +158,8 @@ const CheckSources = React.createClass({ isFetching || !source || typeof isUsingAuth !== 'boolean' || - (me && me.role === undefined) // TODO: not sure this happens + (me && me.role === undefined) || // TODO: not sure this happens + !currentOrganization ) { return

} From a658af21f50dbb8512c6bed37a116db489085879 Mon Sep 17 00:00:00 2001 From: Jared Scheib Date: Tue, 7 Nov 2017 23:05:46 -0800 Subject: [PATCH 6/7] Improve copy in Purgatory page Signed-off-by: Alex Paxton --- ui/src/auth/Purgatory.js | 54 ++++++++++++++++++++++++---------------- 1 file changed, 32 insertions(+), 22 deletions(-) diff --git a/ui/src/auth/Purgatory.js b/ui/src/auth/Purgatory.js index eaf65573c5..e2345afca8 100644 --- a/ui/src/auth/Purgatory.js +++ b/ui/src/auth/Purgatory.js @@ -1,30 +1,38 @@ import React, {PropTypes} from 'react' import {connect} from 'react-redux' -const Purgatory = ({currentOrganization}) => { - return ( -
-
-
-
-
-

- Logged in to {currentOrganization.name} -

-

- You have not been assigned a Role yet
Contact your - Administrator for assistance -

-
+import {MEMBER_ROLE} from 'src/auth/Authorized' + +const memberCopy = ( +

This role does not grant you sufficient permissions to view Chronograf.

+) +const viewerCopy = ( +

+ This organization does not have any configured sources
and your role + does not have permission to configure a source. +

+) + +const Purgatory = ({currentOrganization, role}) => +
+
+
+
+
+

+ Logged in to {currentOrganization.name} as a{' '} + {role}. +

+ {role === MEMBER_ROLE ? memberCopy : viewerCopy} +

Contact your Administrator for assistance.

-

- Made by InfluxData -

-
+

+ Made by InfluxData +

+
- ) -} +
const {shape, string} = PropTypes @@ -33,10 +41,12 @@ Purgatory.propTypes = { id: string.isRequired, name: string.isRequired, }).isRequired, + role: string.isRequired, } -const mapStateToProps = ({auth: {me: {currentOrganization}}}) => ({ +const mapStateToProps = ({auth: {me: {currentOrganization, role}}}) => ({ currentOrganization, + role, }) export default connect(mapStateToProps)(Purgatory) From 32ca775b7582ba02c32f59c3064cd894ebb58571 Mon Sep 17 00:00:00 2001 From: Alex Paxton Date: Tue, 7 Nov 2017 23:14:28 -0800 Subject: [PATCH 7/7] Render username, provider, and scheme in Purgatory to assist user Signed-off-by: Jared Scheib --- ui/src/auth/Purgatory.js | 22 ++++++++++++++++++++-- ui/src/style/pages/auth-page.scss | 6 +++++- 2 files changed, 25 insertions(+), 3 deletions(-) diff --git a/ui/src/auth/Purgatory.js b/ui/src/auth/Purgatory.js index e2345afca8..14774a9feb 100644 --- a/ui/src/auth/Purgatory.js +++ b/ui/src/auth/Purgatory.js @@ -13,7 +13,7 @@ const viewerCopy = (

) -const Purgatory = ({currentOrganization, role}) => +const Purgatory = ({name, provider, scheme, currentOrganization, role}) =>
@@ -25,6 +25,16 @@ const Purgatory = ({currentOrganization, role}) => {role === MEMBER_ROLE ? memberCopy : viewerCopy}

Contact your Administrator for assistance.

+
+ 
+            
+              username: {name}
+              

+              provider: {provider}
+              

+              scheme: {scheme}
+            
+

@@ -37,6 +47,9 @@ const Purgatory = ({currentOrganization, role}) => const {shape, string} = PropTypes Purgatory.propTypes = { + name: string.isRequired, + provider: string.isRequired, + scheme: string.isRequired, currentOrganization: shape({ id: string.isRequired, name: string.isRequired, @@ -44,7 +57,12 @@ Purgatory.propTypes = { role: string.isRequired, } -const mapStateToProps = ({auth: {me: {currentOrganization, role}}}) => ({ +const mapStateToProps = ({ + auth: {me: {name, provider, scheme, currentOrganization, role}}, +}) => ({ + name, + provider, + scheme, currentOrganization, role, }) diff --git a/ui/src/style/pages/auth-page.scss b/ui/src/style/pages/auth-page.scss index 52634399fb..e34d97f537 100644 --- a/ui/src/style/pages/auth-page.scss +++ b/ui/src/style/pages/auth-page.scss @@ -92,7 +92,7 @@ min-width: 400px; background-color: $g3-castle; border-radius: 4px; - height: 200px; + min-height: 200px; padding: 30px; display: flex; flex-direction: column; @@ -105,4 +105,8 @@ > p { text-align: center; } + + hr { + width: 100%; + } }