Light
Dark
System
Ask  Question

Dashboard page appears for a fraction of a second when not logged in

Hi,

Templates have a behavior of showing the dashboard page for a fraction of a second, even when the user is not logged in. When accessing the app made with the template, it shows the dashboard screen for a fraction of a second and then the user is redirected to the login page, causing a bad experience.

Is this behavior possible to change?

I don"t want to show the inside of the system to a user who is not registered.

Thanks!
MB

PS. Using VUE in 8.1.5 Metronic version
user
Mateus Bonadiman 7 months ago
Vue
3 Answers
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 (3)

user
Lauris Stepanovs Author7 months ago
Hi Mateus,

Do you use the same redirect functionality as it is in the latest Metronic?

We redirect unauthenticated users to the sign-in page and dashboard page shouldn"t appear.

Check router/index.ts.
if (to.meta.middleware == "auth") {
 if (store.getters.isUserAuthenticated) {
 next();
 } else {
 next({ name: "sign-in" });
 }
 } else {
 next();
 }



Regards,
Lauris Stepanovs,
Keenthemes Support Team
user
Mateus Bonadiman 7 months ago
Hi Lauris,

Implement the code, but even so the behavior remains the same, ie it didn"t work.

Any other idea?

BR,
MB
user
Lauris Stepanovs Author7 months ago
This code shouldn"t allow the unauthenticated user to see the dashboard page.

Were you able to reproduce this issue on our preview page?
https://preview.keenthemes.com/metronic8/vue/demo1/#/dashboard

As an alternative solution, you can use v-if directive in src/layouts/main-layout/MainLayout.vue.

Add new computed property:
const isUserAuthenticated = computed(() => {
 return store.getters.isAuthenticated();
});



Then you can use it on the root element to hide the layout for unauthenticated users.
<div
 v-if="isUserAuthenticated"
 class="d-flex flex-column flex-root app-root"

 >

 </div>



Regards,
Lauris Stepanovs,
Keenthemes Support Team
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  :(

Metronic

Go to MetronicDownloadsPurchase MetronicRefunds

React Dev Vacancy

KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
keenthemes mega bundle