How to implement a single product page in React & Redux?

Question

JavaScript

I am making an online store. All products are taken from the json file in the Reducer and then rendered on the Products page. Implemented transition to a separate product page using react-router. The problem is that when the .../products/id page is reloaded, the data from the redax is deleted and, accordingly, the application will break.
product page code

function Single() {
  const params = useParams();
  const products = useSelector((state) => ({
    products: state.productsReducer.products,
  }));

  const findProductById = products.products.filter((product) => product.id === params.productId);
  const product = findProductById[0];
  ...