netlify[bot]
commented
4 days ago Deploy Preview for mozilla-perfcompare ready!
| Name | Link |
|---|---|
| Latest commit | caa1a7cfcd6ce93cd12c6fe657e32c834653645a |
| Latest deploy log | https://app.netlify.com/sites/mozilla-perfcompare/deploys/6708021c4e1b2700080ef10b |
| Deploy Preview | https://deploy-preview-783--mozilla-perfcompare.netlify.app |
| Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
To edit notification comments on pull requests, go to your Netlify site configuration.
Overview:
This pull request implements functionality to persist column filters in the URL. Users can now refresh the page and maintain their selected filters, improving the overall user experience. This fixes issue #765.
Changes Made:
Implemented the useEffect hook that reads the filter parameters from the URL when the component mounts, ensuring that the selected filters are applied even after a page refresh.
https://github.com/user-attachments/assets/346bc010-2855-4e3b-9c44-feac5235947a
https://github.com/user-attachments/assets/3cf763ad-90f0-4ac4-8eb6-f62208f88f91
Update the URL with the applied filters in the existing onToggleFilter method, allowing users to share the URL and they will see the same filtered results.
https://github.com/user-attachments/assets/5632152f-db30-4f26-b5c0-0739e3b69dad
https://github.com/user-attachments/assets/1be944b7-acf5-4f67-a52d-433d1473e2d0
This functionality is implemented in the existing onToggleFilter and onClearFilter methods, where parameters are dynamically added or deleted. I utilised the existing useRawSearchParams custom hook to prevent unnecessary page re-rendering. This ensures that the URL dynamically updates as filters are added or removed.
https://github.com/user-attachments/assets/e62c9ed8-f1b4-495b-a0ef-f8fca199659e
https://github.com/user-attachments/assets/4ad43c32-7981-4dde-be01-d11327b4076e