Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $9
Get for 99$

Why I am getting two header in top of the page


Hi,

I discovered a bug in the Metronic React Demo-1 Bootstrap admin template. The issue occurs when navigating to any undefined route. The application correctly redirects to the 404 error page at <a>"http://localhost:5173/metronic8/react/demo1/error/404"<a/>. However, after clicking the "Return Home" button, which redirects to "http://localhost:5173/metronic8/react/demo1/dashboard", resizing the screen triggers an error.

I've attached an image for reference. Please note that this error is not limited to the local environment; it also occurs in production. i dont know how can i attach image , thats why i attach a public image link please check it out https://ibb.co/dDdMXj2


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)


Hi,

Do you have a similar problem on our preview page?
https://preview.keenthemes.com/metronic8/react/demo1/dashboard

Can you please attach a message of your error?

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi Lauris,

Thank you for your response.

I checked the preview page at https://preview.keenthemes.com/metronic8/react/demo1/dashboard, and I didn't encounter the broken URL issue there. However, the problem I'm experiencing occurs when navigating to a broken link, which redirects to the 404 error page at https://preview.keenthemes.com/metronic8/react/demo1/error/404.

If you add any broken links that trigger the 404 error page, you should be able to replicate the issue. Specifically, after being redirected to the 404 page, if you click the "Return Home" button to go back to the dashboard, resizing or zooming in and out of the browser window results in two headers appearing at the top of the page.

I hope this helps clarify the issue. Let me know if you need further details.



Hi,

Sorry for the late reply.

Unfortunately, we were unable to reproduce this error in the latest version of Metronic.

Have you made any changes to our codebase, or is this error occurring with the default package?

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi Lauris,

Thank you for your response.

No, I haven't made any changes to the codebase. I simply added a few broken links to the dashboard page, such as:

External Links
Avg. Client Rating
Instagram Followers
Google Ads CPC

These links point to routes that don't exist, so when clicked, they redirect to the 404 error page. After being redirected to the 404 page, if I return to the dashboard by clicking the "Return Home" button and then resize or zoom in/out the browser window, I notice that two headers appear at the top of the page.

Could you please look into this issue?

Thank you.



Hi,

We tested this further but still couldn't get the same result.

Could you please specify which version of Metronic you are using?

By "broken route," do you mean a non-existent route?

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  :(