How to implement this in React or JS?

Question

Laravel

Hello. there is a little task. But since I did not do this, I do not understand how it should be implemented. and how it will be better. Please help.
I need to make a product page layout. But the fact is that it has elements (selects, lists, etc.), the data from which is loaded from arrays in separate JS files. there is a product filter in the layout, which should work and should be saved when the page is reloaded.
There is an assumption that data from files should be loaded by imports. The filter should work with writing to cookies or local storage, and if in React, then probably through routes ????
How to implement this correctly?

Answer 1

The point is that the blade template engine does not work in js files. And in your javascript, you use the laroute package to solve this issue , which passes all laravel routes to javascript, it generates a laroute.js file, include it in your html template and use it in javascript like this:
laroute.route('cart.store')

Answer 2

https://github.com/tightenco/ziggy

Answer 3

Well, from time immemorial, when a user changed something in filters, pagination, etc., it was saved in the get parameters of the url.
Using session\local storage is also acceptable. The choice of how to do it depends, rather, on the TK.
But through the parameters it looks, as for me, a more correct option.