EnAccess / micropowermanager

Open Source Management Tool for Decentralized Utilities.
https://micropowermanager.io/
MIT License
2 stars 2 forks source link

Fix some sidebar highlighting #118

Closed dmohns closed 3 months ago

dmohns commented 3 months ago

Problem

This PR tries to address some highlight bugs in the Sidebar. In particular there are two:

  1. When manoeuvring to /tickets the first time the highlighting doesn't work. Only when the user clicks again on Tickets/List it will appear.

Initial: image

Second time: image

  1. When users browser through any paginated list, the highlighting breaks as well

After clicking on >

image

Solution

The solution for this problem turned out to be pretty entangled into the code base. In short

  1. There is a weird, cyclic interaction in this.term = this.$route.query. From what I understand the fact that complex objects are passed by reference we are creating a loop in because the Paginator (Vue component) mounted we are calling this.loadPage, which triggers this.paginator.loadPage which in term modifies the query.
  2. The second problem was related to handling of query params. This can be resolved be using the exact-path which unfortunately isn't well documented but solves the problem