Advertisement
Guest User

Untitled

a guest
May 26th, 2016
56
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.05 KB | None | 0 0
  1. import React from 'react';
  2. import { Route, IndexRoute } from 'react-router';
  3.  
  4. export default (
  5. <Route path="/" component={App}>
  6. <IndexRoute component={Landing} />
  7. <Route path="learn" component={Learn} />
  8. <Route path="about" component={About} />
  9. <Route path="downloads" component={Downloads} onEnter={requireAuth} />
  10. </Route>
  11. )
  12.  
  13. import React from 'react';
  14. import { Route, IndexRoute } from 'react-router';
  15.  
  16. export const getRoutes = (store) => (
  17. const authRequired = (nextState, replaceState) => {
  18. // Now you can access the store object here.
  19. const state = store.getState();
  20.  
  21. if (!state.user.isAuthenticated) {
  22. // Not authenticated, redirect to login.
  23. replaceState({ nextPathname: nextState.location.pathname }, '/login');
  24. }
  25. };
  26.  
  27. return (
  28. <Route path="/" component={App}>
  29. <IndexRoute component={Landing} />
  30. <Route path="learn" component={Learn} />
  31. <Route path="about" component={About} />
  32. <Route path="downloads" component={Downloads} onEnter={authRequired} />
  33. </Route>
  34. );
  35. )
  36.  
  37. <Provider store={ store }>
  38. <Router history={ history }>
  39. { getRoutes(store) }
  40. </Router>
  41. </Provider>
  42.  
  43. const authRequired = (nextState, replaceState, callback) => {
  44. store.dispatch(requireAuth()) // Assume this action returns a promise
  45. .then(() => {
  46. const state = store.getState();
  47.  
  48. if (!state.user.isAuthenticated) {
  49. // Not authenticated, redirect to login.
  50. replaceState({ nextPathname: nextState.location.pathname }, '/login');
  51. }
  52.  
  53. // All ok
  54. callback();
  55. });
  56. };
  57.  
  58. var requireAuth = (store, nextState, replace) => {
  59. console.log("store: ", store);
  60. //now you have access to the store in the onEnter hook!
  61. }
  62.  
  63. export default (store) => {
  64. return (
  65. <Route path="/" component={App}>
  66. <IndexRoute component={Landing} />
  67. <Route path="learn" component={Learn} />
  68. <Route path="about" component={About} />
  69. <Route path="downloads" component={Downloads} onEnter={requireAuth.bind(this, store)} />
  70. </Route>
  71. );
  72. );
  73.  
  74. export default (store, history) => {
  75. return (
  76. <Router history={history}>
  77. <Route path="/" component={App}>
  78. { /* Home (main) route */ }
  79. <IndexRoute component={HomeContainer}/>
  80. <Route path="post/:slug" component={PostPage}/>
  81. { /* <Route path="*" component={NotFound} status={404} /> */ }
  82. </Route>
  83.  
  84. <Route path="/admin" component={requireAuthentication(AdminContainer)}>
  85. <IndexRoute component={PostList}/>
  86. <Route path=":slug/edit" component={PostEditor}/>
  87. <Route path="add" component={PostEditor}/>
  88. </Route>
  89. <Route path="/login" component={Login}/>
  90. </Router>
  91. );
  92. };
  93.  
  94. export default function requireAuthentication(Component) {
  95. class AuthenticatedComponent extends React.Component {
  96.  
  97. componentWillMount () {
  98. this.checkAuth();
  99. }
  100.  
  101. componentWillReceiveProps (nextProps) {
  102. this.checkAuth();
  103. }
  104.  
  105. checkAuth () {
  106. if (!this.props.isAuthenticated) {
  107. let redirectAfterLogin = this.props.location.pathname;
  108. this.context.router.replace({pathname: '/login', state: {redirectAfterLogin: redirectAfterLogin}});
  109. }
  110. }
  111.  
  112. render () {
  113. return (
  114. <div>
  115. {this.props.isAuthenticated === true
  116. ? <Component {...this.props}/>
  117. : null
  118. }
  119. </div>
  120. )
  121.  
  122. }
  123. }
  124.  
  125. const mapStateToProps = (state) => ({
  126. isAuthenticated: state.blog.get('isAuthenticated')
  127. });
  128.  
  129. AuthenticatedComponent.contextTypes = {
  130. router: React.PropTypes.object.isRequired
  131. };
  132.  
  133. return connect(mapStateToProps)(AuthenticatedComponent);
  134. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement