Routing.js 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. import { InputForm, CRegisterForm, CLoginForm } from './LoginRegisterLogout'
  2. import { Router, Route, Redirect, Switch } from 'react-router-dom'
  3. import { CExplorePosts } from '../pages/explorePosts'
  4. import { CPostForFeed, Feed } from '../pages/feedPosts'
  5. import { CPostEditor } from '../pages/createAndEditPost'
  6. import { CPageAboutUser } from '../pages/profilePage'
  7. import { CPost } from '../pages/onePost'
  8. import { Provider, connect } from 'react-redux'
  9. const Routing = ({ token }) => {
  10. return <>
  11. {token ?
  12. <Switch>
  13. <Route path="/profile/:_id" component={CPageAboutUser} />
  14. <Route path="/explore" component={CExplorePosts} />
  15. <Route path="/edit/post/:_id" component={CPostEditor} />
  16. <Route path="/post/:_id" component={CPost} />
  17. <Route path="/feed" component={CPostForFeed} />
  18. <Redirect from="/*" to="/feed" />
  19. </Switch>
  20. :
  21. <Switch>
  22. <Route path="/login" exact component={CLoginForm} />
  23. <Route path="/register" component={CRegisterForm} />
  24. <Route path="/input" component={InputForm} />
  25. <Redirect from="/*" to="/input" />
  26. <CProtectedRoute
  27. roles={['anon']}
  28. fallback="/*"
  29. path="/input"
  30. component={InputForm}
  31. />
  32. </Switch>
  33. }
  34. </>
  35. }
  36. export const CRouting = connect((state) => ({
  37. token: state.auth?.token,
  38. }))(Routing)
  39. const ProtectedRoute = ({
  40. roles = [],
  41. fallback = '/login',
  42. component,
  43. auth,
  44. ...routeProps
  45. }) => {
  46. const WrapperComponent = (renderProps) => {
  47. const C = component
  48. if (!auth) auth = ['anon']
  49. let intersection = auth.filter((x) => roles.includes(x))
  50. if (intersection.length == 0) return <Redirect to={fallback} />
  51. return <C {...renderProps} />
  52. }
  53. return <Route {...routeProps} component={WrapperComponent} />
  54. }
  55. const CProtectedRoute = connect((state) => ({
  56. auth: state.auth?.payload?.sub.acl,
  57. }))(ProtectedRoute)