search

jalaj711 / gastos-frontend

Frontend for Gastos - A finance tracker with multiple wallet support, custom color coded labels, complex search filters and spend insights
MIT License
1 stars 0 forks source link

Adding search filters to transactions page using URL search params does not work #6

Closed jalaj711 closed 1 year ago

jalaj711 commented 1 year ago

The transactions page is supposed to extract search filters from the URL search params at initial load. This helps in smooth transitions from other pages, like wallets/[id].tsx. This functionality helps to view transactions from a certain wallet by simply clicking on the 'View All' button on that page.

However, this functionality does not seem to work. This needs to be fixed.

jalaj711 commented 1 year ago

This seems to because of asynchronicity with setState function and how we use it. The getTransaction() function loads the search params from the state:

https://github.com/jalaj711/finance-tracker/blob/36daba7a7a83e6a1ed7e2ce68be870a42de06cd2/pages/transactions.tsx#L56-L62

And the initial filters are extracted from the URL in a useEffect() hook:

https://github.com/jalaj711/finance-tracker/blob/36daba7a7a83e6a1ed7e2ce68be870a42de06cd2/pages/transactions.tsx#L100-L105

sets the state accordingly and then calls the getTranscation function. However, probably this is where the problem lies. Maybe, getTransaction() is being called before the state actually updates, causing the initial filters to be ineffective, even if they are reflected in the UI.