DEV Community

earlman
earlman

Posted on

2

Small Wins - A Seamless Bug Fix

So I was having an issue where my app wouldn't load once the user logged in.

Image description

The new "Timeline View" in Vuex Dev Tools was a huge help in dialing-in on where the problem was. I've been using it all week and it's incredibly well-built.

Image description

I initially thought that the route was being loaded before the AppConfig and UserConfig had a chance to be pulled from firebase. Looking at the code, I realized that I wasn't even pulling them from Firebase at all ๐Ÿ˜… More specifically, I pulled the config in on the initial page load, but not when the user logged in.

Image description

I really love the first time I'm able to implement a piece of knowledge seamlessly. In this case, it was the Promise.all function. In this case, I wait for both fetchAppConfig and fetchUserConfig to load before updating the router:

Image description

note: ToastError and ToastNotifications are just wrappers for Buefy component

I also made sure to notify the user before calling the promises. It could take a second to load the database and it might confuse users if there's no response on the page to clicking "Log In" button.

Final solution looks and feels great ๐Ÿ˜Š

Image description

AWS Security LIVE!

Join us for AWS Security LIVE!

Discover the future of cloud security. Tune in live for trends, tips, and solutions from AWS and AWS Partners.

Learn More

Top comments (0)

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post