-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Connects to #102. Auth0 redirecting non-authorized users to error pag…
…e. (#115) * Updated imports that use react-redux hooks * Refactored and simplified component The logic to handle Auth0-authenticated users who are not authorized to access data has been moved to the implementation of a Auth0 rule * Refactored component to handle Auth0 callback and redirect * Removed un-needed redux action and action type * Refactored private routes implementation * Refactored component to let the privateRoute component to handle protected access * Refactored component to remove redirect workaround * Refactored component rendering * Updated Storybook component due to ErrorPage component refactoring * Formatting per eslint * Removed unnecessary export syntax * Revert to prior module import syntax * Updated default module import * Applied patch updates of dependency packages * Refactored and avoiding mixing <Route component /> with <Route render /> * Defining defaultProps * Reverting to previous Redux implementation to avoid creating separate Redux store in Storybook component * Removed Redux store configs * Minor styling tweak * Redirect authorized users to dashboard instead of returning them to previous page when they try to load this error page The useHistory hook conflicts with the 'history' argument used in main app test suite and causes the tests to fail. * Refactored UI handling while fetching is still in progress
- Loading branch information
Showing
11 changed files
with
195 additions
and
291 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,56 +1,41 @@ | ||
import React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { connect } from 'react-redux'; | ||
import { useSelector, useDispatch } from 'react-redux'; | ||
import { Redirect } from 'react-router-dom'; | ||
import actions, { loginPending } from './authActions'; | ||
import actions from './authActions'; | ||
|
||
export function Callback({ | ||
location, | ||
message, | ||
handleAuthCallback, | ||
loginInProgress, | ||
}) { | ||
// FIXME: Workaround to make the <Redirect /> to work | ||
loginInProgress(); | ||
function Callback({ location }) { | ||
const { isAuthenticated, isFetching, message } = useSelector((state) => state.auth); | ||
const dispatch = useDispatch(); | ||
// Handle authentication if expected values are in the URL. | ||
if (/access_token|id_token|error/.test(location.hash)) { | ||
handleAuthCallback(); | ||
return <Redirect to="/dashboard" /> | ||
dispatch(actions.handleAuthCallback()); | ||
} | ||
|
||
const callbackMsg = message || 'Authenticating...'; | ||
|
||
return ( | ||
<div className="authLoading"> | ||
<span className="oi oi-shield" /> | ||
<h3>{callbackMsg}</h3> | ||
</div> | ||
<> | ||
{isFetching && !isAuthenticated ? ( | ||
<div className="authLoading"> | ||
<span className="oi oi-shield" /> | ||
<h3>{message || 'Authenticating...'}</h3> | ||
</div> | ||
) : ( | ||
<Redirect to="/dashboard" /> | ||
)} | ||
</> | ||
); | ||
} | ||
|
||
Callback.propTypes = { | ||
location: PropTypes.shape({ | ||
hash: PropTypes.string, | ||
}), | ||
message: PropTypes.string, | ||
handleAuthCallback: PropTypes.func.isRequired, | ||
loginInProgress: PropTypes.func.isRequired, | ||
}; | ||
|
||
Callback.defaultProps = { | ||
location: { | ||
hash: '', | ||
}, | ||
message: '', | ||
}; | ||
|
||
const mapStateToProps = (state) => ({ | ||
message: state.auth.message, | ||
}); | ||
|
||
const mapDispatchToProps = (dispatch) => ({ | ||
handleAuthCallback: () => dispatch(actions.handleAuthCallback()), | ||
loginInProgress: () => dispatch(loginPending()), | ||
}); | ||
|
||
export default connect(mapStateToProps, mapDispatchToProps)(Callback); | ||
export default Callback; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.