Christmas Sale! Limited Time Only - Enjoy 30% Off Metronic Extended License!
Buy for 669$  969$

Route Problem


I'm using Mobx as state management
When I Refresh the page it goes back to the login page and then after checking the token with the server to log in the user then redirect to the dashboard
each time I refresh the page
My Route

return (
<>
<ToastContainer position='bottom-right' hideProgressBar />
<Switch>
{!userStore.isLogedIn ? (
<>
<Route>
<AuthPage />
</Route>
<Route path='/error' component={ErrorsPage} />
<Route path='/logout' component={Logout} />
</>
) : (
<>
<MasterLayout>
<PrivateRoutes />
</MasterLayout>
</>
)}
</Switch>
<MasterInit />
</>
)


Private Route

return (
<Suspense fallback={<FallbackView />}>
<Switch>
<Route path='/dashboard' component={DashboardWrapper} />
<Route path='/builder' component={BuilderPageWrapper} />
<Route path='/menu-test' component={MenuTestPage} />
<Route path='/master/item/category' component={ItemCategory} />
<Redirect from='/auth' to='/dashboard' />
<Redirect exact from='/' to='/dashboard' />
<Redirect to='error/404' />
</Switch>
</Suspense>
)


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (5)


I Check Your demo 1 of react also without Mobx the problem is still not solved



Hi Arifullah!

Sorry, looks like something broke since the last update.
I already created a task for this bug, we will take a look at this and provide a fix as soon as possible.



This issue is fixed in Metronic v8.0.35 release.



Hi The problem still exists after updating to v 34
I'm not using your models and redux I use Mobx

the above code is the same as yours but I only changed is authorized to isLogedIn from my store
when I refresh the page it goes to Auth page then redirect to the dashboard

this route when I refresh
http://localhost:3011/master/item/category


Thanks



It is a bug, it happens because accessTokne is undefined.
The name in files Registration.tsx and Login.tsx doesn't match the actual name from the API.

We will include a fix in the upcoming Metronic v8.0.34 release.

Now as a temporary solution you can update the following files:
1)src/app/modules/auth/models/AuthModel.ts, replace accessToken property with access_token.
2)Update src/app/modules/auth/components/Registration.tsx and src/app/modules/auth/components/Login.tsx, in onSubmit function accessToken variable must be access_token as well.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(